SMS GRATIS

kali ini ku buat artikel untuk sobat yang sedang tidak ada pulsa.. hehehe ...
boleh langsung di coba sobat silakan

Cara Membuat Tanda Tangan Model Animasi

Anda belum menjadi SAHABAT blog ini !
Mohon ikutlah terlebih dahulu ...
sebelum menggunakan tutorial ini,
tidak sulit bukan ?!

Dikesempatan yang lalu kita telah membahas cara

membuat tanda tangan yang dipasang di akhir

postingan. Kali inipun masih berkisar dengan

masalah itu, namun tanda tangan yang sekarang

kita bahas menggunakan gambar animasi.

Lihatlah contohnya berikut ini :
Mau membuat ? mau mencoba ? Mau ....... ?!
Anda ikuti saja langkah yang berikut :

1.   Kunjungi situsnya di sini

2.   Isilah nama Anda pada kolom
      Choose the text of your signature
      (lihat gambar di bawah)

3.   PIlihlah 1 model huruf dari 45 model yang ada
      pada tabel Choose a font and a size for the text.
      (lihat gambar di bawah)

4.   Pilihlah 1 Kategori dari banyak pilihan yang ada,
      lalu kliklah gambar yang Anda inginkan.
      (lihat gambar di bawah)

5.   Bila ingin menggunakan gambar Anda sendiri,
      maka pilihlah Kategori Your own figurines.
      (lihat gambar di bawah)

6.   Pilih warna yang Anda inginkan,
      kemudian kliklah CREATE.
      (lihat gambar di bawah)

7.   Klik Download this signature
      Untuk men-save hasilnya.
      (lihat gambar di bawah)

8.   Terakhir, pilih Simpan Berkas
      kemudian klik OK.
      (lihat gambar di bawah)

9.   Sisipkan kode URL yang Anda dapat 
      tadi diantara kode yang berikut ini :

<img src="Kode URL Anda" style="border: 0 !important; background: transparent;"/>

Good luck!, Pastinya Anda suka.

Membuat Animated Text Banner

Beragam text animasi telah di " bagikan " oleh blog ini.
Untuk kali ini kita akan coba membuat satu macam text
animasi dengan menggunakan bantuan sebuah situs
generator. Silahkan anda coba sendiri generator text
animasi yang terbilang cukup keren ini.

sumber:http://www.magicwidgets.com/animated-text-banner/

Selamat mencoba, good luck!

Glitter Text Welcome

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Bismillah. Jika anda ingin memasang widget glitter text welcome ini di blog anda, silahkan ikuti langkah-langkah berikut:

