Cara Membuat Element Terlarang Di Dalam Kotak Komentar

Diposting oleh Keiruchan Agatha on Kamis, 25 Oktober 2012

Markup Validation Service



Sesuai judul di atas kali ini saya akan share cara untuk memodifikasi kotak komentar blogger. Mungkin anda pernah melihat kotak komentar yang dapat memasukan video, gambar, emoticon dan elemen terlarang di dalam komentar, nah kali ini saya akan menjelaskan cara membuatnya secara lengkap dari cara mengizinkan elemen terlarang masuk ke dalam komentar sampai membuat pesan formulir komentar keren.

Berikut langkah - langkahnya :

A. Cara mengizinkan video,gambar,emoticon dan elemen terlarang masuk kedalam kotak komentar.

1. Masuk di dasbor blogger
2. Klik Template / Rancangan
3. Klik Edit HTML
4. Klik Prooced / Lajutkan ( jika editor baru )
5. Cari kode </body>
6. Simpan kode di bawah ini di atas kode

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<script src='https://notezone.googlecode.com/svn/trunk/jQuery.js' type='text/javascript'/>
</b:if>

7. Cari lagi kode </head> setelah ketemu simpan kode di bawah ini di atas kode tersebut

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style type='text/css'>
/* Add More Features to the Blogger Comments by Keiruchan Agatha */
img.emo {
  display:inline-block;
  vertical-align:middle;
}
#comment-holder .cm-youtube {
  display:block;
  border:none !important;
  background-color:#333;
  width:370px;
  height:218px;
  margin:0 auto 30px;
}
#comment-holder .cm-image {
  display:block;
  margin:0 auto 15px;
  outline:none;
  border:1px solid #ccc;
  background-color:white;
  -webkit-box-shadow:0px 1px 3px rgba(0,0,0,0.2);
  -moz-box-shadow:0px 1px 3px rgba(0,0,0,0.2);
  box-shadow:0px 1px 3px rgba(0,0,0,0.2);
  padding:2px;
  max-width: 95%;
}
#comment-holder code,
#comment-holder i[rel="code"] {
  font:normal 12px Monaco,"Courier New",Monospace;
  color:blue;
}
#comment-holder pre,
#comment-holder i[rel="pre"] {
  display:block;
  font:normal 12px Monaco,"Courier New",Monospace;
  background-color:#333;
  color:white;
  padding:0.5em 1em;
  word-wrap:normal;
  white-space:pre;
  overflow:auto;
}
#comment-holder blockquote,
#comment-holder b[rel="quote"] {
  margin:0 2%;
  background-color:#eee;
  padding:1em 1.2em;
  border-left:4px solid #7498AD;
  display:block;
  font-weight:bold;
  font-style:italic;
}
#comment-holder i[rel="image"],
#comment-holder i[rel="youtube"] {
  display:block;
  overflow:hidden;
  border:2px solid black;
  position:relative;
  width:170px;
  height:100px;
  margin:0 auto 30px;
}
#comment-holder i[rel="image"]:before,
#comment-holder i[rel="youtube"]:before {
  content:"Please enable your JavaScript to see this image!";
  position:absolute;
  top:0;
  right:0;
  bottom:0;
  left:0;
  background-color:red;
  color:white;
  font-weight:bold;
  text-align:center;
  padding:15px 0;
}
#comment-holder i[rel="youtube"]:before {
  content:"Please enable your JavaScript to watch this video!";
}
</style>
</b:if>

8. Simpan Template

Cara Penggunaan Kode

1. Untuk penggunaan gambar silahkan anda gunakan tag
[img]URL Gambar[/img] atau <i rel="image">URL Gambar</i>
2. Untuk penggunaan video silahkan anda gunakan tag
[youtube]URL Video[/youtube] atau <i rel="youtube">URL YouTube</i>
3. Untuk Emoticon anda bisa gunakan seperti ini.
:) :( =( :s ^_^ :D =D ^:D @@, ;) :-bd :-d :'( :'( T_T :\ :p B) :Q :Ozz 7:( \o/ \m/ <3 0:) ^o^ :-a 7:O *fck* xV x@ X@ ~x( ''J :W
4. Memasukan kode bisa menggunakan tag
[code]Kode Anda[/code] atau <i rel="code">Kode Anda</i>
5. Memasukan kode html / css / jquery bisa menggunakan
[pre]Kode Anda[/pre] atau <i rel="pre">Kode Anda</i>
6. Menggunakan blockquote di komentar bisa menggunakan tag
[blockquote]Kata-kata Anda[/blockquote] atau <b rel="quote">Kata-kata Anda</b>

Sekarang anda sudah bisa memasukan video, gambar, emoticon dan elemen terlarang kedalam kotak komentar. 

Oh ia 1 lagi, bahwa dalam penggunaan kode ini tidak semua template bisa mengaktifkan fitur ini...



Share Please :

Posted by : Keiruchan Agatha ~ / Portal Media Informasi Pilihan

Markup Validation Service
Anda telah membaca artikel Cara Membuat Element Terlarang Di Dalam Kotak Komentar Ditulis oleh Keiruchan Agatha pada Kamis, 25 Oktober 2012. Kritik dan saran dapat disampaikan via kotak komentar. Anda diperbolehkan mengcopy paste atau menyebar-luaskan artikel ini, namun jangan lupa untuk meletakkan link yang ada di bawah sebagai sumbernya. Atas perhatiannya saya ucapkan terimakasih. Salam blogger and Happy blogging.

Baca Yang Ini Juga Boz :

{ 2 komentar... read them below or add one }

Fachrul Akbar Tirtawidjaja mengatakan...

nice postingan nya...
kunjungan balik ya...
blog-fachrul.blogspot.com

Keiruchan Agatha mengatakan...

@Fachrul Akbar Tirtawidjajaokok :-bd

Posting Komentar

Silahkan tinggalkan komentar anda dengan tidak meninggalkan link. Jika ada kesalahan dalam artikel ini dan jika ada saran dan kritik silahkan tulis komentar anda dibawah dengan baik dan sopan... ;)
Dan jika kedapatan link yang mati dalam penempatan software atau game harap beritahukan agar segera diperbaiki...

 
Markup Validation Service Markup Validation Service Markup Validation Service Markup Validation Service Markup Validation Service