Cara Gampang Menciptakan Floating Berlangganan Email Rss Feedburner

Cara Praktis Membuat Floating Berlangganan Email RSS Feedburner - Rss feed yaitu fitur dari blogger untuk memudahkan para pembaca dan pengunjung blog untuk mendapat update info sebuah blog melalui email. Nah cara ini diyakini para pakar SEO berkhasiat untuk mempertahankan pengunjung blog untuk selalu mengikuti update info yang kita publikasikan sehingga para pengunjung maupun blog setia mengikuti perkembangan blog.

Banyak cara yang sanggup dilakukan untuk menciptakan hal ini tetapi tampilannya kurang menarik apalagi fitur widget bawaan orisinil dari blogger. Nah yang akan kita bahas kali ini yaitu widget pop up yaitu widget layanan langganan email yang melayang di blog dilengkapi dengan tombol close untuk mempermudah menutup widget bagi pengunjung blog yang tidak menginginkan berlangganan email.

Semua orang tahu pentingnya RSS feed ini. Kaprikornus lebih baik untuk memperlihatkan pembaca pilihan untuk berlangganan feed blog Anda melalui email. Dalam widget ini pengunjung sanggup berlangganan update harian blog anda via RSS FEED. Berikut yaitu cara menciptakan widget pop up berlangganan email.

Cara menginstal widget langganan rss feddburner
Sebelum Anda mengedit setiap template lebih baik untuk memBackup nya terlebih dahulu, cara bijak untuk mencegah kemungkinan yang tidak diinginkan. Dan kalau langkah anda benar maka tampilannya akan menyerupai dibawah ini:

1 Masuk akun Dashboard Blogger >> Template >> Edit HTML
2 Cari aba-aba </ head> dalam template Anda berikutnya untuk mempermudah pencarian ketik Ctrl + F.
3 Paste aba-aba berikut sebelum / di atas aba-aba </ head> yang saya sebutkan diatas