1. Login ke akun blogger anda
2. Pada dasbor pilih menu Tata Letak >> klik tambah gadget >> pilih HTML/JavaScript
3. Copy code dibawah salah satu glitter text welcome yang anda pilih dan paste kode pada form yg tampil
4. Simpan dan lihat hasilnya diblog anda.

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgxQCms6zrVpJkWA2uhI9BRAduUQr1KODcvUi8y6HR-8WIidF9gDV1JGjz4L909x6y6zoC_48oeeLexD8TKIHbq4NaH6iVi0X2-UMVt25ggU5_0eulTCofVCKpUwyR85LUDLCXNU6CTe6Q/s1600/1238563s6wfel4lo6.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEguBcEEMBZokArdb1KE07fOUiEJhfw_O6GHGxfbEPlNDnELgCIe-rIFMIoLABG8FzjZp914-MzIJ4-AS1jbDOSh60bpuvZauOm9O3f5uNyo8V6wCmrN3Qht5VpFt0HsncOGQ20qttH3BBE/s1600/2345990a49dwy39e0.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjITBUu_njWIzVIEBHb9rdaEwC_nAuPCsWBaPVPdISHlek8vLAxxedmPuQ-56F4toWjTNyot25tks6bmRANJHq5RaCikPuWEZuVqxDH3o3Zu8qVVY4ZyzHdLDDBD08PPzfYQD4Pqw3GqKM/s1600/1111378c8d5l5st54.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiLXTKgbkZEv_k_OuxdzIQkLvko0x54y96pnmDcTNtOogR_WGtf_fKNbTBe6flMIIvgPzUikhq9L3qeK2g_rvBFCut8T3VqhA7sg2Xil6jiVQnjM4eYODJmXCFQKL9k3uOGC3bTTDUa518/s1600/1440903wtr1hg70ow.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEii9FcbzPvSfz9ONYK2gnRy85YyeymdXUez7gOyBDATXRjbyfT4Waad4sHSRF4Yeeuqn6ifECfLLDY0ufn0e-DUYh0-r4JmLEkqKIosAW9ZBFuGHELTho_5aEgvxj5lPalhxtkBWv0xgwE/s1600/994331xpxvrjrsyq.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="128" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimUcttyv3P5DZf4FPT7Fk69iQHw8QpTnXoy8P56iN-jqmW8CVsP81_OnHgyqP-QEtsLwSJX9DXE0E_WwmwqwTJILoUICR_UXqRyUuOi5ohwTS0cn-m7qBkMFxCXyq4-YrKsmV4Un_HGmM/s320/913901a6fm472zor.gif" width="320" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZ0VRsbP_cbrJhCeQjffeXay7FMjiRXTtn6x934ZvImzaGT3YOeAHA2nkTUul1me6fTkt7frI5LaaEo2cQioa1NV9IB1jnp8fesJmpFk7SWrz_q8aa-nUnR4GY788YzkGwoC7jPI6gCQU/s1600/1368456q75rcqqnh3.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi84LpJvwi-fPHzF9VbTtasTW12wVvMSyHjMOfWZPNDEzIAwbWGOGmgN4rbBqi8ZAbr12uRV36QaS46QGhtn00F8aLG0Pip54jJpHrwn892WKJGTaaHzaheTAnNVfkReB7m7SL_qqJ0lZs/s1600/2229881nupeynzwp9.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" height="162" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhncJqhyXD7M76J6s32A1zxEtmTgiUfjlkDtcSn0fRrs7w10YmcwUbcPc3JsyziFCv4Ds6kYnfByXgI02wSEVF3T1HJLW_l3jayE7yQiLaobJCoazIAgPXqZC9YfbhyphenhyphenXczh8lxfBaLhpBw/s320/913899yyvvqim3wk.gif" width="320" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhXvChRcLIlHvgYvRrAx3f-NCiiWtuh1w6XE2Y0eo7NgKM7iu9fRSPLhW3Br0ZlxUEdj977LEqVnM2VjrS4aShDj-ua6cSyxzs_iTCPj6igRiARQv8ixaEUOxVleSOlYVDEv6nJUpNrmpw/s1600/733895zl8k1fkhwd.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhgWEZrax0mkHSuazj0Xlrkl62-tUprMImvYS7MZdnEb6UrIQsBish0_0Epf9cUhrPGxTExMB4nBCOL9VSPRuUvqUK_2Xn50dtgiKiDlu6eCU7EjasgevaclzQalsTJdS_O_x0X0_OOriY/s1600/2114215a4lbk0u2xd.gif" /></a></div>

<div class="separator" style="clear: both; text-align: center;"> <a href="http://www.tipstrikblogging.com/" imageanchor="Glitter Text Welcome" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEga2VthbRVHo3akW0nVyU__6mdXtu3Z3ri8aqBr7779c54fXXShNNsr7a77u3Mq67hz4foM5F9L_G-23WeKgBj6Q8sTw4vQHu9Idjuh-bNv-6PDVlSQPYT0S2qQMHsQfr6pQS8Y6kVh5WE/s1600/939425cdiy8p6frc.gif" /></a></div>

Semga bermanfaat

ٱلْحَمْدُ لِلَّهِ رَبِّ ٱلْعَٰلَمِين

Widget Popular Posts Dengan Multi Colored Style

بِسْــــــــــــــــمِ اﷲِالرَّحْمَنِ اارَّحِيم

Postingan kali ini masih seputar tutorial modifikasi widget popular posts, sebuah widget yang bertujuan untuk menampilkan postingan  yang sering dilihat/ popular posts berdasarkan page view. Popular posts kali ini akan kita modifikasi masih dengan penambahan CSS3 menjadi Popular Post dengan tampilan sembilan warna pada setiap title posts seperti tampilan screen shoot disamping ini:
Tertarik untuk menambahkan widget popular posts dengan tampilan multi color seperti diatas? Berikut tutorial pembuatannya:
Tahap Pertama:

1. Seperti biasa login ke akun anda.
2. Pilih edit HTML >> Cari kode ]]></b:skin>
3. Setelah ketemu letakkan kode dibawah ini tepat diatas kode nomor dua tadi

