Ticker

6/recent/ticker-posts

Auto Pop Email Subscription Widget Untuk Blogger

Auto Pop Email subscription widget untuk Blogger . Satu cara mudah untuk mendapatkan lebih pelanggan e-mel. Widget ini tumbul apabila cursor menekan atas sekali. Elemen ini boleh berubah mengikut keperluan anda. . Jadi, apabila anda menatal lalu bahagian komen blog anda ia akan Popout dari atas. Anda boleh menambah widget ini ke dalam blog anda melalui tutorial dibawah ini..





Bagaimana Untuk Tambah Auto Pop Email Subscription Widget Untuk Blogger

Langkah 1
1. Login ke Blogger, Klik Layout :



2. Pada Elemen Halaman, klik Add Gadget di lokasi yang Anda ingin letak; 
3. Pilih HTML/Javascript;



Langkah 2
Copy kode dibawah ini dan letakkan dalam kontent yang telah anda buka tadi.






<style type='text/css'> /*<![CDATA[*/ #slider{     position:fixed;    top:-125px;    right:0px;    height:120px; width:100%;    background-color:#fff;    opacity:0.98;    -moz-box-shadow:    0px 0px 8px #ccc;    -webkit-box-shadow: 0px 0px 8px #ccc;    box-shadow:         0px 0px 8px #ccc;   }   .syb_footer{margin-top:-10px;font-size:0.8em;} #slider #slider-shell{    width:800px; height:110px;margin:10px auto;    position:relative;   }   #slider #slider-tab{position:absolute; bottom:0px; right:0px;    width:400px; text-align:right; padding-right:10px;    cursor:pointer; font-size:0.6em;   } #syb_embed_signup{ background:#fff; clear:left; font:14px Helvetica,Arial,sans-serif; }#syb_embed_signup form {display:block; text-align:left; padding:10px 0 10px 3%}#syb_embed_signup h2 {font-weight:bold; padding:0; margin:15px 0; font-size:1.4em;}#syb_embed_signup input {border:1px solid #999; -webkit-appearance:none;}#syb_embed_signup input[type=checkbox]{-webkit-appearance:checkbox;}#syb_embed_signup input[type=radio]{-webkit-appearance:radio;}#syb_embed_signup input:focus {border-color:#333;}#syb_embed_signup .button {clear:both; background-color: #aaa; border: 0 none; border-radius:4px; color: #FFFFFF; cursor: pointer; display: inline-block;font-size:15px; font-weight: bold; height: 32px; line-height: 32px; margin: 0 5px 10px 0; padding:0; text-align: center; text-decoration: none; vertical-align: top; white-space: nowrap; width: auto;}#syb_embed_signup .button:hover {background-color:#777;}#syb_embed_signup .small-meta {font-size: 11px;}#syb_embed_signup .nowrap {white-space:nowrap;}     #syb_embed_signup .clear {clear:none; display:inline;}#syb_embed_signup label {display:block; font-size:16px; padding-bottom:10px; font-weight:bold;}#syb_embed_signup input.email {padding:8px 0; margin:0 4% 10px 0; text-indent:5px; width:58%; min-width:130px;}#syb_embed_signup input.button {width:35%; margin:0 0 10px 0; min-width:90px; }  /*]]>*/ </style><script type='text/javascript' src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js'></script><div id='slider' style='top: -108px;'><div id='slider-shell'><div id='syb_embed_signup'><form action='http://feedburner.google.com/fb/a/mailverify?uri=jeritanblog' id='syb-embedded-subscribe-form' method='post' onsubmit='window.open(&quot;http://feedburner.google.com/fb/a/mailverify?uri=&quot;, &quot;popupwindow&quot;, &quot;scrollbars=yes,width=550,height=520&quot;); return true' target='popupwindow'><label for='syb-EMAIL'>Get my next article in your inbox!</label><input class='email' id='syb-EMAIL' name='email' placeholder='Email Address' required='required' type='email' /><div class='clear'><input class='button' id='syb-embedded-subscribe' style='background-color: #0066cc;' type='submit' /></div></form><div class='syb_footer'><small><a id='syb_email_link' target='_blank' href='http://www.jeritanblog.com' style='padding: 1px 0px 0px 19px;text-decoration:none;'><img src='http://img1.blogblog.com/img/blank.gif' alt='Email Subscription Widget for Blogger' style='border:none' /></a>Powered By <a href='http://www.jeritanblog.com' target='_blank' title='Blogger Widgets and Gadgets'>JeritanBlog Widgets</a></small></div></div><div id='slider-tab'>Wait! I want to get email updates, bring that back...</div></div></div><script type='text/javascript'>$(document).ready(function(){function isScrolledDown(a){var b=$(window).scrollTop();var c=b+$(window).height();var d=$(a).offset().top;var e=d+$(a).height();return(e<=c)}function isScrolledUp(a){var b=$(window).scrollTop();var c=b+$(window).height();var d=$(a).offset().top;var e=d+$(a).height();return(d-200>=c)}function bringSliderOut(){$(f).animate({top:0},'fast');$('#slider-tab').text('hide this...')}function bringSliderIn(){$(f).animate({top:-108},'fast');$('#slider-tab').text('Wait! I want to get email updates, bring that back...')}var f=$('#slider');var g=$('#comments');var h=false;var i=false;$('#slider-tab').click(function(){if(!i){bringSliderOut();i=true}else{bringSliderIn();i=false}});$(window).scroll(function(){if(isScrolledUp(g)){if(h){bringSliderIn();h=false;i=false}}else if(isScrolledDown(g)){if(!h){bringSliderOut();i=true;h=true}}})});  </script>


Edit :-

Anda perlu tukar warna purple sahaja kepada FeedBurner ID Anda..
uri=jeritanblog

Catat Ulasan

5 Ulasan