Cara memasang Widget Email Berlangganan di blog

Assalamu'alaikum Wr. Wb.
Pada kesempatan ini saya akan share sedikit tentang pengalaman saya di dunia blogger, sebelumnya baca artikel saya yang satu ini cara Memasang Widget Popular Post 9 Warna

Para blogger pasti mengharapkan untuk banyak mempunyai pengunjung bukan?
sebenarnya saya mempunyai banyak cara untuk para sobat blogger yang memang sangat ingin mempunyai banyak pengunjung, seperti mempromosikannya di jejaring sosial dengan memasang Widget Fanspage, Follow Us di blog, dan sekarang saya akan membagikan cara lain untuk sobat blogger yang memang ingin memperbanyak penunjungnya..

caranya dengan memasang Widget Email Berlanggan ini di blog sobat.. Widget ini mempunyai fitur menarik seperti Berlangganan melalui Google +, Twitter, FeedBurner :v so, jika orang banyak berlangganan dengan blog sobat, maka mereka akan selalu melihat apa saja artikel terbaru dari blog sobat.. jadi, saya yakin mereka akan selalu update deh artikel artikel terbaru sobat..

gimana? mau coba? boleh :

1. masuk blogger
2. Tata Letak -> tambahkan gadget
3. pilih HTML/Javascript
4. masukkan kode di bawah ini :

<style>
    #dgenera-blog {
        border: 0;
        margin-bottom: 10px;
        margin: 0 auto;
            width:300px;
    }

    #email-news-subscribe .email-box{
        padding: 5px 5px;
        font-family: "Arial","Helvetica",sans-serif;
       height:38px;}
    #email-news-subscribe .email-box input.email{
        background:#FFFFFF;
        border: 1px solid #dedede;
        color: #999;
        padding: 7px 10px 8px 10px;
        -moz-border-radius: 3px;
        -webkit-border-radius: 3px;
        -o-border-radius: 3px;
        -ms-border-radius: 3px;
        -khtml-border-radius: 3px;
        border-radius: 3px;
        border-image: initial;
        font-family: "Arial","Helvetica",sans-serif;}
    #email-news-subscribe .email-box input.email:focus{color:#333}

#email-news-subscribe .email-box input.subscribe{
        background: -moz-linear-gradient(center top,#666 0,#333 100%);
        background: -webkit-gradient(linear,left top,left bottom,color-stop(0,#666),color-stop(1,#333));

        font-family: "Arial","Helvetica",sans-serif;
        border-radius:3px;
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
        border:1px solid #333;
        color:white;

        padding:7px 14px;
        margin-left:3px;
        font-weight:bold;
        font-size:12px;
        cursor:pointer;
        border-image: initial;}

    #email-news-subscribe .email-box input.subscribe:hover{

        background-image:-moz-linear-gradient(top,#333,#666);
        background-image:-webkit-gradient(linear,left top,left bottom,from(#333),to(#666));
        filter:progid:DXImageTransform.Microsoft.Gradient(startColorStr=#ffffff,endColorStr=#ebebeb);
        outline:0;-moz-box-shadow:0 0 3px #999;
        -webkit-box-shadow:0 0 3px #999;
        box-shadow:0 0 3px #999

        -pie-background:linear-gradient(270deg,#ffda4d,#ff9b00);
        border-radius:3px;
        -moz-border-radius:3px;
        -webkit-border-radius:3px;
        border:1px solid #333;
        color:#FFFFFF;
     }

    #other-social-bar {
        padding: 0px;
        overflow: hidden;
           height:37px;
         margin-top:-8px;
    }
    #other-social-bar ul {list-style: none outside none; padding-left: 4px;}

    #other-social-bar .other-follow {
        float: left;
        overflow: hidden;
        padding:5px;
        width: 270px;}
    #other-social-bar .other-follow ul {
        list-style: none outside none;
        padding-left: 4px;}
    #other-social-bar .other-follow li {

        display:inline;
        border:0;
      }

    #other-social-bar .other-follow li a {
        font-size: 12px;
        color:#666;
        font-weight: bold; font-family:arial;
        display:inline;
        }
    #other-social-bar .other-follow li.my-rss {
        background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjcCrpz-b-B2Yy7O4wvWB4rRKPtUvS2SRtFvWxdi22scyV1yE7hx8SrXqGPOfocgJWNY5FacRB_WIFBKNXGMrn4ADL5QUoY6gLk2177T_aLUpp0wf9o5CaxXWjxUVjrp4TzBccxJ89hEuc/s400/rss-16x16.png') no-repeat transparent;
        line-height: 1;
        padding: 0px 3px 1px 20px;
        width: 60px;
        margin-bottom:0px;
            margin-left:5px;}

    #other-social-bar .other-follow li.my-rss a, #other-social-bar .other-follow li.my-twitter a, #other-social-bar .other-follow li.my-gplus a{
    text-decoration:none;
    }
    #other-social-bar .other-follow li.my-rss a:hover, #other-social-bar .other-follow li.my-twitter a:hover, #other-social-bar .other-follow li.my-gplus a:hover{
    text-decoration:underline;
    }
    #other-social-bar .other-follow li.my-twitter {
        background: url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhif6IZD5mvEOVUW251IHTu9NoBF-zDk-Kt-iEx2rfmbHj5oaTFHgOuNae_9QHKT2mpobXbcTI9ecEC-_D9E0ugsD2ENlIohJDgQKnzMGijUXiLdqreoQWa7aoIAHdKn_NATe2zCrIc-1Q/s400/twitter%2527.png') no-repeat transparent;
        line-height: 1;
        padding: 0px 3px 1px 20px;
        width: 60px;
        margin-bottom:0px;}
    #other-social-bar .other-follow li.my-gplus {
        background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgnpDKWsXXJ6H5dcYTjhdk6uHimsooMD86Kb2ymzWQ3CtyHlaFc8PJ9BunQvKrlgkdoF0-SqLYb7YNhwXmlwoeErwLwCdSoPY1Z0Kp-EyB1btn29FZVNYxsY_ZFpVL_RkGVF-bODc0Ka1I/s400/gplus-16x16.png) no-repeat transparent;
        line-height: 1;
        width: 60px;
        padding: 0px 3px 1px 20px;
        margin-bottom:0px;}