#PopularPosts1 ul li a:hover{color:#fff;text-decoration:none}
#PopularPosts1 ul li a {-webkit-text-size-adjust: auto; -webkit-text-stroke-width: 0px; color: #333333; display: block; font-family: Georgia, 'Times New Roman', Times, serif; font-size: 13px; font-style: normal; font-variant: normal; font-weight: normal; letter-spacing: normal; line-height: 18px; margin: 0px 40px 0px 0px; min-height: 30px; orphans: 2; padding: 0px; text-align: -webkit-auto; text-decoration: none !important; text-indent: 0px; text-transform: none; white-space: normal; widows: 2; word-spacing: 0px;}
#PopularPosts1 ul li .item-thumbnail{float:left;border:0;margin-right:10px;background:transparent;padding:0;width:51px;height:51px}
#PopularPosts1 ul li:first-child:after, #PopularPosts1 ul li:first-child + li:after, #PopularPosts1 ul li:first-child + li + li:after, #PopularPosts1 ul li:first-child + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after, #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{position:absolute;top:10px;right:5px;border-radius:50%;border:2px solid #ccc;background:#353535;-webkit-box-shadow:0px 0px 5px #000;-moz-box-shadow: 0px 0px 5px #000;width:30px;height:30px;line-height:1em;text-align:center;font-size:28px;color:#fff} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li {background:#DF01D7;width:90%}
#PopularPosts1 ul li:first-child + li + li + li + li + li + li + li:after{content:"8"} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li{background:#B041FF;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li:after{content:"9"} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li +li +li{background:#F52887;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li + li + li + li:after{content:"10"} #PopularPosts1 ul li:first-child + li + li + li + li +li{background:#7ee3c7;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li:after{content:"6"} #PopularPosts1 ul li:first-child + li + li + li + li + li +li{background:#f6993d;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li + li + li:after{content:"7"} #PopularPosts1 ul li:first-child + li + li + li + li{background:#33c9f7;width:90%} #PopularPosts1 ul li:first-child + li + li + li + li:after{content:"5"} #PopularPosts1 ul li:first-child + li + li + li{background:#c7f25f;width:90%} #PopularPosts1 ul li:first-child + li + li + li:after{content:"4"} #PopularPosts1 ul li:first-child + li + li{background:#ffde4c;width:90%} #PopularPosts1 ul li:first-child + li + li:after{content:"3"} #PopularPosts1 ul li:first-child + li{background:#ff764c; width:90%} #PopularPosts1 ul li:first-child + li:after{content:"2"} #PopularPosts1 ul li:first-child{background:#ff4c54 ;width:90%} #PopularPosts1 ul li:first-child:after{content:"1"} #PopularPosts1 ul{margin:0;padding:0px 0;list-style-type:none} #PopularPosts1 ul li{position:relative;margin:6px 0;border-radius:25px 0px 25px 0px;border:2px solid #f7f7f7;-webkit-box-shadow:3px 3px 3px #000;-moz-box-shadow: 3px 3px 3px #000;padding:10px}

4. Simpan.
Tahap Kedua

1. Pada menu tata letak >> Pilih add gadget/tambahkan gadget >> Pilih Entri populer/Popular posts >> hilangkan tanda centang cuplikan gambar dan keterangan, tampilkan minimal 9 posts.
2. Simpan dan lihat hasilnya diblog anda!

Demikian tutorial cara menambahkan widget popular posts dengan tampilan multi color pada blog. Semoga bermanfaat.

Cara Memasang Komentar Google Plus Pada Blog

Cara Memasang Komentar Google Plus Pada Blog-Assalamualaikum kawan semua,beberapa waktu yang lalu,Google plus / G+ meluncurkan terobosan terbaru yaitu komentar google plus yang terintegrasi dengan blog,cara kerja komentar G+ tersebut adalah ter share nya secara otomatis sebuah komentar blog ke akun G+ milik kita,sehingga memungkinkan teman yang lain mengetahiunya dengan tujuan untuk menyampaikan berita lebih luas lagi.Sebenarnya ada cara lain memasang komentar ini,yaitu melalui dasbord blog sobat,tetapi cara tersebut mempunyai kelemahan,yaitu hilang atau tidak di tampilkannya komentar-komentar yang sudah ada sebelumnya,sehingga muncul lah pemasangan dengan cara manual menggunakan script.Untuk cara memasangnya silahkan sobat ikuti langkah-langkahnya sebagai berikut :

Pertama seperti biasa login ke akun blog sobat.

Kemudian klik Template >> Edit Html.(backup dulu sebelum edit)

Selanjutnya cari kode seperti di bawah ini

