Minggu, 22 Februari 2015

Cara Memasang Box Berlangganan Artikel di Blog


Adakalanya sobat blogger yang membaca artikel blog kita membutuhkan update dari kita, tentunya jika ia tidak bisa membuka blog kita secara langsung ia membutuhkan cara lain supaya bisa menikmati artikel blog kita tanpa melihat blog kita secara langsung. Bagaimana caranya? Yup, Berlangganan lewat email! Dengan memasang box berlangganan artikel lewat email, para pembaca akan mudah untuk menikmati artikel blog kita saat sedang sibuk tidak bisa membuka internet ^_^

Caranya sebagai berikut

1. Login ke akun blogger sobat, lalu pergi ke Tata Letak

2. Sesudah itu pilih HTML/Java Script

3. Copy script berikut ini kedalamnya 

<style>
#sidebar-subscribe-box{width:300px;border:1px solid #aaa;border-radius:3px;padding:3px 0}
 .sidebar-subscribe-box-wrapper{background:url(http://2.bp.blogspot.com/-Y3hbgki8hXE/UXZE9IlUi4I/AAAAAAAAAgI/gIGB-L-HKHo/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(http://3.bp.blogspot.com/-DfHJzP9Mlh4/UXZE9ONhVnI/AAAAAAAAAgM/5xtMqb9biR4/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/>

<p>Daftarkan Email Sobat Untuk Berlangganan Artikel Blog Ini!</p>
<div class="sidebar-subscribe-box-form"><form action="http://feedburner.google.com/fb/a/mailverify?uri=blogspot/MPGFW" class="sidebar-subscribe-box-form" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=blogspot/MPGFW', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow"><input name="uri" type="hidden" value="blogspot/MPGFW" />
<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="Berlangganan Sekarang !" /></form>
</div></div></div>
*Ket = Tulisan yang berwarna biru bisa sobat ubah sesuai kehendak :)

4. Setelah itu klik simpan, dan lihat hasilnya :D

Semoga bermanfaat ^_^
Share:

2 komentar:

  1. keren gan, ijin menggunakan script nya gan :)

    BalasHapus
    Balasan
    1. monggo gan, jika ada kesalahan hubungi ane yak ;)

      Hapus

Komentar disini mah gak banyak aturannya, setelah baca kasih komentar ya. Supaya gue lebih semangat lagi buat nulis! Hehe

-Muhammad Afif