Cara Buat Kotak Berlangganan FeedBurner RSS-Email-Twitter Follow untuk Blogger / Blogspot mempunyai kegunaan atau fungsi dari Kotak Berlanggan Email ini adalah agar dapat memudahkan pengunjung untuk mendapat update terbaru dari blog yang kita miliki yang dikirimkan langsung lewat email sobat, tentunya dengan kita berlangganan terlebih dahulu pada feedburner blog atau situs juag Twitter Follow. Untuk contoh dari kotak berlangganan Email ini silahkan lihat pada gambar dibawah ini :
Selain itu dengan semakin banyaknya orang yang telah berlangganan email feed burner kita tentunya akan semakin banyak pengunjung tetap pada blog yang kita miliki. Adapun Membuat Kotak Berlangganan Email Feed Burner Untuk Blogger adalah sebagai berikut:
1.Seperti biasa log in dulu ke account blog sobat
2.Pada dasbor klik Rancangan kemudian pilih Edit HTML.
3. Cari kode berikut ini </head>
4. Letakkan kode di bawah ini sebelum kode tersebut :
<style type='text/css'>
#hsection{border:1px solid #D3D3D3;background-color:#FFFFFF;}
#hsection:hover{border:1px solid #BABABA;background-color:#F8E0E0;}
#sectionmy .sectionmy2 h2.subscription { border:0; margin:0; padding:6px 0 0 55px; height:42px; font-size:16px;font-family:"Segoe UI",Calibri,"Myriad Pro",Myriad,"Trebuchet MS",Helvetica,Arial,sans-serif;
font-weight:bold; }
#sectionmy .sectionmy2 h2.rss { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf0p3r3GTaPkxT-msdj5g58tQKYCwv6mLabogIfUTg4D7ohXluOVLnFuHBWn-ok90TLQ_tW84VbrLrAx3E1EC0d8-bX2LowhWVAesu8suAX2RwTVk9AODvFFuwDDY_R2MbJI9wEsKAZbM/s1600/RSS+Feed.png) no-repeat top left; }
#sectionmy .sectionmy2 h2.email { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7wBBsPtbK7tDH0MXUlv-ElgYqOwTGU7qfsNU1rbZS3w75-W9cv2uzoUxGAbUK1j7Yx-cntYbdgPtOCyYKN7vtUPnY7TMz-pCwRxlexGehJt0dcrtg6UuKzBS4-bnEeUNZeE3NhGLuhUM/s1600/Mail_Read.png) no-repeat top left; }
#sectionmy .sectionmy2 h2.twitter { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHjaBT7ysO6znTNXwwPiZFTY3BCG22fDPgVXIV679UYpVsDdo7BHn3IrpbNhiV_GyKBN2CAlz3IWeUT-YiZ1tM5qQN4x3NAi9hUi1WLJuk2yDav_sl4KZTxoc_fd03VIBvF-M6Cai48QY/s1600/Twitter+Logo.png) no-repeat top left; }
#sectionmy .sectionmy2 .subscription a { color:#252e28; text-decoration:none; }
</style>
#hsection{border:1px solid #D3D3D3;background-color:#FFFFFF;}
#hsection:hover{border:1px solid #BABABA;background-color:#F8E0E0;}
#sectionmy .sectionmy2 h2.subscription { border:0; margin:0; padding:6px 0 0 55px; height:42px; font-size:16px;font-family:"Segoe UI",Calibri,"Myriad Pro",Myriad,"Trebuchet MS",Helvetica,Arial,sans-serif;
font-weight:bold; }
#sectionmy .sectionmy2 h2.rss { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf0p3r3GTaPkxT-msdj5g58tQKYCwv6mLabogIfUTg4D7ohXluOVLnFuHBWn-ok90TLQ_tW84VbrLrAx3E1EC0d8-bX2LowhWVAesu8suAX2RwTVk9AODvFFuwDDY_R2MbJI9wEsKAZbM/s1600/RSS+Feed.png) no-repeat top left; }
#sectionmy .sectionmy2 h2.email { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7wBBsPtbK7tDH0MXUlv-ElgYqOwTGU7qfsNU1rbZS3w75-W9cv2uzoUxGAbUK1j7Yx-cntYbdgPtOCyYKN7vtUPnY7TMz-pCwRxlexGehJt0dcrtg6UuKzBS4-bnEeUNZeE3NhGLuhUM/s1600/Mail_Read.png) no-repeat top left; }
#sectionmy .sectionmy2 h2.twitter { background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHjaBT7ysO6znTNXwwPiZFTY3BCG22fDPgVXIV679UYpVsDdo7BHn3IrpbNhiV_GyKBN2CAlz3IWeUT-YiZ1tM5qQN4x3NAi9hUi1WLJuk2yDav_sl4KZTxoc_fd03VIBvF-M6Cai48QY/s1600/Twitter+Logo.png) no-repeat top left; }
#sectionmy .sectionmy2 .subscription a { color:#252e28; text-decoration:none; }
</style>
*Keterangan : kode yang berwarna merah untuk menentukan Logo / Gambar dari 3 item (RSS Feed, Email, dan Twitter) dapat Sobat ganti /modifikasi sesuai selara atau yang lebih keren dengan editing melalui Photoshop atau menggunakan Aplikasi Ilustrator dari GIMP dengan men-download disini. Berikut contoh Logo dari FeedBurner RSS-Email-Twitter Follow :
Url : https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgf0p3r3GTaPkxT-msdj5g58tQKYCwv6mLabogIfUTg4D7ohXluOVLnFuHBWn-ok90TLQ_tW84VbrLrAx3E1EC0d8-bX2LowhWVAesu8suAX2RwTVk9AODvFFuwDDY_R2MbJI9wEsKAZbM/s1600/RSS+Feed.png
Url : https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi7wBBsPtbK7tDH0MXUlv-ElgYqOwTGU7qfsNU1rbZS3w75-W9cv2uzoUxGAbUK1j7Yx-cntYbdgPtOCyYKN7vtUPnY7TMz-pCwRxlexGehJt0dcrtg6UuKzBS4-bnEeUNZeE3NhGLuhUM/s1600/Mail_Read.png
Url : https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHjaBT7ysO6znTNXwwPiZFTY3BCG22fDPgVXIV679UYpVsDdo7BHn3IrpbNhiV_GyKBN2CAlz3IWeUT-YiZ1tM5qQN4x3NAi9hUi1WLJuk2yDav_sl4KZTxoc_fd03VIBvF-M6Cai48QY/s1600/Twitter+Logo.png
5.Simpan Template.
6.Selanjutnya pada Rancangan pilih Elemen Laman Kemudian pilih Add gadget pilih HTML / Javascript.
7.Copy kode dibawah ini kemudian masukkan paste kedalamnya.
<div id="hsection">
<div id="sectionmy">
<div class="sectionmy2">
<h2 class="subscription rss"><a href="YOUR-RSS-FEED-URL">SUBSCRIBE VIA RSS</a></h2>
<h2 class="subscription email"><a href="YOUR-FEEDBURNER-EMAIL-SUBSCRIPTION-URL">SUBSCRIBE VIA EMAIL</a></h2>
<h2 class="subscription twitter"><a href="YOUR-TWITTER-URL">FOLLOW ON TWITTER</a></h2>
</div></div>
</div>
<div id="sectionmy">
<div class="sectionmy2">
<h2 class="subscription rss"><a href="YOUR-RSS-FEED-URL">SUBSCRIBE VIA RSS</a></h2>
<h2 class="subscription email"><a href="YOUR-FEEDBURNER-EMAIL-SUBSCRIPTION-URL">SUBSCRIBE VIA EMAIL</a></h2>
<h2 class="subscription twitter"><a href="YOUR-TWITTER-URL">FOLLOW ON TWITTER</a></h2>
</div></div>
</div>
8.Langkah terakhir Simpan Template
Keterangan : Ganti tulisan yang berwarna Orange dengan Url Feed Anda,yang warna Merah ganti dengan Url Feedburner Email Subscription anda,lalu yang berwarna Ungu dengan URL Twitter anda.
Selamat mencoba, semoga bermanfaat (",)
Kembali ke Menu Tutorial Blogspot
Selamat mencoba, semoga bermanfaat (",)
Kembali ke Menu Tutorial Blogspot
No comments:
Post a Comment