<div class='post-outer'>
 <b:include data='post' name='post'/>
  <b:if cond='data:blog.pageType == &quot;static_page&quot;'>
  <b:include data='post' name='comment_picker'/>
  </b:if>
  <b:if cond='data:blog.pageType == &quot;item&quot;'>
  <b:include data='post' name='comment_picker'/>
  </b:if>
</div>

Ganti seluruh kode di atas dengan kode di bawah

Klik Save dan selesai

<div class='post-outer'>
<b:include data='post' name='post'/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='cmt_iframe_holder' expr:data-href='data:post.canonicalUrl' expr:data-viewtype='data:post.viewType'/>
<b:if cond='data:post.showThreadedComments'>
<b:include data='post' name='threaded_comments'/>
<b:else/>
<b:include data='post' name='comments'/>
</b:if>
</b:if>
</div>

Jika kemungkinan kode <div class='post-outer'> ada dua,silahkan sobat taruh diatas kode <div class='post-outer'>Cara Memasang Komentar Google Plus Pada  Blog
Sumber:
http://www.komputekno.com/2013/04/menampilkan-komentar-google-plus-dan-komentar-blog-bersamaan.html

Cara Mudah Mengubah atau Mengganti Warna Link di Blog

Kadang warna link yang ada di blog Kamu, tidak sesuai dengan keinginan Kamu, itu karena bawaan template yang Kamu pakai, tapi tenang Kamu bisa kok menggantinya.
Dipostingan Saya kali ini Saya akan share, bagaimana cara Mengubah atau Mengganti Warna Link di blog, nah kali ini Saya akan share caranya.

Untuk caranya ikuti tutorial dibawah ini :

1. Log in ke Blogger Kamu
2. Pilih Template, lalu klik edit html
3. Centang expand template widget
4. Lalu cari kode yang hampir sama dibawah ini :
   a:link {
       color: #3366CC;
       text-decoration: none;
   }
   a:visited {
       color: #3366CC;
       text-decoration: none;
   }
   a:hover {
       color: #5588AA;
       text-decoration: underline;
   }
   Keterangan :
   • Teks berwarna merah adalah warna link
   • Teks berwarna ungu adalah warna link ketika sudah di klik
   • Teks berwarna biru adalah warna link ketika mouse diarahkan ke link tersebut
   • Teks berwarna hijau ganti dengan warna yang Kamu inginkan
   • Untuk kode warna klik disini
5. Simpan dan lihat hasilnya,,,
6. Mudahkan, Selamat Mencoba,,,

Melihat Daftar Kode Warna HTML Dengan Widget di Blog

Kode warna html, kadang diperlukan untuk mengubah warna di blog, baik itu warna link, warna blog, ataupun warna background blog.

Untuk melihat kode warna html, bisa gunakan widget dibawah ini :

Widget Follow Twitter Animasi Keren Untuk Blog

Hai sob...

sore ini saya mau share mengenai widget-widget twitter yang keren, animatif, dan unyu-unyu, hahahaha...

Ok langsung aja sob dilihat beberapa widget yang keren dan bisa temen-temen pasang di blog masing-masing :

 

<object type="application/x-shockwave-flash" data="http://www.twpics.com/BUTTON12/twitbutton.swf"
width="182" height="202"><param name="movie" value="http://www.twpics.com/BUTTON12/twitbutton.swf"></param&
gt;<param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param&
gt;<param name="wmode" value="transparent"></param><param name="flashvars" value="username=sujiyanto24"></param><a href="http://www.gamblinginsider.ca/casino-games/roulette/" title="Canadian roulette">Canadian roulette</a><embed
src="http://www.twpics.com/BUTTON12/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="182"
height="202" menu="false" wmode="transparent" flashvars="username=sujiyanto24"><
/embed></object>
Copy Kode

 

<object type="application/x-shockwave-flash" data="http://www.buzzbuttons.com/BUTTON8
/twitbutton.swf" width="200" height="200"><param name="movie" value="http://www.buzzbuttons.com/BUTTON8/twitbutton.swf"&
gt;</param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"><
/param><param name="wmode" value="transparent"></param><param name="flashvars" value="username=sujiyanto24"></param><a
href="http://www.dreambingo.co.uk/" title="http://www.dreambingo.co.uk/">http://www.dreambingo.co.uk/</a><embed
src="http://www.buzzbuttons.com/BUTTON8/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always"
width="200" height="200" menu="false" wmode="transparent" flashvars="username=sujiyanto24"></embed></object>
Copy Kode

 