.emailicon {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhmtw6erxhVm0Uu5GUNIRdZQIF5MluT6dEHoJ1vG0LoRexuyrwCtdCKGAIY50AGSiScXOQK-1t2n5_rFJxAgLlancExMZV9GvkHD-mBalDKi3IqvDZrd0s0rGKqWTpcwl5txazeoOTgwp6W/s400/MBT-RSS-FEED.gif") no-repeat scroll 0px 2px transparent;
     padding: 0px 20px 0px 95px;
    min-height:100px;
    margin: 0px;
    width: 183px;
    line-height: 20px;
    vertical-align: middle;
    font-size: 14px;
    color: rgb(51, 51, 51);
}

.emailicon p {
color:#FF8604;
font-size: 20px;
font-weight: normal;
font-family: impact;
padding:40 0px 10px 0px;
margin:0;
padding-top: 20px;
line-height: 25px;
text-shadow: 0px 1px 0px #fff, 0px 2px 0px #C6C6C6;
}
    </style>
    

<div id="dgenera-blog" >

<div class="emailicon"><p>Subscribe to our Free Email Updates! </p></div>
<div id="email-news-subscribe">
<div class="email-box"> <form action="http://feedburner.google.com/fb/a/mailverify" method="post" target="popupwindow" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=GilangRamdhani', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
<input gtbfieldid="10" class="email" type="text" style="width: 160px; font-size: 12px;" id="email" name="email"value="Enter your email here..." onblur="if (this.value == '') {this.value = 'Enter your email here...';}" onfocus="if (this.value == 'Enter your email here...') {this.value = '';}" type="text" />

<input type="hidden" value="GilangRamdhani" name="uri" /> <input type="hidden" name="loc" value="en_US" /> <input class="subscribe" name="commit" type="submit" value="Subscribe" /> </form> </div> </div>
<div id="other-social-bar">
<ul class="other-follow">
<li class="my-rss"> <a rel="nofollow" title="RSS" href="http://feeds.feedburner.com/GilangRamdhani" target="_blank">RSS Feed</a> </li>
<li class="my-twitter"> <a rel="nofollow" title="twitter" rel="author" href="https://twitter.com/Rpgilang_" target="_blank">Twitter</a> </li>
<li class="my-gplus"> <a rel="nofollow" title="Google Plus" rel="author" href=https://plus.google.com/u/0/114518003086333789720 target="_blank">Google Plus</a> </li>
</ul>
</div>
</div>

Tambahan :

Warna hijau ganti dengan Feedburner Sobat

Warna Merah ganti dengan Twitter Sobat

Warna Orange ganti dengan Google + sobat

4. Save

5. dan lihat hasilnya :)

Semoga artikel saya yang berjudul cara membuat dan memasang Widget Email Subcription di blog ini bermanfaat..