Beautiful RSS Email Subscriber Blogger

Untuk meningkatkan traffic ke halaman blog yang kita kelola apapun akan dilakukan oleh seorang blogger, salah satunya dengan menambahkan sebuah widget berlangganan artikel atau dalam istilah kerennya dikenal dengan RSS Email Subscriber.

Seorang pengunjung setia blog rekan-rekan yang ketagihan dengan artikel-artikel di blog rekan-rekan tentunya akan selalu bolak-balik membuka blog rekan-rekan untuk mengecek adakah artikel terbaru ?. Selama koneksi internet pengunjung baik-baik saja mungkin hal ini tidak akan menjadi masalah, disisi lain apakah blog rekan-rekan selalu ringan untuk di akses apabila banyak kunjungan, begitupun bagaimana jika rekan-rekan banyak mengupdate artikel dan artikel lama telah tertutup di halaman utama ? sayang sekali artikel tersebut kemungkinan akan terlewatkan untuk dibaca.

Hal inilah yang mendasari penggunaan RSS Email Subscriber, ketika seorang pembaca setia blog rekan-rekan mendaftarkan emailnya, kemudian rekan-rekan memperbaharui artikel, secara otomatis pembaharuan artikel tersebut akan diteruskan berupa feed ke semua alamat email pembaca yang telah mendaftarkan emailnya. Apakah rekan-rekan akan kehilangan traffic karena para pembaca hanya membaca lewat email ?

Kemungkinan tersebut memang ada, namun ada hal lain yang justru meningkatkan traffic ke blog rekan-rekan, dengan feed tersebut bisa merupakan pengingat kepada para pengunjung untuk kembali mengunjungi dan mencari informasi lain di blog rekan-rekan, dengan feed inipun para pembaca setia blog rekan-rekan bisa langsung meneruskan feed ke email rekan-rekannya, bagaimana sudah terbayangkan apa yang akan terjadi ?.

Menurut penulis ini merupakan cara "konvensional" dalam beberapa Teknik SEO, jika kita perhatikan trend sekarang ini para blogger lebih mengejar traffic melalui Social Media, memang social media saat ini secara luar biasa memberikan traffic tak terbatas ke blog kita, hal ini tentunya jika rekan-rekan memahami bagaimana caranya memaksimalkannya, dalam artikel selanjutnya hal ini akan kita bahas.

Kembali ke RSS Email Subscriber, meskipun cara lama namun menurut penulis justru ini cara yang paling awet ditengah-tengah gempuran social media, alasannya adalah ketika seseorang mempunyai alamat email, jarang sekali orang tersebut berganti email bahkan kemungkinan satu email seumur hidup, berbeda dengan social media meskipun saat ini sedang booming, tidak sedikit pula beberapa social media mengalami penurunan, contoh saja Friendster yang hilang ditelan bumi.

Nah dari penjelasan yang cukup panjang tersebut, rekan-rekan sudah bisa mempertimbangkan apakah akan memasang juga RSS Email Subscriber Widget pada blog rekan-rekan ?, untuk yang berminat berikut kami paparkan cara pemasangannya :

• Seperti biasa login ke Akun Blogger rekan-rekan.
• Backup Template bila nanti ada kegagalan saat mecoba widget ini.
• Tuju bagian Edit HTML.
• Cari kode ]]></b:skin> dan letakan kode CSS berikut diatasnya.

