Berlangganan via email adalah cara yang sangat populer untuk berlangganan setiap blog / situs dan mendapatkan update langsung di kotak email, itu sebabnya Anda selalu dapat melihat bahwa jumlah pelanggan feed .
Disini saya akan berbagi beberapa formulir berlangganan email indah yang dirancang oleh design3edge dan saya telah mengkonversi mereka dari file ke dalam widget blogger. Saya telah mencoba yang terbaik untuk membuat tutorial ini dengan satu langkah installation. Anda hanya perlu copy dan paste kode. Sekarang mari kita pergi ke bentuk dan melihat bagaimana cara menambahkan widget ini ke blogger blog.


Cara Tambah Formulir Berlangganan Email Untuk Blogger


1. Login ke akun blogger Anda.

2. Pada Dasbor klick Tata Letak.

3. Tambah Gadget.

4. Pilih elemen HTML/Java Script.

5. Lalu letakkan salah satu kode script berikut ke dalamnya.


Email Formulir Gaya 1



<style type="text/css">
#otowebsite-emailbox {
    background: url(http://2.bp.blogspot.com/-8wxOrteiKqg/UB_R-GmaRaI/AAAAAAAAFXA/SipyYV2RYj8/s1600/otowebsite.blogspot.com-blue.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#otowebsite-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}
form#otowebsite-emailform #s {
    background: transparent;
    border: none;
    color: #444242;
    font-family: georgia;
    font-size: 15px;
    font-style: italic;
    height: 30px;
    margin-top: -2px;
    padding-left: 2px;
    vertical-align: top;
    width: 227px;
}
form#otowebsite-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</style>
<div id="otowebsite-emailbox">
    <form id="otowebsite-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=otowebsite', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="otowebsite" name="uri" />
        <input type="text" id="s" name="email" value="Enter Your E-Mail Here"
        onfocus='if (this.value == "Enter Your E-Mail Here") {this.value = ""}'
        onblur='if (this.value == "") {this.value = "Enter Your E-Mail Here";}'
        />
        <input type="hidden" name="loc" value="en_US" />
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
        />
    </form>
</div>


Email Formulir Gaya 2



<style type="text/css">
#otowebsite-emailbox {
    background: url(http://2.bp.blogspot.com/-RsFXF_8WjKI/UB_R_lkuY7I/AAAAAAAAFXI/NLxjNnwTI9c/s1600/otowebsite.blogspot.com-red.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#otowebsite-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}
form#otowebsite-emailform #s {
    background: transparent;
    border: none;
    color: #444242;
    font-family: georgia;
    font-size: 15px;
    font-style: italic;
    height: 30px;
    margin-top: -2px;
    padding-left: 2px;
    vertical-align: top;
    width: 227px;
}
form#otowebsite-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</style>
<div id="otowebsite-emailbox">
    <form id="otowebsite-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri= otowebsite', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="otowebsite" name="uri" />
        <input type="text" id="s" name="email" value="Enter Your E-Mail Here"
        onfocus='if (this.value == "Enter Your E-Mail Here") {this.value = ""}'
        onblur='if (this.value == "") {this.value = "Enter Your E-Mail Here";}'
        />
        <input type="hidden" name="loc" value="en_US" />
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
        />
    </form>
</div>


Email Formulir Gaya 3



<style type="text/css">
#otowebsite-emailbox {
    background: url(http://4.bp.blogspot.com/-JrzO8gBfAm4/UB_SDPuYB1I/AAAAAAAAFXQ/cBjYzxBoyj0/s1600/otowebsite.blogspot.com-silver.png)no-repeat scroll center center transparent;
    height: 143px;
    width: 368px;
}
form#otowebsite-emailform {
    display: block;
    margin: 0;
    padding-left: 42px;
    padding-top: 67px;
}
form#otowebsite-emailform #s {
    background: transparent;
    border: none;
    color: #444242;
    font-family: georgia;
    font-size: 15px;
    font-style: italic;
    height: 30px;
    margin-top: -2px;
    padding-left: 2px;
    vertical-align: top;
    width: 227px;
}
form#otowebsite-emailform #sbutton {
    background: transparent;
    border: none;
    cursor: pointer;
    height: 30px;
    padding-right: 45px;
}</style>
<div id="otowebsite-emailbox">
    <form id="otowebsite-emailform" action="http://feedburner.google.com/fb/a/mailverify"
    method="post" target="popupwindow" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=otowebsite', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true">
        <input type="hidden" value="otowebsite" name="uri" />
        <input type="text" id="s" name="email" value="Enter Your E-Mail Here"
        onfocus='if (this.value == "Enter Your E-Mail Here") {this.value = ""}'
        onblur='if (this.value == "") {this.value = "Enter Your E-Mail Here";}'
        />
        <input type="hidden" name="loc" value="en_US" />
        <input type="image" src="http://img1.blogblog.com/img/blank.gif" id="sbutton"
        />
    </form>
</div>

  • Ganti dua kode otowebsite dengan id feedsburner Anda.
6. Akhirnya menyimpan.

Sekarang Anda dapat melihat hasilnya pada sidebar blog Anda.

Saya rasa cukup untuk kali ini, mudah-mudahan Anda suka dengan Beautiful Email Subscription Forms For Blogger di atas!
Saya berharap bahwa Anda tidak akan menghadapi masalah ketika menerapkannya ke blog Anda. Namun jika Anda mendapatkan masalah Anda cukup melemparkan masalah dalam komentar!

Poskan Komentar Blogger Disqus

Catatan:
Untuk menyisipkan kode, gunakan tag <i rel="code">KODE ANDA...</i>
Kode yang panjang bisa menggunakan tag <i rel="pre">KODE PANJANG ANDA...</i>
Untuk menyisipkan gambar, gunakan tag <i rel="image">URL GAMBAR...</i>
Untuk menyisipkan judul, gunakan tag <b rel="h3">JUDUL ANDA DI SINI...</b>
Untuk menciptakan efek tebal gunakan tag <b>TEKS ANDA DI SINI...</b>
Untuk menciptakan efek huruf miring gunakan tag <i>TEKS ANDA DI SINI...</i>

Penting:
Jika Anda mengajukan pertanyaan klik 'Subscribe by email' link di bawah form komentar untuk mengetahui komentar balasan.

Khusus untuk membalas komentar disarankan menggunakan tombol balas/reply di samping komentar terkait dibandingkan menggunakan formulir komentar di bawah agar komunikasi lebih terstruktur.

Dilarang Meninggalkan Link Aktif, Link Aktif Terpaksa Akan Saya Hapus Dari Komentar.

NB: Jika ingin menuliskan kode pada komentar harap gunakan Tool untuk mengkonversi kode tersebut agar kode bisa muncul dan jelas atau gunakan tool dibawah "Konversi Kode di Sini!".

Konversi Kode di Sini! Daftar Member Aktif

 
Top