<object type="application/x-shockwave-flash" data="http://www.twpics.com/BUTTON3/twitbutton.swf"
width="100" height="100"><param name="movie" value="http://www.twpics.com/BUTTON3/twitbutton.swf"></param&
gt;<param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param&
gt;<param name="wmode" value="transparent"></param><param name="flashvars" value="username=sujiyanto24"></param><a
href="http://www.gamblinginsider.ca" title="online casino">online casino</a><embed src="http://www.twpics.com/BUTTON3
/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="100" height="100" menu="false"
wmode="transparent" flashvars="username=sujiyanto24"></embed></object>
Copy Kode

 

<object type="application/x-shockwave-flash" data="http://www.twpics.com/BUTTON7/twitbutton.swf"
width="180" height="200"><param name="movie" value="http://www.twpics.com/BUTTON7/twitbutton.swf"></param&
gt;<param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param&
gt;<param name="wmode" value="transparent"></param><param name="flashvars" value="username=sujiyanto24"></param><a
href="http://www.gamblinginsider.ca" title="mobile gambling">mobile gambling</a><embed src="http://www.twpics.com
/BUTTON7/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="180" height="200" menu="false"
wmode="transparent" flashvars="username=sujiyanto24"></embed></object>
Copy Kode

 <object type="application/x-shockwave-flash" data="http://www.twpics.com/BUTTON1
/twitbutton.swf" width="180" height="90"><param name="movie" value="http://www.twpics.com/BUTTON1/twitbutton.swf"><
/param><param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param&
gt;<param name="wmode" value="transparent"></param><param name="flashvars" value="username=dhanibdonahue"></param><a
href="http://www.gamblinginsider.ca" title="online casino">online casino</a><embed src="http://www.twpics.com/BUTTON1
/twitbutton.swf" type="application/x-shockwave-flash" allowscriptaccess="always" width="180" height="90" menu="false"
wmode="transparent" flashvars="username=dhanibdonahue"></embed></object>Copy Kode

 

<object type="application/x-shockwave-flash" data="http://www.twpics.com/BUTTON0/twitbutton.swf"
width="100" height="80"><param name="movie" value="http://www.twpics.com/BUTTON0/twitbutton.swf"></param&
gt;<param name="allowscriptaccess" value="always"></param><param name="menu" value="false"></param&
gt;<param name="wmode" value="transparent"></param><param name="flashvars" value="username=sujiyanto24"></param><a
href="http://www.gamblinginsider.ca/casino-games/" title="find casino games at GamblingInsider">find casino games at
GamblingInsider</a><embed src="http://www.twpics.com/BUTTON0/twitbutton.swf" type="application/x-shockwave-flash"
allowscriptaccess="always" width="100" height="80" menu="false" wmode="transparent" flashvars="username=sujiyanto24"></embed><
/object>
Copy Kode

*Keterangan : Ganti sujiyanto24 dengan id Twitter temen-temen

Untuk pemasangannya tentu temen-temen sudah tau kan. Tapi kalo belum tau silahkan ikuti cara berikut :

1.Login ke blogger.
2. Tata Letak - Tambah Gadget - HTML/Javascript
3. Letakkan kode diatas setelah itu Simpan
4. Enjoy.  
Gimana, udah dicoba belum sob widget nya??? Kalo udah kasih komentar dibawah yaa.. Terima kasih semoga bermanfaat...

Membuat Animasi Loading Blog,

Membuat Animasi Loading Blog, Membuat Animasi Loading Blogspot - Animasi loading blog bisa memberikan efek manipulasi terhadap loading blog agar nampak lebih cepat, disini saya menggunakan script animasi loading dari DTE :] kemudian saya padukan dengan CSS3 Loading Animation dari Alessio Atzeni.
Script animasi Loading DTE :] menyeleksi semua link internal yang akan diberikan animasi loading, dan tentunya anda dapat memodifikasi lagi Script tersebut sesuai keinginan anda.

CSS3 LOADING ANIMATION LOOP

MEMASANG ANIMASI LOADING KE BLOGSPOT

Tambahkan KODE CSS Animasi Loading Blog ini diatas ]]></b:skin>

