Follow Email Pop Out Widget Blogger

Sebenarnya ini adalah sebuah Plugin Untuk Wordpress. Tapi sekarang tersedia untuk Blog Blogger. Widget ini adalah widget Berbasis Jquery dengan efek popout yang bagus dan halus. Anda akan mendapatkan lebih banyak pelanggan email dengan widget ini dan Sangat mudah untuk Instal di Blog Anda.

Seperti widget ini berdasarkan jQuery plugin, Pertama anda harus memiliki Plugin jQuery dalam template Blog Anda.
Langkah ini adalah Diperlukan, Jika Blog anda sudah memiliki plugin ini maka Abaikan Langkah ini.
Jika Blog Anda Tidak memiliki Plugin ini, Instal Plugin jQuery. Tambahkan baris di bawah ini sebelum kode tag </head>.

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>

1. Langkah instal script popout masukan 2 kode berikut sebelum tag </head>
   <style type="text/css"> /*<![CDATA[*/ #drilmfollowSubscribe {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);} .drilmfollowButton {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;} .drilmfollowButton span {background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhiIYmDNV19UKVOo7Y1wIV_2crampNYR7mva8jW9h19NBR2B_7kYl38uo7OWF16gwQiZhXk78c7daHwxHhqZUK1pw4Z9fAmn5RnaG3wOH-FKZHNz7-gTnfqV-APfOGz1Aaylcwyi28Ae-Qc/s1600/follow-w2b.png") no-repeat scroll 0 3px transparent;padding-left: 15px;} .drilmfollowButton:hover,.followActive {color: #fff !important;} .drilmfollowButton:hover span,.followActive span {background-position: 0 -37px !important;} .followactive {background-color: #333;} .drilmfollowForm {padding: 15px;} .drilmfollowForm h3 {font-size: 18px;margin: 0 0 10px;font-weight: normal;} .drilmfollowForm p {margin: 0 0 10px;} .drilmfollowForm .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;} .drilmfollowForm form {text-align: center;} .drilmfollowForm .emailInput:focus {color: #000;border-color: #000;} .drilmfollowForm .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;} .drilmFollowFooter {text-align: center;font: normal 11px "Helvetica Neue", sans-serif;padding: 7px 0;margin: 0 0 -15px !important;border-top: 1px solid #3c3c3c;} .drilmFollowFooter a {color: #aaa;text-shadow: 0 1px 0 #262626;background: none;text-decoration: none;} .drilmFollowFooter a:hover {color: #fff;background: none;} /*]]>*/ </style> <script type="text/javascript"> /*<![CDATA[*/ ;(function(drilm){drilm(document).ready(function(){drilm.extend(drilm.easing,{easeOutCubic:function(x,t,b,c,d){return c*((t=t/d-1)*t*t+1)+b}});var followBox=drilm("#drilmfollowSubscribe");var followHeight="-"+followBox.outerHeight()+"px";followBox.hide().css({bottom:"-500px"});setTimeout(function(){followBox.show().animate({bottom:followHeight})},500);drilm(".drilmfollowButton").click(function(e){if(followBox.hasClass("followOpened")){drilm(this).removeClass("followActive");followBox.removeClass("followOpened").stop().animate({bottom:followHeight},{duration:300,easing:"easeOutCubic"})}else{drilm(this).addClass("followActive");followBox.addClass("followOpened").stop().animate({bottom:"0"},{duration:500,easing:"easeOutCubic"})}e.preventDefault()})})})(jQuery); /*]]>*/ </script>
   

   <div id="drilmfollowSubscribe" style="display:none;">
       <div class="drilmfollowForm">
           <a class="drilmfollowButton" href="#" title="Follow"><span>Follow</span></a>
           <h3>Follow "<data:blog.title/>"</h3>
           <p>Post gratis Instan langsung masuk ke kotak Email</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=donorilmu', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
               <input type="text" class="emailInput" name="email" placeholder="Enter Email Anda..."/>
               <input type="hidden" value="DonorIlmu" name="uri"/>
               <input type="hidden" name="loc" value="en_US"/>
               <input type="submit" value="Berlanggan" class="emailSubmit"/>
           </form>
           <p class="drilmFollowFooter">
               <a href="http://feedburner.google.com" target="_blank">Delivered by FeedBurner</a>
           </p>
       </div>
   </div>

   Teks yang berwarna biru anda ganti dengan ID Feedburner anda.

Selanjutnya klik Simpan Template

 

Sumber: http://donorilmu.blogspot.com/2012/04/follow-email-pop-out-widget-blogger.html

Anda sedang membaca Artikel tentang Follow Email Pop Out Widget Blogger Dan anda bisa menemukan Artikel Follow Email Pop Out Widget Blogger Ini dengan URL http://ferdi2end.blogspot.com/2013/07/follow-email-pop-out-widget-blogger.html, Anda boleh menyebar luaskan atau Mengcopy paste-nya jika Artikel Follow Email Pop Out Widget Blogger Ini sangat bermanfaat bagi teman-teman anda,Namun jangan lupa untuk mencantumkan Link Follow Email Pop Out Widget Blogger Sebagai Sumbernya. Terimakasih

Evolutions Backlinks ™

URL

Code For Forum

HTML Code <a href='http://ferdi2end.blogspot.com/2013/07/follow-email-pop-out-widget-blogger.html' target='_blank'>Follow Email Pop Out Widget Blogger </a>

Related Post: