Membuat Author Box Responsive Dengan Rotate Zoom

Author Box Responsive Dengan Rotate Zoom

Membuat Author Box Responsive Dengan Rotate Zoom shadows akan share untuk anda semua, tetapi sebenarnya ini atas permintaan dari seorang blogger dari benua eropa sana, yang ingin tampilan blog dia berpenampilan yang cukup baik dan ingin mengisi biografy mengenai dirinya, Maka saya share widget ini untuk dia pergunakan, anda juga bisa pergunakan ini widget karena bentuknya cukup elegant dan image rotate dan ada satu hal lagi nama author itu selalu dan setiap saat per 8 detik selalu berganti warna nah cukup kerenkan widget seperti ini.
Bagaimana keren bukan jika anda menginginkannya Membuat Author Box Responsive Dengan Rotate Zoom marilah kita lihat kode CSS3 dibawah ini :

1. Anggap saja anda sudah berada di blog sobat.

2. Klik Template > Edit HTML lalu pergunakan CTRL+F agar cepat pencarian cari ]]>
    </b:skin>

3. Lalu letakkan CSS ini tepat diatasnya.

/* Css Author Box */

#aboutme {background-color:#fff; -moz-box-shadow:0 0 3px #e0e0e0;-webkit-box-shadow:0 0 3px #e0e0e0;box-shadow:0 0 3px #e0e0e0;border:1px solid #666;padding:3px;-moz-border-radius:2px;-webkit-border-radius:2px;border-radius:2px; margin:0 auto;margin-top:15px;padding:10px;max-width:600px;height:auto;margin:5px;}
.name-author {margin:0 0 7px;display:block;width:100%;}
.name-author h3 {position:relative;display:inline;background-color:#E67E22;color:#FFF;font-family:Segoe UI; font-size:15px;font-weight:bold;margin:0 0 0 -3px;padding:3px 5px 4px 9px;width:100%;-moz-text-shadow:0 1px 0 black;-webkit-text-shadow:0 1px 0 black;text-shadow:0 1px 0 black;}
.name-author h3:after {content:" ";width:0;height:0;position:absolute;left:100%;top:0;border-width:13px; border-style:solid;border-color:transparent transparent transparent #E67E22;}
@-webkit-keyframes name-author {0% {color:white} 20% {color:Orange}40% {color:pink}60% {color:Orchid}80% {color:gold}100% {color:white}}
@-moz-keyframes name-author {0% {color:white}20% {color:Orange} 40% {color:pink} 60% {color:Orchid} 80% {color:gold} 100% {color:white}}
@-keyframes name-author {0% {color:white} 20% {color:Orange} 40% {color:pink} 60% {color:Orchid} 80% {color:gold} 100% {color:white}}

/* Efek Element Author Box */

.name-author h3 {animation:8s infinite name-author linear;-webkit-animation:10s infinite name-author linear;}
.aboutme-text {font-size:14px;text-align:left;margin:0;}
.aboutme-image-container {float:left;width:70px;height:70px;margin-right:75px;z-index:1;}
.aboutme-image-container {margin:-20px 0 5px 0;padding:9px;position:relative;-webkit-border-bottom-right-radius:10px;-webkit-border-bottom-left-radius:100%;-moz-border-radius-bottomright:100%;-moz-border-radius-bottomleft:100%;border-bottom-right-radius:100%;border-bottom-left-radius:100%;-webkit-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666;-moz-box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666;box-shadow:inset 0 0 25px rgba(0,0,0,0.3),0px 1px 5px #666;background-color:#F22613;}
.aboutme-image-container:before {content:' ';position:absolute;top:0;left:-10px;width:0;height:0;border-style:solid;border-width:0 0 10px 10px;border-color:transparent transparent #333 transparent;}
.aboutme-image-container:after {content:' ';position:absolute;top:0;right:-10px; width:0; height:0;border-style:solid;border-width:10px 0 0 10px;border-color:transparent transparent transparent #333;}
.aboutme-image-container img {width:100%;height:100%;border:2px solid yellow;border-radius:100%;-webkit-transition:all 0.3s ease;-moz-transition:all 0.3s ease;transition:all 0.3s ease;-moz-box-shadow:1px 1px 4px #000;-webkit-box-shadow:1px 1px 4px #000;box-shadow:1px1px 4px #000;}
.aboutme-image-container img:hover {border:2px solid GOld;cursor:pointer;margin-left:0;-moz-transform:scale(1.2) rotate(360deg);-webkit-transform:scale(1.2)rotate(360deg);-o-transform:scale(1.2)rotate(360deg);-ms-transform:scale(1)rotate(-360deg);transform:scale(1.2)rotate(360deg);-moz-box-shadow:1px 1px 4px #000;-webkit-box-shadow:1px 1px 4px #000;box-shadow:1px 1px 4px #000;}

4. Meletakkan kode HTML kita cari kode ini  <data:post.body/>  atau <p>
    <data:post.body/></p> tepat dibawahnya. Semua ada lima ambil yang ketiga
    atau sesuaikan template anda karena sebuah
    template tidak sama tata letaknya.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='aboutme'><div class='aboutme-image-container'>
<img src='http://4.bp.blogspot.com/-6k4Mj5Xv82o/Vjo1ryPnmbI/AAAAAAAABKQ/3OTccAC7W7/s1600/nata.jpg'/></div>
<div class='name-author'><h3>Andre Lee</h3></div>
<div class='aboutme-text'>
~>> Enter Your Description Here <<~
</div></div>
</b:if>

 Keterangan : Warna merah ganti dengan url gambar anda.
                       Warna biru ganti dengan nama author anda.
                       Warna orange isikan kata anda sendiri.

Baca juga disini : http://shadows-k.blogspot.co.id/2015/11/related-post-thumbnail-dan-feedburner.html

Demikianlah Membuat Author Box Responsive Dengan Rotate Zoom yang telah saya share kepada anda semoga tampilan blog anda semakin lebih baik, dan juga bermanfaat untuk kedepannya jika ada pertanyaan silahkan komentar dibawah ini.

Alternatif Followers Blog Widget Dengan Link

Widget Dengan Link
Alternatif Followers Blog Widget Dengan Link
Kembali kita bertemu dalam postingan saya ini yang akan memberikan solusi untuk sebuah blog anda, Alternatif Followers Blog Widget Dengan Link ini sangatlah simple dan bisa di kreasikan menurut anda baik dan terlihat cantik di blog. Followers blog widget ini akan terasa ringan di waktu loading dan dari segi penampilannya cukup ramping, nah solusi ini tanpa terlihat widget tersaebut tetapi bisa digunakan lumayankan untuk beban loading blog, dari segi keuntungannya adalah pengunjung akan terasa penasaran dengan link ini atau tombol yang anda kreasikan sehingga dibawa ke Alternatif Followers Blog Widget Dengan Link dan mengklik mengikuti blog anda. Sebelum atau ingin menggunakan solusi ini anda harus mengetahui dahulu bolg id anda sendiri karena ini sangatlah penting untuk penggunaannya, lihat gambar dibawah ini.

Blog Id


Setelah anda ketahui Blog Id anda isi data dibawah ini untuk di tempelkan ke blog.

1. Dengan link text :
   <a href='http://www.blogger.com/follow-blog.g?blogID=xxxxxxxxxxxxxxxx'
   target='_blank'>Follow Blog Ini</a>

2. Dengan link button :
   <a href='http://www.blogger.com/follow-blog.g?blogID=xxxxxxxxxxxxxxxx'
   target='_blank'><button>Follow Blog Ini</button></a>

3. Dengan link gambar :
   <a href='http://www.blogger.com/follow-blog.g?blogID=xxxxxxxxxxxxxxxx'
   target='_blank'><img border='0' src='http://LINK GAMBAR ANDA'/></a>

Ganti xxxxxxxxxxxxxxxx dengan ID Blog Anda.

Ganti LINK GAMBAR ANDA dengan link gambar yang Anda Upload.

Untuk penempatan Alternatif Followers Blog Widget Dengan Link bisa anda letakkan di sidebar, footer. dalam menu horizontal anda juga bisa yang menurut anda terlihat ramping dan bersih dari sebuah widget.

Alternatif Followers Blog Widget Dengan Link sudah selesai anda buat dan selamat berkreasi menurut kata hati anda sendiri semoga bermanfaat.

Cara Buat Widget Alexa Terbaru

Widget Alexa Terbaru
SHADOWS akan mengulas balik mengenai Alexa Rank dan Cara Buat Widget Alexa Terbaru untuk anda sekalian yang khususnya buat pemula dan baru belajar blog. Alexa sendiri berfungsi sangatlah berarti untuk kelangsungan sebuah blog yang bilamana nantinya akan menghasilkan pendapatan dari berdirinya sebuah blog anda.

Alexa akan mengukur rank anda dan aktifitas anda selama ngeblog dan akan tercatat di sebuah widget yang terpasang di blog anda bisa disidebar, footer. Jika di blog anda belum terpasang widget Alexa ini dan Cara Buat Widget Alexa Terbaru akan saya beberkan secara detail kepada anda yang ingin memasangnya, cara pemasangan widget ini sangatlah mudah dan pasti semua anda sekalian pasti bisa dan terpasang dengan sangat manisnya di blog kesayangan anda itu.

Fungsi dari widget alexa rank selain mempromosikan blog bagi para pengiklan, juga di gunakan sebagai pengukur data oleh alexa.com. Dengan memasang widget alexa rank di blog, maka perhitungan akan lebih akurat dari pada tidak memasangnya. Oleh sebab itu, jika Anda tidak memasang widget Alexa, saya yakin Anda akan merugi besar.

Nah sudah cukup mengertikan apa dan fungsinya dari sebuah widget ini, marilah kita menuju tkp pemasangan widget.

Pertama : Anda masuk ke DASHBOARD > TATA LETAK > ADD WIDGET > HTML/JAVASCRIPT.

Kedua : Masukkan kode script ini kedalam HTML/JAVASCRIPT yang tadi anda buka.

Silahkan copy paste dengan kode sebagai berikut :

Pertama :

Alexa 1

Kode script :

<a href="http://www.alexa.com/siteinfo/yoursite.com">
<script type="text/javascript" src="http://xslt.alexa.com/site_stats/js/t/a?url=yoursite.com"></script></a>

Kedua :

Alexa 2

Kode script :

<a href="http://www.alexa.com/siteinfo/yoursite.com">
<script type="text/javascript" src="http://xslt.alexa.com/site_stats/js/s/a?url=yoursite.com"></script></a>

NB : Ganti url yoursite.com dengan  url anda

Itulah Cara Buat Widget Alexa Terbaru yang sudah saya terangkan dan bagikan kepada anda sekalian semoga bermanfaat.

Membuat Widget Followers Blog Dengan Link

Followers Blog Dengan Link
SHADOWS pada pagi ini membagikan sebuah tips dan trik untuk anda yang memerlukan Membuat Widget Followers Blog Dengan Link , agar blog anda terlihat simple dan elegant di mata pengunjung. Sekiranya tips ini bisa untuk menjadikan solusi dalam menata blog secara profesional dalam pengembangan blog anda yang begitu rapih dan nyaman di mata pengunjung blog, sehingga pengunjung betah berlama lama di blog anda.

Biarpun di blog anda tidak terlihat Widget Followers Blog tetapi pengunjung tetap bisa menjadi followers anda dengan Membuat Widget Followers Blog Dengan Link yang anda buat. Nah untuk bagi yang berminat dengan harus mengetahui ID BLOG anda terlebih dahulu, karena ini penting untuk digunakan.

Caranya tidak sulit anda hanya membuka blog anda dan masuk ke dashboard anda nah lihat dibagian atas dashboard anda sebagai contoh lihat gambar dibawah ini.


Followers Blog Dengan Link 1


Jika sudah mengetahui anda silahkan copy dan isi dengan ID BLOG anda link dibawah ini :
1. Dengan link text :
   <a href='http://www.blogger.com/follow-blog.g?blogID=xxx1234567890xxx'
   target='_blank'>Follow Blog Ini</a>
   Ganti xxx1234567890xxx dengan ID Blog Anda.

2. Dengan link button :
   <a href='http://www.blogger.com/follow-blog.g?blogID=xxx1234567890xxx'
   target='_blank'<buton>Follow Blog Ini</button></a>
   Ganti xxx1234567890xxx dengan ID Blog Anda.

3. Dengan link gambar :
   <a href='http://www.blogger.com/follow-blog.g?blogID=xxx1234567890xxx'
   target='_blank'><img src='http://URL GAMBAR ANDA'/></a>
   Ganti xxx1234567890xxx dengan ID Blog Anda.
   Ganti URL GAMBAR ANDA dengan url gambar yang Anda sudah Upload.

Nah itulah blogger tips untuk anda gunakan sebagai penempatannya bisa di sidebar atau di footer. Bisa juga Membuat Widget Followers Blog Dengan Link diwidget HTML/JavaScript atau dimenu horizontal anda.

Semoga bermanfaat untuk anda semua, jika kurang mengerti layangkan komentar.

Cara Pasang Emoticons Pada Komentar Blogspot


Cara Pasang Emoticons Pada Komentar Blogspot
SHADOWS || Belakangan ini semakin banyak para blogger yang senang dengan tampilan blognya, agar terlihat uniq dan terkesan wah. Tentunya ini bukan sesuatu yang negatif, Cara pasang emoticons pada komentar blogspot kita bisa bertambah uniq. Hanya saja perlu diingat bahwa tidak semua hal yang menarik itu lantas harus ditempel di blog kita.

Kali ini saya mau membahas tentang bagaimana memasang emoticons pada komentar blogspot. Emoticons ini bisa membantu pengunjung blog anda untuk lebih mengekspresikan diri mereka dalam berkomentar. Bahkan menurut mata ( batin ) saya hehehee... Emoticons smiley ini juga mendorong pengunjung untuk memberi komentar.

Tapi sebelum menerapkan cara pasang emoticons pada komentar blogspot ini....harap perhatikan dulu blog anda. Kalau blog anda masih minim dengan atribut yang bla..bla, maka silahkan tambahkan emoticons smiley ini sebagai pemanis di blog . Tapi kalau blog anda sudah ramai dan padat seperti kota jakarta, maka saran saya sebaiknya pikirkan kedepannya sebelum menambah fitur atau widget baru.... Hal ini terkait waktu loading blog anda nantinya. Untuk cek berat blog anda lihat disini.

Cara menambahkan Emoticons Smiley Pada Blogspot:

    Masuk ke akun blogger anda
    Buka menu TEMPLATE > EDIT HTML
    Centang EXPAND TEMPLATE WIDGET
    Gunakan Ctrl+f untuk mencari kode ]]></b:skin>
    Tambahkan kode berikut tepat di atas ]]></b:skin>


.emoticonsmiley {background: none repeat scroll 0 0 #EFF5FB
 !important;font-size: small !important;padding: 5px
 !important;margin:auto !important;text-align: left !important;font-weight:bold !important;width:100% !important;-moz-background-clip: -moz-initial;-moz-background-origin: -moz-initial;-moz-background-inline-policy: -moz-initial;}
.emoticonsmiley span{padding-right: 3px !important;} img.brbsmly {height: auto !important;vertical-align: middle !important;width: auto !important;border:0px !important;}

Cari kode <b:if cond='data:post.embedCommentForm'>
Jika lebih dari satu, pilih yang dekat dengan kode <b:include data='post' name='comment-form'/>


<b:if cond='data:post.embedCommentForm'>

<b:include data='post' name='comment-form'/>

Copy paste semua kode di bawah ini tepat di bawah <b:if cond='data:post.embedCommentForm'>


<div class='emoticonsmiley'> <img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/1.gif'/> :)   
<span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/2.gif'/> 
:(</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/3.gif'/> 
;)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/4.gif'/> 
:D</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/5.gif'/> 
;;-)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/7.gif'/> 
:-/</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/8.gif'/> 
:x</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/10.gif'/> 
:P</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/11.gif'/> 
:-*</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/12.gif'/> 
=((</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/13.gif'/> 
:-O</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/14.gif'/> 
X(</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/15.gif'/> 
:7</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/16.gif'/> 
B-)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/17.gif'/> 
:-S</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/18.gif'/> 
#:-S</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/19.gif'/> 
7:)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/20.gif'/> 
:((</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/21.gif'/> 
:))</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/22.gif'/> 
:|</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/23.gif'/> 
/:)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/24.gif'/> 
=))</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/25.gif'/> 
O:-)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/26.gif'/> 
:-B</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/27.gif'/> 
=;</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/101.gif'/> 
:-c</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/100.gif'/> 
:)]</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/102.gif'/> 
~X(</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/103.gif'/> 
:-h</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/104.gif'/> 
:-t</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/105.gif'/> 
8-7</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/28.gif'/> 
I-)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif'/> 
8-|</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/29.gif'/> 
L-)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/31.gif'/> 
:-a</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/32.gif'/> 
:-$</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/33.gif'/> 
[-(</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/34.gif'/> 
:O)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/35.gif'/> 
8-}</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/36.gif'/> 
2:-P</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/37.gif'/> 
(:|</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/38.gif'/> 
=P~</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/39.gif'/> 
:-?</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/40.gif'/> 
#-o</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/41.gif'/> 
=D7</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/42.gif'/> 
:-SS</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/43.gif'/> 
@-)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/44.gif'/> 
:^o</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/45.gif'/> 
:-w</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/47.gif'/> 
7:P</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/48.gif'/> 
2):)</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/109.gif'/> 
X_X</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/110.gif'/> 
:!!</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/111.gif'/> 
\m/</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/112.gif'/> 
:-q</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/113.gif'/> 
:-bd</span> <span><img class='brbsmly' 
src='http://l.yimg.com/us.yimg.com/i/mesg/emoticons7/114.gif'/> 
^#(^</span> <span><img class='brbsmly' 
src='http://l.yimg.com/a/i/us/msg/emoticons/pirate_2.gif'/> 
:ar!</span> <span><a 
href='http://buka-rahasia.blogspot.com'><img border='0' 
src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhT0Dx_JZrVmbSnoiecAZP6WexeHOEPzhODTAZe505pUTLhG_Wro0BiNWF6Gcvgn-8HWEp9YmKX6KZ3NqEPyRDv5GLbcVEq_8fcb4OQXpm9zIMDXDyKykCNc6Vzq3ZUP-JeI8bffqlsiqcp/s1600/smileys.gif'
 /></a></span></div>

Terakhir taruh kode di bawah tepat di atas </body>

<script src='http://rickynavigation.googlecode.com/files/emoticonssmiley.txt'></script>
Save template selesai sudah..

Sekarang seharusnya cara pasang emoticons pada komentar blogspot di atas form komentar blog anda sudah ada serangkaian gambar smiley emoticon yang bisa digunakan komentator blog anda untuk menghias komentarnya. Lihat contoh di bawah.

:) :( ;) :D ;;-) :-/ :x :P :-* =(( :-O X( :7 B-) :-S #:-S 7:) :(( :)) :| /:) =)) O:-) :-B =; :-c :)] ~X( :-h :-t 8-7 I-) 8-| L-) :-a :-$ [-( :O) 8-} 2:-P (:| =P~ :-? #-o =D7 :-SS @-) :^o :-w 7:P 2):) X_X :!! \m/ :-q :-bd ^#(^ :ar!