#loadhalaman {position:fixed;opacity:0.93;top:0;left:0;background-color:#000;z-index:9999;text-align:center;width:100%;height:100%;padding-top:20%;color:#000;display:none;}
.loadball {background-color: transparent;border:5px solid rgb(240 ,0 , 0);border-right:5px solid transparent;border-left:5px solid transparent;border-radius:50px;box-shadow: 0 0 35px rgb(255 ,0 , 0);width:50px;height:50px;margin:0 auto;-moz-animation:spinPulse 1s infinite ease-in-out;-webkit-animation:spinPulse 1s infinite linear;}
.loadball-2 {background-color: transparent;border:5px solid rgb(240 ,0 , 0);border-left:5px solid transparent;border-right:5px solid transparent;border-radius:50px;box-shadow: 0 0 15px rgb(255 ,0 , 0);width:30px;height:30px;margin:0 auto;position:relative;top:-50px;-moz-animation:spinoffPulse 1s infinite linear;-webkit-animation:spinoffPulse 1s infinite linear;}
@-moz-keyframes spinPulse {0% { -moz-transform:rotate(160deg); opacity:0; box-shadow:0 0 1px rgb(255, 0, 0)}50% { -moz-transform:rotate(145deg); opacity:1; }100% { -moz-transform:rotate(-320deg); opacity:0; }}
@-moz-keyframes spinoffPulse {0% { -moz-transform:rotate(0deg); } 100% { -moz-transform:rotate(360deg);  }}
@-webkit-keyframes spinPulse {0% { -webkit-transform:rotate(160deg); opacity:0; box-shadow:0 0 1px rgb(255, 0, 0)} 50% { -webkit-transform:rotate(145deg); opacity:1;} 100% { -webkit-transform:rotate(-320deg); opacity:0; }}
@-webkit-keyframes spinoffPulse {0% { -webkit-transform:rotate(0deg); } 100% { -webkit-transform:rotate(360deg); }}

Kemudian Tambahkan JQuery ini diatas </head>, disini saya menggunakan Jquery versi 1.7.2 (Pasang jika belum ada Jquery di Template anda)

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'></script>

Langkah terakhir, pasang Script dibawah ini diatas tag </body>

<div id='loadhalaman'>
<div class='loadball'></div>
<div class='loadball-2'></div>
</div>
<script type='text/javascript'>
$(function() {
    var siteURL = "http://" + top.location.host.toString();
    var $internalLinks = $("a[href^='"+siteURL+"'], a[href^='/'], a[href^='./'], a[href^='../']");
    $internalLinks.click(function() {
        $('#loadhalaman').fadeIn(1500).delay(6000).fadeOut(1000);
    });

    // Hilangkan overlay saat diklik untuk mengatasi gangguan, terutama jika link internal diset dengan target='_blank'
    $('#loadhalaman').click(function() {
        $(this).hide();
    });
});
</script>

Untuk demo Animasi Loading Blog, saya tidak menyertakannya, anda bisa melihat langsung di blog ini, selamat mengoprek :))

Widget Share W8 SM

Kali ini saya membuat widget yang bernama Widget Share W8 SM. Didalamnya terdapat 3 fitur yaitu: Share, Subscribe, dan Back to top. Saya desain dengan posisi melayang di bagian kiri blog. Untuk memasang widget ini perhatikan tutorial berikut:

• Masuk ke Blog sobat, dan pilih Tab Template lalu klik Edit HTML.
• Tekan F3 untuk mencari kata kunci
• Pasang CSS dibawah tepat berada di atas ]]></b:skin>

• Lalu klik Simpan

• Sekarang kamu klik Tab Tata Letak, dan Tambahkan Gadget HTML/Javascript baru.
• Pastekan Source kode Widget ini di situ.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>


<script>
$(document).ready(function(){// fade in .btt
$(function () {$(window).scroll(function (){});// scroll body to 0px on click 
$('.btt a').click(function () {$('body,html').animate({scrollTop: 0}, 350);return false;});});});
</script>   
<script>(function(d, s, id) {var js, fjs = d.getElementsByTagName(s)[0];if (d.getElementById(id)) return;js = d.createElement(s); js.id = id;js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";fjs.parentNode.insertBefore(js, fjs)}(document, 'script', 'facebook-jssdk'));</script>
<script src="http://apis.google.com/js/plusone.js" type="text/javascript"></script>
<script src="http://platform.twitter.com/widgets.js" type="text/javascript"></script>


<div id="widget-share">
<script>urlbelakang_feedburner='blog-santamars';</script>
<script src="http://not-remove-admin.googlecode.com/files/Share-W8-SM.js"></script>
</div>

• Setelah itu Simpan, dan lihat hasilnya.

Itulah Widget Share W8 SM yang saya buat untuk sobat, semoga bermanfaat.

Note!

1. Anda bisa mengatur letak posisinya di CSS tadi.