Membuat Statis Follow Blog Ala Wordpress Di Blogger | Mengerikan, sekarang apa yang ada di wordpress bisa ada di Blogger. Contohnya adalah statis follow wordpress...yang sudah default ada di blog wordpress sekarang bisa di pakai oleh blogger juga. Cara ini dipakai untuk menghemat tempat agar blog sedap dipandang.
Anda letakkan kode ini didalam Gadget yaitu pada HTML/Javascript.
<style type="text/css">
/*<![CDATA[*/
#w2bfollowSubscribe {background-color: #464646;width: 220px;color: #fff;position: fixed;z-index: 999999;right: 10px;bottom: 0;}
.followOpened {-webkit-border-radius: 2px 0 0;-moz-border-radius: 2px 0 0;border-radius: 2px 0 0;-webkit-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);-moz-box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);box-shadow: 0 0 8px rgba(0, 0, 0, 0.5);}
.w2bfollowButton {background: #464646;color: #CCC !important;font-size: 13px;line-height: 28px;padding: 0 10px;text-decoration: none;position: absolute;top: -28px;right: 0;display: block;-webkit-box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);-moz-box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);box-shadow: 0 -1px 5px rgba(0, 0, 0, 0.2);-webkit-border-radius: 2px 2px 0 0;-moz-border-radius: 2px 2px 0 0;border-radius: 2px 2px 0 0;height: 28px;}
.w2bfollowButton span {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiSDpGyJlcOitgFlEsgfehidxpUL8xaxU1EyAlBY7ZZNdQcZ2qHE3R6e5Cq3mhvjRwJ3QlHv-AmGe1eF-ONCnA7g-2r9wOIQ2ZB3gqM56tBv0_t9GvbJgwOD9FGWN4H9Pxq5kaorssHYcyW/s1600/follow-w2b.png") no-repeat scroll 0 3px transparent;padding-left: 15px;}
.w2bfollowButton:hover,.followActive {color: #fff !important;}
.w2bfollowButton:hover span,.followActive span {background-position: 0 -37px !important;}
.followactive {background-color: #333;}
.w2bfollowForm {padding: 15px;}
.w2bfollowForm h3 {font-size: 18px;margin: 0 0 10px;font-weight: normal;}
.w2bfollowForm p {margin: 0 0 10px;}
.w2bfollowForm .emailInput {width: 95%;padding: 2px 4px;margin: 0 auto;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px;font-size: 15px;border: 1px solid #444;color: #888;display: block;clear: both;}
.w2bfollowForm form {text-align: center;}
.w2bfollowForm .emailInput:focus {color: #000;border-color: #000;}
.w2bfollowForm .emailSubmit {cursor:pointer;padding: 2px 20px;background: #333;background: -webkit-linear-gradient(top, #333 0%, #111 100%);background: -moz-linear-gradient(top, #333 0%, #111 100%);background: -o-linear-gradient(top, #333 0%, #111 100%);background: -ms-linear-gradient(top, #333 0%, #111 100%);background: linear-gradient(top, #333 0%, #111 100%);color: #ccc;text-shadow: 0 1px 0 #000;border: 1px solid #282828;-webkit-border-radius: 11px;-moz-border-radius: 11px;border-radius: 11px;-webkit-box-shadow: inset 0 1px 0 #444;-moz-box-shadow: inset 0 1px 0 #444;box-shadow: inset 0 1px 0 #444;text-decoration: none;-webkit-transition: all 0.25s ease-in-out;-moz-transition: all 0.25s ease-in-out;-o-transition: all 0.25s ease-in-out;-ms-transition: all 0.25s ease-in-out;transition: all 0.25s ease-in-out;margin: 1em 0 1em 0;}
.emailSubmit:hover {background: #222;background: -webkit-linear-gradient(top, #333 0%, #222 100%);background: -moz-linear-gradient(top, #333 0%, #222 100%);background: -o-linear-gradient(top, #333 0%, #222 100%);background: -ms-linear-gradient(top, #333 0%, #222 100%);background: linear-gradient(top, #333 0%, #222 100%);color: #fff;-webkit-box-shadow: inset 0 1px 0 #4f4f4f;-moz-box-shadow: inset 0 1px 0 #4f4f4f;box-shadow: inset 0 1px 0 #4f4f4f;text-decoration: none;}
.emailSubmit:active {background: #111;background: -webkit-linear-gradient(top, #111 0%, #222 100%);background: -moz-linear-gradient(top, #111 0%, #222 100%);background: -o-linear-gradient(top, #111 0%, #222 100%);background: -ms-linear-gradient(top, #111 0%, #222 100%);background: linear-gradient(top, #111 0%, #222 100%);color: #aaa;-webkit-box-shadow: inset 0 -1px 0 #333;-moz-box-shadow: inset 0 -1px 0 #333;box-shadow: inset 0 -1px 0 #333;text-decoration: none;}
.w2bFollowFooter {text-align: center;font: normal 11px "Helvetica Neue", sans-serif;padding: 7px 0;margin: 0 0 -15px !important;border-top: 1px solid #3c3c3c;}
.w2bFollowFooter a {color: #aaa;text-shadow: 0 1px 0 #262626;background: none;text-decoration: none;}
.w2bFollowFooter a:hover {color: #fff;background: none;}
/*]]>*/
</style>
<script type="text/javascript">
/*<![CDATA[*/
;(function(w2b){w2b(document).ready(function(){w2b.extend(w2b.easing,{easeOutCubic:function(x,t,b,c,d){return c*((t=t/d-1)*t*t+1)+b}});var followBox=w2b("#w2bfollowSubscribe");var followHeight="-"+followBox.outerHeight()+"px";followBox.hide().css({bottom:"-500px"});setTimeout(function(){followBox.show().animate({bottom:followHeight})},500);w2b(".w2bfollowButton").click(function(e){if(followBox.hasClass("followOpened")){w2b(this).removeClass("followActive");followBox.removeClass("followOpened").stop().animate({bottom:followHeight},{duration:300,easing:"easeOutCubic"})}else{w2b(this).addClass("followActive");followBox.addClass("followOpened").stop().animate({bottom:"0"},{duration:500,easing:"easeOutCubic"})}e.preventDefault()})})})(jQuery);
/*]]>*/
</script>
<div id="w2bfollowSubscribe" style="display:none;">
<div class="w2bfollowForm">
<a class="w2bfollowButton" href="#" title="Follow"><span>Follow</span></a>
<h3>Follow "Nama Blog Anda"</h3>
<p>Ketik Pesan Anda Disini!!</p>
<form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=Feedburner ID anda', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input type="text" class="emailInput" name="email" placeholder="Enter Your Email..."/>
<input type="hidden" value="Feedburner ID anda" name="uri"/>
<input type="hidden" name="loc" value="en_US"/>
<input type="submit" value="Subscribe" class="emailSubmit"/>
</form>
<p class="w2bFollowFooter">
<a href="http://feedburner.google.com" target="_blank">Delivered by FeedBurner</a>
</p>
</div>
</div>
Cukup mudah dan sederhana.
Ganti warna merah dengan : Nama Blog Anda
Ganti warna biru dengan : Pesan Anda
Ganti warna hijau dengan : ID Feedburner Anda
Misal : http://feeds.feedburner.com/bocahit (bocahit adalah ID Feedburner anda)
Assalamualaikum wr. wb :)
BalasHapussenang rasanya berkunjung diblog ini, setelah saya baca beberapa postingan wah saya langsung takjub ,, ternyata banyak ilmu yang harus saya pelajari dari blog ini :)
terimakasih ob sudah mau berbagi :)
wassalamualaikum wr.wb
makasih ya sob :D
Hapushahay tambah keren aja nih
BalasHapusapanya sob? adminya? :)
Hapustutorialnya sob wkwkw Selamat dapat award lagi nih sob
Hapushttp://hermanbagus.blogspot.com/2013/02/award-ke-19-dari-sahabat-psholic.html
:)) makasih sob
Hapuskeren nih tricknya sobat ... :D
BalasHapusmakasih sob :)
Hapuskeren sob. kapan-kapan tak pasang di blog saya.
BalasHapusbiar tambah keren blog saya...:-)
:)) makasih ya sob
Hapusnyimak aja sob
BalasHapussambil klik klik
okey sob :D
Hapusudah sob,w akakakka
Hapusdah lama ngak kesini rasanya sedikit asing
BalasHapusapanya yang asing sob? :D
Hapusorangnya jarang datang ke blog ku wakakkakakakakk
Hapuswehehhhe nice bro, kapan2 saya coba
BalasHapusokey sob :D
HapusSelamat siang sobat, ada bingkisan award buat sobat, silahkan di ambil di Blog Arluva Story, Terimakasih.
BalasHapus:)) makasih ya sist
HapusWah besok lagi semoga aja semua fitur yang bisa diakses lewat wordpress ada semua di blogger. Amiin..
BalasHapusBTW, bisa dicoba. Baru tahu bisa kayak ginian. Kalo lagi butuh bisa saya coba pasang :)
Sama-mau tanya lagi sob tentang blog sobat. Kenapa pada saat saya buka url blog sobat lewat "blogger.com/home" bukannya langsung ke bocahit.com tapi kok ada tulisan sekilas => "http://feedproxy.google.com/~r/blognyaAnakNegeri/~3/IYZAwIbA0oE/apa-kepanjangan-m-pada-mirc.html" mohon pencerahannya?
ini masalah waktu saya nyari domain saya di hosting kemarin sob...Idwebhost mungkin mengarahkan ke situ tadi,,,karena memang waktu aku cari di database idwebhost, domainku menghilang....
HapusHmm jadi begitu ya.. terimakasih atas penjelasannya.
Hapuskox bisa gitu brother
Hapusmantap nhe gan ini yg ane cari
BalasHapusmakasih atas kunjungannya gan :D
Hapus