/* RSS WIDGET START */
#salahuddin-ayubi{border:0;margin-bottom:10px;margin:0 auto;width:300px}
#email-news-subscribe .email-box{padding:5px;font-family:Arial,Helvetica,sans-serif;height:38px}
#email-news-subscribe .email-box input.email{background:#FFF;border:1px solid #dedede;color:#999;padding:7px 10px 8px;-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:#fff;padding:7px 14px;margin-left:3px;font-weight:700;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:#FFF}
.emailicon{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipb0K6gAu5pkccUD4rvISmmqtZO751uKXy2jcEBRVzI9ufbDk1srnGIfoUxr52FoSzFsOBbYtg-KGVgvepl3etcPcYxnX3X6WLU8qnSI6C8S6jvhonIlnRaMpaRqmzMST4G-OsLSSzfF0/s1600/RSS_Logo_100x100.png) no-repeat scroll 0 2px transparent;padding:0 20px 0 95px;min-height:100px;margin:0;width:183px;line-height:20px;vertical-align:middle;font-size:14px;color:#333}
.emailicon p{color:#FF8604;font-size:20px;font-weight:400;font-family:impact;padding:40 0 10px;margin:0 0 0 10px;padding-top:18px;line-height:25px;text-shadow:0 1px 0 #fff,0 2px 0 #C6C6C6}
    <!--[if IE]> 
    #email-news-subscribe .email-box input.subscribe{background: #333} 
    <![endif]-->
/* RSS WIDGET END */

• Simpan Template, belum selesai ...
• Tuju bagian Tata Letak >> Add Gadget >> HTML/Javascript.
• Silahkan pilih letak widget disposisikan dimana, biasanya di bagian sidebar bagian atas.
• Masukan kode HTML berikut kedalam formulir HTML/Javascript.

<div id="salahuddin-ayubi" >
 <div class="emailicon"><p>Dapatkan Artikel Terbaru dari Kami, Gratis ! </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.open('http://feedburner.google.com/fb/a/mailverify?uri=fenuto','popupwindow','scrollbars=yes,width=550,height=520');return true">
    <input class="email" type="text" style="width: 167px; font-size: 12px;" id="email" name="email" value="Enter your email here..." onblur="if (this.value == &#39;&#39;) {this.value = &#39;Enter your email here...&#39;;}" onfocus="if (this.value == &#39;Enter your email here...&#39;) {this.value = &#39;&#39;;}"/>
    <input type="hidden" value="fenuto" name="uri" /> <input type="hidden" name="loc" value="en_US" /> 
    <input class="subscribe" name="commit" type="submit" value="Subscribe" /> 
   </form> 
  </div> 
 </div>
</div>

• Simpan Formulir.
• Sekarang baru selesai.

Seperti biasa widget ini sangat serasi dengan tampilan blog penulis (fenuto.com) secara keseluruhan, namun belum tentu serasi untuk blog rekan-rekan, untuk itu sedikit banyak kita harus tahu mengani bahasa CSS, sehingga kita bisa memodifikasi widget ini agar serasi dengan blog rekan-rekan.

Pengaturan :

• Rekan-rekan bisa ganti kalimat ini "Dapatkan Artikel Terbaru dari Kami, Gratis !" dengan kalimat lain yang dikehendaki.
• Ubah alamat uri ini "fenuto" dengan alamat uri Feed Burner rekan-rekan, jika belum punya silahkan daftar di Sini.
• Ganti kalimat ini "Enter your email here..." dengan kalimat lain yang dikendaki.
• Ganti url gambar ini "https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEipb0K6gAu5pkccUD4rvISmmqtZO751uKXy2jcEBRVzI9ufbDk1srnGIfoUxr52FoSzFsOBbYtg-KGVgvepl3etcPcYxnX3X6WLU8qnSI6C8S6jvhonIlnRaMpaRqmzMST4G-OsLSSzfF0/s1600/RSS_Logo_100x100.png" dengan gambar lain jika rekan-rekan mempunyai gambar lain, untuk ukuran gambar penulis sarankan 100x100 pixel, boleh format icon atau gambar biasa berekstensi png, jpg dll.

Selebihnya silahkan bereksperimen, semoga artikel ini bermanfaat untuk kita semua, jika ada yang perlu dipertanyakan silahkan tinggalkan jejak di kotak komentar atau kontak form, team penulis dengan senang hati akan mencoba membantu.