Cara Membuat Widget Berlangganan Artikel Pada Blog

Cara Membuat Widget Berlangganan Artikel Pada Blog - Hallo sobat blogger saya akan membagikan mengenai memasang Widget Berlangganan Artikel Pada Blog. Berlangganan email memakai FeedsBurner, Untuk memasang widget ini pada blog sobat, sobat blogger harus atau wajib memiliki ID FeedBurner kalau tidak mempunyai ID Feedburner bagaimana untuk berlangganan email. Jadi kalian harus membuat dulu FeedBuerner sobat
Sobat blogger kalo penasaran seperti apa bisa lihat Demonya ( Disini )
Atau bisa melihat gambarnya di bawah ini

Cara Membuat Widget Berlangganan Artikel Pada Blog
FB Twitter Goolge+ FeedBurner

Apa itu FeedBurner ?

FeedBurner email adalah layanan yang memungkinkan penerbit untuk menyampaikan konten feed mereka ke pelanggan melalui email.

Bagaimana Cara Mendaftar ID FeedBurner ?

  • 1. Masuk ke http://feedburner.google.com
  • 2. Isikan http://Tati-adita.blogspot.com/feeds/posts/default (Ganti dengan Website / blog sobat)
  • 3. Dan ikutin cara yang ada

Bagaimana Cara Memasang Widget berlangganan Artikel ?

  • 1. Sobat harus login blog dulu
  • 2. Pilih Tata Letak > Tambahkan Gadget > Pilih HTML/Javascript
  • 3. Copy Kode di bawah ini kemudian paste ke HTML/Javascript sobat
<style>
#sidebar-subscribe-box{width:300px;border:1px solid #aaa;border-radius:3px;padding:3px 0}
 .sidebar-subscribe-box-wrapper{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiQDnoTI-txQ9f28CvAfEWxF3AM94T44qw2A1ylfSzXCdPYjGjpjpnMV0CJ_BR3U4zsvZjLMV3EYF_CQMDoquCf2-izRrLmcRVhMQ0KZDW4JMIyI5G0OUg4aOAo7HFcbTRKlalcRsw1vb8/s1600/background.png) repeat scroll 0 0 #f7f7f7;color:#111;font-size:14px;line-height:20px;padding:1px 20px 10px;text-align:center;text-transform:uppercase}
 .sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0}form.sidebar-subscribe-box-form{clear:both;display:block;margin:10px 0 0;width:auto}
 .sidebar-subscribe-box-email-field{-moz-border-radius:4px;-webkit-border-radius:4px;background:#fff url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj7Vz3Vv_sMIUhK5ZhSoYJ9JhNv398ljytq7FvPUEkKBJ9ns4VJvHkfBzlaAqFVRM6-_6ynz1gPqfzL2Ua_-FdLcEAGEag-lBKz8RZsfTkbxXYVWCRzCCukhlnGjdFQ01-R6hTZcdtEqgA/s1600/icons.png) no-repeat 0 -27px;border:1px solid #ccc;border-radius:4px;color:#444;margin:0 0 15px;padding:10px 40px;width:68%}
 .sidebar-subscribe-box-email-button{background:#09f;border:1px solid #007fff;box-shadow:0 1px 0 rgba(255,255,255,0.3) inset, 0 1px 0 transparent;color:#fff;cursor:pointer;font-family:verdana;font-weight:700;padding:10px;text-shadow:1px 1px 0 rgba(0,0,0,.4);text-transform:uppercase;width:100%}
 .sidebar-subscribe-box-email-button:hover,.sidebar-subscribe-box-email-button:focus{background:#1ca4ff}
 .sidebar-subscribe-box-email-button:active{-moz-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;-webkit-box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;box-shadow:0 1px 4px rgba(0,0,0,0.5) inset;outline:0}iframe,object,embed,.yt-border iframe,.yt-border object,.yt-border embed,table{width:100%}embed{border-radius:3px;-moz-box-shadow:0 2px 4px rgba(0,0,0,0.2);-webkit-box-shadow:0 2px 4px rgba(0,0,0,0.2);background:#FFF;border:1px solid #ddd;box-shadow:0 2px 4px rgba(0,0,0,0.2);margin:0;padding:4px 4px 4px}
 #footer-section{border-top:1px solid #aaa;box-shadow:inset 0 4px 6px -3px #aaa;font-family:cambria;font-size:14px;height:100px;margin:10px -30px 5px;padding:0 30px;text-align:center;width:100%}
a.social-icons{margin-right: 5px;height:45px;width:45px;}
a.social-icons:hover { opacity: .7; filter:alpha(opacity=70);}
</style>

<div id="sidebar-subscribe-box">
<div class="sidebar-subscribe-box-wrapper">
    <br/>
<a class="social-icons" href="https://facebook.com/pages/TATIADITA"><img src="http://i1319.photobucket.com/albums/t668/Rozzby24/Mariberbagi244-Facebook_zps68f4035b.png" /></a>
<a class="social-icons" href="https://twitter.com/Rozzby"><img src="http://i1319.photobucket.com/albums/t668/Rozzby24/Mariberbagi244-Twitter_zps433926c5.png" /></a>
<a class="social-icons" href="https://plus.google.com/u/0/110051411851182039252"><img src="http://i1319.photobucket.com/albums/t668/Rozzby24/Mariberbagi244-Googleplus_zps8404ed17.png" /></a>
<a class="social-icons" href="http://feeds.feedburner.com/tatiseo"><img src="http://i1319.photobucket.com/albums/t668/Rozzby24/Mariberbagi244-RSS_zpsc0214ee8.png" /></a>
<p>Subscribe To Our Email Newsletter & Receive Updates Free</p>
<div class="sidebar-subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=Tatiseo" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=tatiseo', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="tatiseo" />
<input name="loc" type="hidden" value="en_US" /><input class="sidebar-subscribe-box-email-field" name="email" autocomplete="off" placeholder="Enter your email address here"/>
<input class="sidebar-subscribe-box-email-button" title="" type="submit" value="Subscribe Now !" /></form>
</div></div></div>
  • Ganti kode yang berwarna Biru dengan URL Facebook/Fanspage sobat.
  • Ganti kode yang berwarna Merah dengan URL Twitter sobat.
  • Ganti kode yang berwarna Orange dengan URL Google Plus sobat.
  • Ganti kode yang berwarna Ungu dengan URL Feedburner sobat.
  • Ganti kode yang berwarna Hijau dengan ID Feedburner sobat.
  • Simpan HTML/Javascript

8komentar:

  1. Pembahasan menarik soal widgetnya. selamat berkarya semangat terus. Salam blogger salam sukses,

    BalasHapus
    Balasan
    1. Duh di puji jadi semangat banget :D
      Makasih dukunganya ^_^

      Hapus
  2. widgetnya simple ya mbak,thx sudah berbagi :)

    BalasHapus