<script src='https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js'>
</script>
<script src='http://yourjavascript.com/69231961363/jquery-colorbox-min.js' type='text/javascript'/>
<script type='text/javascript'> jQuery(document)
.ready(function(){ if (document.cookie.indexOf(&#39;visited=true&#39;) == -1) {
var setDays = 1000*60*60*24*7;
var expires = new Date((new Date()).valueOf() + setDays);
document.cookie = &quot;visited=true;expires=&quot; + expires.toUTCString();
$.colorbox({width:&quot;395px&quot;, height:&quot;435px&quot;, inline:true, href:&quot;#email-popup&quot;});
}});
</script>

4. Langkah selanjutnya Cari kode  ]]></ b:skin> kemudian tempatkan aba-aba dibawah ini tepat sebelum atau di atas aba-aba yang saya sebutkan

    #subscriptionwrap {
        width: 600px;
        background: #e9e9e9;
        padding: 15px;
        margin: 14px;
        border: 1px solid #ddd;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        -webkit-box-shadow: 0 1px 0px #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);
        -moz-box-shadow: 0 1px 0px #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);
        box-shadow: 0 1px 0px #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);
    }

    .subscriptionbox h4 {
        font-size: 30px;
        font-family: 'Verdana', Arial;
        font-variant: small-caps;
        margin: 0 auto;
        text-align: center;
        line-height: 30px;
        color: #333;
        font-weight: 600;
        text-shadow: 1px 1px 5px #333;
        text-decoration: none !important;
    }

    .subscriptionbox p {
        font-family: georgia;
        font-style: italic;
        font-size: 26px;
        text-align: center;
        margin: 0px;
        line-height: 30px;
        margin-top: 25px;
        border-bottom: 1px solid #333;
        color: #454545;
        padding-bottom: 20px;
    }

    .emailbutton1 {
        background: #f7f8f9;
        background: -webkit-linear-gradient(top,#f7f8f9 0%,#e9e9e9 100%);
        background: -moz-linear-gradient(top,#f7f8f9 0%,#e9e9e9 100%);
        background: -o-linear-gradient(top,#f7f8f9 0%,#e9e9e9 100%);
        background: -ms-linear-gradient(top,#f7f8f9 0%,#e9e9e9 100%);
        background: linear-gradient(top,#f7f8f9 0%,#e9e9e9 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#f7f8f9",endColorstr="#e9e9e9",GradientType=0 );
        border: 1px solid #ddd;
        -webkit-border-top-right-radius: 4px;
        -moz-border-top-right-radius: 4px;
        border-top-right-radius: 4px;
        -webkit-border-bottom-right-radius: 4px;
        -moz-border-bottom-right-radius: 4px;
        border-bottom-right-radius: 4px;
        -webkit-box-shadow: 0 1px 0 #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);
        -moz-box-shadow: 0 1px 0 #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);
        box-shadow: 0 1px 0 #f9f9f9 inset,1px 1px 1px rgba(223,223,223,0.4);
        color: #888 !important;
        text-shadow: 0 1px 0 #fff;
        line-height: 1.5;
        top: 0px;
        margin: 10px 0 0 -15px;
        cursor: pointer;
        padding: 18px 15px 15px 15px !important;
        font-size: 14px;
        font-weight: bold;
        text-decoration: none !important;
    }

    .emailbutton1:hover {
        background: #f1f1f1;
        background: -webkit-linear-gradient(top,#f1f1f1 0%,#e0e0e0 100%);
        background: -moz-linear-gradient(top,#f1f1f1 0%,#e0e0e0 100%);
        background: -o-linear-gradient(top,#f1f1f1 0%,#e0e0e0 100%);
        background: -ms-linear-gradient(top,#f1f1f1 0%,#e0e0e0 100%);
        background: linear-gradient(top,#f1f1f1 0%,#e0e0e0 100%);
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr="#f1f1f1",endColorstr="#e0e0e0",GradientType=0 );
        text-decoration: none !important;
    }

    .emailinput1 {
           width: 490px !important;

        height: 37px;    padding-right: 30px !important;
        float: left;
        margin: 10px 0 0 0px;
        padding: 8px 40px 8px 10px;
        border: 1px solid #d2d2d2;
        background: #fff;
        font-family: georgia;
        font-style: italic;
        font-size: 16px;
        color: #949494;
        -webkit-border-radius: 4px;
        -moz-border-radius: 4px;
        border-radius: 4px;
        text-decoration: none!important;
    }

5. Simpan template Anda dan Anda selesai tinggal dua langkah terakhir! Kunjungi blog Anda untuk mengecek widget tersebut bekerja sempurna? kalau semuanya bekerja dengan baik maka Ikuti langkah terakhir di bawah ini.
6. Sekarang cari aba-aba berikut ini </ body>
7. Paste aba-aba berikut sebelum tag </ body>.

     <div style='display:none'>
<div id='email-popup' style='position:scroll; z-index:99999;'>
<div id='subscriptionwrap'>
<div class='subscriptionbox'>
<h4>Ready To Be Make <strong>Elegant Blog</strong></h4>
<p>Subscribe to to enjoy Tips Information</p>
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform1' method='post' onsubmit='window.open(&quot;http://feedburner.google.com/fb/a/mailverify?uri=sharetipsdancara&quot;, &quot;popupwindow&quot;, &quot;scrollbars=yes,width=550,height=520&quot;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='sharetipsdancara'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='emailinput1' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}' onfocus='if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}' type='text' value='Enter your email...'/>
<input class='emailbutton1' title='' type='submit' value='SignUp'/>
</form>
</div>
</div>
  </div>
  </div>

8. Sekarang Anda perlu menciptakan perubahan-perubahan dalam aba-aba html.
Mengedit teks yang saya kasih warna merah untuk edit bab atas kotak input.
Sekarang ganti sharetipsdancara dengan link Email RSS Feedburner Anda. Anda sanggup mendapatkannya dengan mengunjungi akun feedburner Anda kemudian arahkan ke Publikasikan dan kemudian ke Email Berlangganan.
Ganti sharetipsdancara dengan judul feed Anda. Ini muncul di final link feed Anda. Dalam hal ini akun saya yaitu <input name = Jenis 'uri' = 'hidden' value = 'sharetipsdancara' />

9. Simpan template Anda.

Share this post