Memasang Kotak Email Subscription 2

Memasang Widget seperti diatas berfungsi untuk memberitahu para pelanggan setia blog kamu jika ada update postingan terbaru dari blog kamu. Cara membuatnya pun cukup mudah, Terimakasih untuk http://www.mybloggertricks.com/ atas kode-nya yang sangat menakjubkan. Lihat langkahnya dibawah ini :

1. Sign in ke Blogger.

2. Klik Rancangan --> Elemen Laman --> Tambah Gadget --> HTML Javascript.

3. Masukan Kode Javascript dibawah ini :

    <style>
    .mbt-email{
    background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjhb6TPnL7EsldMnaodW9ib5bD4_JpSv-6bzyE_uixuG2Co2t3NRoQQCYxDjQQf6Fti9USkAfum_bfGzT8E8mqZrZNJNmDa11ntWKhO4AFcCMzsotkuegsrsl3Ze6p_YsugpN8SI79oPX__/s1600/email.png) no-repeat 0px 12px ;
    width:300px;
    padding:10px 0 0 55px;
    float:left;
    font-size:1.4em;
    font-weight:bold;
    margin:0 0 10px 0;
    color:#686B6C;
    }

    .mbt-emailsubmit{
    background:#9B9895;
    cursor:pointer;
    color:#fff;
    border:none;
    padding:3px;
    text-shadow:0 -1px 1px rgba(0,0,0,0.25);
    -moz-border-radius:6px;
    -webkit-border-radius:6px;
    border-radius:6px;
    font:12px sans-serif;
    }
    .mbt-emailsubmit:hover{
    background:#E98313;
    }
    .textarea{
    padding:2px;
    margin:6px 2px 6px 2px;
    background:#f9f9f9;
    border:1px solid #ccc;
    resize:none;
    box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
    -moz-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1);
    -webkit-box-shadow:inset 1px 1px 1px rgba(0,0,0,0.1); font-size:13px;
    width:170px;
    color:#666;}

    </style>

    <div class="mbt-email">
    Subscribe via Email
    <form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=TntByStc', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
    <input gtbfieldid="3" class="textarea" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter email address here&quot;;}" onfocus="if (this.value == &quot;Enter email address here&quot;) {this.value = &quot;&quot;;}" value="Enter email address here" type="text" />
    <input type="hidden" value="hzndi" name="uri"/><input type="hidden" name="loc" value="en_US"/>
    <input class="mbt-emailsubmit" value="Submit" type="submit" />
    </form>
    </div>

   

Note :  
width:300px; = adalah ukurannya,
Ganti kode http://feedburner.google.com/fb/a/mailverify?uri=hzndi dengan alamat Feedburner kamu.
value="hzndi" = ganti lagi kode yang berwarna merah dengan nama judul feedburner kamu. Misalkan Blog ini punya alamat feed http://feedburner.google.com/fb/a/mailverify?uri=hzndi, maka kamu ganti kode yang berwarna merah tadi dengan kode yang berwarna biru seperti contoh (namun dengan judul feed kamu).


4. Simpan template.

Postingan Terkait:

Posted in: Blogger,Widget