Cara membuat widget subscribe v.4.0

Salam bloger !! buat sobat sobat saya yang tetap konsisten pada pengembangan blogspot di tanah air tercinta ini. Kali ini saya akan menjelaskan cara membuat widget email subcribe v.4.0 yang telah saya perbaharui dari widget email subcribe yang sebelum sebelumnya. Perbedaan dari widget email subcribe v.4.0 dari Versi terdahulunya memang tidak mempunyai perbedaan yang terlalu jauh menurut saya, tapi saya tidak tau tentang pendapat sobat sobat saya. Widget Email Subcribe v.4.0 ini memiliki fitur fitur antara lain :

• G+
• Facebook
• Twitter
• RSS
• FeedCount ( Feedburner )
• Form Subcribe ( Feedburner )

Oke langsung saja menuju TKP.

• Login ke Dasbor
• Pilih Layout  Tata Letak.
• Tambahkan Gadget ( letaknya tergantung anda ) pilih HTML/JavaScript
• Copas code dibawah ini

<tablewidth="175" border="0" cellpadding="0"cellspacing="0">

  <!--DWLayoutTable--><tr><tdwidth="250" height="157" valign="top">

<style>

.rivaistyle{/*Rivai Blog  */

list-style-type:none;

margin:0;

padding:0;

}

.rivaistyleli{

display:inline;

width:60px;

height:60px;

}

.rivaistyleli img{

width:50px;

height:50px;

border:0;

margin-right:4px;

-webkit-transition:-webkit-transform0.1s ease-in;

-o-transition:-o-transform0.1s ease-in;

}

.rivaistyleli img:hover{

-moz-transform:scale(1.2);

-webkit-transform:scale(1.2);

-o-transform:scale(1.2);

}

