Cara Membuat Kotak Berlangganan Artikel Di Bawah Postingan WordPress

Cara Membuat Kotak Berlangganan Artikel – Untuk memanjakan pengunjung blog salah satunya adalah dengan membuat form berlangganan artikel. Dengan kata lain untuk memudahkan pembaca setia blog jika ingin mengikuti setiap postingan terbaru yang kita terbitkan. Pengunjung tidak perlu bolak-balik ke blog kita kalau hanya sekedar untuk memeriksa artikel terbaru. Mereka cukup mengecek alamat email yang telah didaftarkan sebelumnya.

Baca Juga : Cara Menonaktifkan Emoji Di WordPress Dengan Mudah

Untuk membuat kotak khusus form berlangganan artikel bagi pengguna WordPress self hosted tidak perlu menggunakan plugin. Cukup bermain dengan kode HTML saja dan agar tampilannya lebih menarik, kemudian dipoles sedikit dengan menambahkan kode CSS. Lebih jelasnya lagi, Anda bisa lihat contoh tampilan berikut ini :

Kenapa saya pasang kotak berlangganan artikel tersebut di bawah artikel? Karena menurut saya tempat tersebut adalah yang paling strategis. Begitu pengunjung blog selesai membaca artikel yang kita terbitkan, maka mereka akan melihat jelas form berlangganan artikel di bawahnya. Dengan begitu pembaca blog tidak akan kesulitan untuk menemukan kotak berlangganan artikel.

Kotak berlangganan artikel yang akan saya bahas adalah kotak berlangganan yang akan di redirect ke FeedBurner. Maka dari itu sebaiknya Anda melakukan pendaftaran terlebih dahulu di FeedBurner untuk mendapat akunnya.

Ok jika Anda sudah mempunyai akun FeedBurner mari kita lanjutkan lagi pembahasannya. Sebetulnya kita juga bisa langsung memasangkan kode yang kita dapatkan di FeedBurner. Namun saya rasa kotak berlangganan artikel default FeedBurner tampilannya kurang menarik.

Inilah Cara Membuat Kotak Berlangganan Artikel di Bawah Postingan Blog

Selain bisa kita pasang di bawah postingan blog, kotak berlangganan artikel FeedBurner bisa kita pasang juga di sidebar/widget. Disini saya tidak akan membahas bagaimana cara memasang form berlangganan di sidebar, namun yang akan saya bahas disini adalah yang dipasang di bawah postingan/artikel.

Silakan Anda aktifkan dashboard WordPress Anda dengan cara login seperti biasanya. Kemudian Anda sisipkan kode berikut di dalam file single.php template yang Anda gunakan.

<div id="subscribe-box">
 <h4>Berlangganan Artikel Via Email</h4>
 <p>Suka dengan artikel diatas? Jangan lewatkan postingan-postingan menarik lainnya dengan berlangganan artikel yang akan dikirim otomatis ke alamat Email Anda.</p>
<div class="emailfield">
 <form action="http://feedburner.google.com/fb/a/mailverify" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=infomenarikuptodate', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
 <input type="email" name="email" placeholder="Ketik Alamat Email Anda !" required="required">
 <input type="hidden" value="infomenarikuptodate" name="uri">
 <input type="hidden" name="loc" value="en_US">
 <input class="submitbutton" type="submit" value="Lanjutkan">
 </form>
 </div>
 </div>

Adapun penempatannya tergantung selera Anda. Jika saya memasangnya tepat di bawah Author Box. Jika Anda juga ingin menempatkan kotak berlangganan artikel di bawah author box, silakan sisipkan kode diatas dibawah/diakhir kode Author Box atau script <!-- End Author Box --> yang ada di dalam file single.php.

Anda juga harus mengganti infomenarikuptodate yang terdapat didalam kode diatas dengan akun FeedBurner Anda. Dan silakan Anda sesuaikan lagi kalimat-kalimatnya dengan yang Anda inginkan!

Agar tampilan kotak berlangganan artikel Anda lebih menarik dan enak dilihatnya, maka sebaiknya Anda memodifikasinya lagi dengan menyisipkan kode CSS. Sebagai contoh saya menggunakan kode CSS seperti ini :

/*-[ Artikel Berlangganan ]---------------------------*/
#subscribe-box {
 background-color: #666;
 margin: 0 0 30px;
 padding: 25px;
 overflow: hidden;
}
#subscribe-box h4 {
 color: #fff;
 font-size: 18px;
 margin-bottom: 20px;
 text-transform: uppercase;
}
#subscribe-box p {
 color: #fff;
 margin: 0 0 24px;
 padding: 0;
}
#subscribe-box .emailfield {
 margin: auto;
}
#subscribe-box .emailfield input {
 font-size: 16px;
 color: #bcc4ca;
 border: none;
 margin-bottom: 16px;
}
#subscribe-box .emailfield .submitbutton {
 background-color: #b11c42;
 cursor: pointer;
 color: #fff;
 margin: 0;
 width: 100%;
 font-family: 'FjallaOne-Regular';
 font-size: 18px;
 text-transform: uppercase;
 box-shadow: 0 1px rgba(0,0,0,0.1);
}
#subscribe-box .emailfield .submitbutton:hover {
 background-color: #FFF;
 color: #000;
}

Tempatkan kode CSS diatas di dalam file style.css template yang Anda gunakan. Jika settingannya tidak sesuai dengan selera atau warna template Anda, silakan Anda sesuaikan lagi.

Ok mungkin hanya itu saja pembahasan tentang bagaimana cara membuat kotak berlangganan artikel menarik di bawah postingan WordPress. Oh iya, kode HTML diatas bisa juga Anda pasangkan di Blogspot. Semoga bermanfaat.