Rabu, 18 Januari 2012

Membuat Saran Halaman | Recomended Post Slide Out For Blogger

| Rabu, 18 Januari 2012 | 0 komentar

Coba anda telusuri deh artikel di Blog Ini , anda akan mendapati sebuah slide muncul tiba-tiba, sebagai saran artikel untuk anda baca, Nah oke bukan?
tuch contohnya gambar disebelah kiri ...


Mau Trik nya ? Ok saya bagikan deh ya. Sebentar saya mau menyeruput Kopi dulu nih ..

Caranya Membuat Saran Halaman | Recomended Post SLide Out For Blogger :

Masuk dan login dulu ke akun blogger anda
Pilih Rancangan, lalu pilih Edit Html, Centang expand widget, jangan lupa download dulu template anda agar dapat dipulihkan kalau terjadi eror

Aktifkan mode pencarian dengan menekan CTRL+F , lalu ketik / cari kode dibawah ini :

<div class='post-footer-line post-footer-line-1'>

Atau kode ini :

<p class='post-footer-line post-footer-line-1'>

Atau ini :

<data:post.body/>

Lalu masukkan kode dibawah ini dibawah / setelah salah satu kode diatas tadi :
<b:if cond='data:blog.pageType == "item"'>
<div style='display:none' id='bpslidein_place_holder'></div>
</b:if>

Nah selanjutnya anda cari kode :
</head>

Lalu masukkan kode berikut ini diatas kode tersebut :

<script>var bpslidein_custom_css=true;
#bpslidein{z-index:5;width:400px;height:100px;padding:10px;background-color:#fff;border-top:3px solid #1616F5;position:fixed;right:-430px;bottom:0;-moz-box-shadow:-2px 0 5px #aaa;-webkit-box-shadow:-2px 0 5px #aaa;box-shadow:-2px 0 5px #aaa;font-family:Arial, Helvetica, sans-serif;}
#bpslidein p{font-size:11px;text-transform:uppercase;font-family:Arial,Helvetica,sans-serif;letter-spacing:1px;color:#555;}
#bpslidein_title{color:#555;font-weight:700;font-size:16px;margin:10px 20px 10px 0;}
#bpslidein a,#bpslidein a:hover,#bpslidein_title{text-decoration:none;color:#1616F5;}
#bpslidein .close,#bpslidein .expand,#bpslidein .help{border:2px solid #EEE;cursor:pointer;color:#9A9AA1;width:13px;height:15px;padding:2px 0 0 5px;position:absolute;right:10px;font-size:17px;font-weight:700;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
#bpslidein .help{right:35px;}
#bpslidein_title,#bpslidein_image{float:left;width:80px;}
#bpslidein_title{width:290px;}
</script>

Sampai sini lalu anda Save . Selesai...

Selanjutnya masuk ke elemen laman , cari posisi aman dimana saja untuk menambahkan widgetnya, klik tambah gadget lalu pilih HTML, copy kode dibawah ini :

&lt;script&gt;var bpslidein_custom_css=true;
#bpslidein{z-index:5;width:400px;height:100px;padding:10px;background-color:#fff;border-top:3px solid #1616F5;position:fixed;right:-430px;bottom:0;-moz-box-shadow:-2px 0 5px #aaa;-webkit-box-shadow:-2px 0 5px #aaa;box-shadow:-2px 0 5px #aaa;font-family:Arial, Helvetica, sans-serif;}
#bpslidein p{font-size:11px;text-transform:uppercase;font-family:Arial,Helvetica,sans-serif;letter-spacing:1px;color:#555;}
#bpslidein_title{color:#555;font-weight:700;font-size:16px;margin:10px 20px 10px 0;}
#bpslidein a,#bpslidein a:hover,#bpslidein_title{text-decoration:none;color:#1616F5;}
#bpslidein .close,#bpslidein .expand,#bpslidein .help{border:2px solid #EEE;cursor:pointer;color:#9A9AA1;width:13px;height:15px;padding:2px 0 0 5px;position:absolute;right:10px;font-size:17px;font-weight:700;font-family:Arial, Helvetica, sans-serif;font-size:12px;}
#bpslidein .help{right:35px;}
#bpslidein_title,#bpslidein_image{float:left;width:80px;}
#bpslidein_title{width:290px;}
&lt;/script&gt;
Save - Dan lihat Hasilnya deh, mantabs kan ? Jangan lupa komentarnya ya...

Atau mau cepet lewat jalur Tol aja deh, klik ini :











Ditulis Oleh : muhammad yusuf ~ Blog Pribadi Abu Iram Al-Atsary

Selamat, Anda sedang membaca artikel saya yang berjudul Membuat Saran Halaman | Recomended Post Slide Out For Blogger - Artikel ini diposting oleh muhammad yusuf pada hari Rabu, 18 Januari 2012. Terimakasih atas kunjungan Anda serta kesediaan Anda membaca artikel ini. Jangan lupa like ke akun facebook anda untuk berbagi - Kritik dan saran dapat anda sampaikan melalui Buku Tamu Kami. By. Abu Iram Al-Atsary.

0 komentar:

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Posting Komentar

Tulis Komentar Anda Disini:

 
© Copyright 2010. yourblogname.com . All rights reserved | yourblogname.com is proudly powered by Blogger.com | Template by o-om.com - zoomtemplate.com