.email-subscribe-emailbox{

   padding: 5px 13px;

font-family:"Courier New", Courier, monospace;

border-top:0px solid silver;

border-image:initial;

height:42px;

background:#fff;

width:none;

    }

    .email-subscribe-emailbox form{width:100%;-webkit-box-sizing: border-box;-moz-box-sizing:border-box;-ms-box-sizing: border-box;box-sizing: border-box;border: 0;}

    .email-subscribe-emailbox input.emailu{background: #eee1c9;border: 1px solid #BEBEBE;margin-left:-5px;float:left;-webkit-box-sizing: border-box;-moz-box-sizing:border-box;-ms-box-sizing: border-box;box-sizing: border-box;color:#BE7E7E;padding: 7px 10px 8px;width: 100%;-webkit-border-radius:3px;-moz-border-radius: 3px;border-radius: 3px;font-size: 14px;font-weight:bold;}

    .email-subscribe-emailboxinput.emailu:focus {color: #333;}

    .email-subscribe-emailbox input.submitu {

    -webkit-border-radius:3px;-moz-border-radius: 3px;border-radius: 3px;color: white;padding: 8px 10px;

font-weight:bold;

font-size:13px;

margin-bottom:1px;

float:right;

cursor:pointer;

}

    .email-subscribe-emailboxinput.submitu:hover {text-decoration: none;}

    .kirimDefault {border: 0px solid#dedede;text-shadow: #3d3d3c 1px 1px 0;background-color: #393433;background:linear-gradient(center top,#393433 0,#393433 100%);background:-webkit-linear-gradient(center top,#393433 0,#393433 100%);background:-moz-linear-gradient(center top,#393433 0,#393433 100%);background:-o-linear-gradient(center top,#393433 0,#393433 100%);background:-ms-linear-gradient(center top,#393433 0,#393433 100%);background:linear-gradient(center top,#393433 0,#393433 100%);}

    .kirimDefault:hover {background-color:#015828;background: -webkit-gradient(linear,left top,leftbottom,color-stop(0,#015828),color-stop(1,#015828));background:-webkit-linear-gradient(center top,#015828 0,#015828 100%);background:-moz-linear-gradient(center top,#015828 0,#015828 100%);background:-o-linear-gradient(center top,#0096ff 0,#0096ff 100%);background:-ms-linear-gradient(center top,#ffe480 0,#ff9b00 100%);background:linear-gradient(center top,#0096ff 0,#0096ff 100%);}

    .style1 {

            font-family: Georgia,"Times New Roman", Times, serif;

            font-size: 14px;

}

    </style>

      <table width="250"border="0" cellpadding="0" cellspacing="0">

        <!--DWLayoutTable-->

        <tr><td width="250"height="79" align="center"><divclass="rivaistyle"><center>

              <li><ahref="https://plus.google.com/108560124605502700357"><imgsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjiUSISivmTfdDLbP7eXV3K7u3oon5__V59YSM8nHaOI7k-ZBsuw7pfh2byZmG0tt6MBZ2EsDts2sihYXkFtRODHS5QVYn4HQ0csaIhrcSgEbrva4DjfIELXYkkCDNJIPmq47EY2BEModU/s1600/G+.png"width="50" height="50" title="Add to G+"/></a><a href="https://www.facebook.com/rivaisilaban"><imgsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhMDcE0kK7QWk_jP-XhmkDDWQX_Ff15sriErBGtNyijqEKQlxxr4pOPPXUhYA-WQqwYyPffoPyhZCRQxsbd3rT2QEfcOLZbZCf6tpawaMIxqXqYwJgx18SobKC1EnvO6VFUwrZPCEzxN-o/s1600/fb.png"width="50" height="50" title="Add to Facebook"/></a><a href="https://twitter.com/Rivai_Silaban"><imgsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEitaGbxxZN2r1MRPeIMT8EJAaqM5_2D9aH0TXzTFY3o86h67fov_Nqykz5mEmqZ9mdVXwhKKHloeiCrFsjc4aQ0vjcddFLuI42mPhvhAcO-I0imUGYopDCLphRlVIUuH54MtfB2Wm68Aa8/s1600/Twitter.png"width="50" height="50" title="Add to Twitter"/></a><ahref="http://feeds.feedburner.com/RivaiSilaban"><imgsrc="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiO91xpIV_hyUZCjFWYZdmI2UGV__-QMXETWiMRl3v_pkxKSwpUmkgr07OFVCAI5-j9UaM5yt4v5NOMs9xJhOPEbHvPoSPxbxTuTG4BAIZ7uO2YFn3j7QEq47zk7fnwS5A7SMRLQbFJOac/s1600/Rss.png"width="50" height="50" title="Add RSS Feed"/></a></li>

  </center></div>

   <divclass="email-subscribe-emailbox">

     <formaction="http://feedburner.google.com/fb/a/mailverify"method="post"onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=RivaiSilaban','popupwindow', 'scrollbars=yes,width=550,height=520'); return true"target="popupwindow">

       <table width="250px">

         <!--DWLayoutTable-->

         <tbody><tr> <tdheight="24" colspan="4" align="right"valign="top" class="email-subscribe-emailbox"><inputname="uri" value="RivaiSilaban" type="hidden"/>

             <input name="loc"value="en_US" type="hidden" />

             <input class="emailu"name="email" placeholder="Email anda disini !"type="text" />      </td></tr><tr><tdwidth="123" height="28" align="right"valign="middle"><ahref="http://feeds.feedburner.com/RivaiSilaban"><imgsrc="http://feeds.feedburner.com/~fc/RivaiSilaban?bg=660000&amp;fg=99FF00&amp;anim=1"height="26" width="88" style="border:0"alt="Fellow Readers" /></a></td>

      <tdwidth="7">&nbsp;</td><td width="73"align="right" valign="top"><input class="submitukirimDefault" value="Subscribe" type="submit"/></td> <td width="19">&nbsp;</td></tr></tbody></table></form></div></td></tr></table></td></tr></table>

Keterangan gambar

width="175" ukuran lebar widget

https://plus.google.com/108560124605502700357 ganti dengan URL social anda

RivaiSilaban  ganti dengan Id Feedburner anda

Code yang diblog warna pink ganti dengan feedcount feedburner anda.

 Update terbaru dari Widget Subcribe v.4.0 ini akan dapat mempercantik blog sobat, selamat mencoba.

Nb : Bila ada kesalahan dalam menulis code script silahkan hubungi saya dengan kotak komentar dibawah ini. 

 

Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.

Salam Blogger.... !!! .

Admin Rivai Silaban

Share article with : Google+ Facebook Twitter

Di posting oleh : Unknown Update pada : 10:17 PM