Cara Memasang Email Subscribe Dibawah Postingan - Memiliki banyak pengunjung yang telah menjadi pelanggan blog bisa memberikan keuntungan tersendiri bagi blog Anda. Setiap Anda memposting artikel baru, maka para pelanggan blog Anda akan segera mengetahuinya dan selanjutnya akan mengunjungi blog Anda untuk membaca artikel baru dari blog Anda sehingga blog Anda tidak akan sepi pengunjung. Agar pengunjung bisa menjadi pelanggan blog Anda, maka caranya adalah dengan memasang widget email subscribe di blog Anda.
Banyak model widget email subscription yang bisa Anda pasang di blog Anda. Jika Anda ingin memasang email subscribe dibawah postingan, ikuti langkah-langkah berikut ini :
1. Login ke blog Anda
2. Pada menu navigasi, klik "Tema" > klik "Edit HTML".
3. Pada jendela tema, cari dan temukan kode ]]></b:skin>
4. Copy script dibawah ini, kemudian pastekan tepat diatas kode ]]></b:skin>
/* Email Subscribe Box */
#subscribebox{border:1px solid #e5e5e5;padding:20px;margin:20px 0;font-family:'PT Sans',sans-serif;}
.widget_follow_subscribe .widget-detail{padding:36px 30px 40px}
#subscribebox p{color:#394347;font-size:25px;text-align:center;font-weight:700;margin:0 0 1em 0;}
.follow-subscribe-social{margin:0;padding:0;}
.follow-subscribe-social ul{list-style:none;margin:0;padding:0;text-align:center}
.follow-subscribe-social ul li{display:inline;margin:0 15px 0 0;border-bottom:none}
.follow-subscribe-social ul li:last-child{margin:0}
.follow-subscribe-social ul li a{font-size:17px;color:#394347;-webkit-transition:color .2s ease-in-out;-moz-transition:color .2s ease-in-out;-ms-transition:color .2s ease-in-out;-o-transition:color .2s ease-in-out;transition:color .2s ease-in-out}
.follow-subscribe-social ul li a:hover{color:#1C97DE}
form.subscribe{margin-top:-7px}
form.subscribe input{display:block;width:100%}
.subscribe-email{height:45px;border:none;margin:0 0 10px;font-size:1em;background-color:#DEDEDE;text-align:center;color:#394347;border-radius:5px;}
.subscribe-email:focus{outline:0}
form.subscribe .placeholder{color:#cacaca}
form.subscribe input:-ms-input-placeholder{color:#cacaca}
form.subscribe input::-webkit-input-placeholder{color:#cacaca}
form.subscribe input:-moz-placeholder{color:#fafafa}
form.subscribe input::-moz-placeholder{color:#fafafa}
.subscribe-button{height:45px;font-weight:700;font-size:16px;color:#fff;text-transform:uppercase;border-radius:5px;background-color:#576269;border:none;}
.subscribe-button:hover{background-color:#398DCC;}
.subscribe-button:focus{outline:0}
Selanjutnya masih dijendela tema, lakukan langkah berikut ini :
1. Cari dan temukan kode <data:post.body/>, biasanya kode ini ada 3 - 4.
2. Copy script dibawah ini dan pastekan dibawah kode <data:post.body/> yang ke 3 atau ke 4.
<b:if cond='data:blog.pageType == "item"'>
<div id="subscribebox">
<p>Subscribe to Our Newsletter</p>
<form class="subscribe" action='http://feedburner.google.com/fb/a/mailverify?uri=USER-ID' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri=USER-ID, 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' target='popupwindow'>
<input name='uri' type='hidden' value='USER-ID'/>
<input name='loc' type='hidden' value='en_US'/>
<input class="subscribe-email" type='text' name='email' onblur='if (this.value == "") {this.value = "Your Email";}' onfocus='if (this.value == "Your Email") {this.value = "";}' value='Your Email'/>
<input class="subscribe-button" type="submit" value="Subscribe" />
</form>
<div class="follow-subscribe-social">
<ul>
<li><a href="#" target="_blank"><i class="fa fa-facebook"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-twitter"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-linkedin"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-google"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-pinterest-p"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-instagram"></i></a></li>
</ul>
</div>
</div>
</b:if>
- Ganti tulisan USE-ID dengan Id Feedburner Anda.
- Ganti tanda # sesuai dengan alamat media sosial Anda.
3. Simpan tema, dan lihat hasilnya.
Selain menempatkan script di bawah kode <data:post.body/>, Anda juga bisa menempatkannya sebelum atau diatas kode <!-- clear for photos floats -->. Terdapat 2 kode, gunakan kode ke 2.
Baca juga artikel :
Demikian Cara Memasang Email Subscribe Dibawah Postingan yang bisa Anda lakukan. Dengan adanya email subscribe, maka pengunjung dapat segera mengetahui postingan terbaru artikel blog Anda dan blog Anda akan memiliki pengunjung setia. Semoga bermanfaat.
