Kotak berlangganan yang akan kita buat ini saya ambil dari template Evo Magz,pasti tahu kan template Evo Magz. Walaupun subcription box pada template buatan Mas Sugeng tersebut berada dibawah artikel tapi anda bisa meletakkannya di sidebar lantaran adalah responsive. Bagaimana penampakan subcription boxnya? Dibawah adalah penampakannya ↴

Memasang Subcription Box Seperti Di Evo Magz Blog - Kotak berlangganan yang sering juga disebut subcription box adalah kotak yang berfungsi sebagai media bagi pengunjung blog yang ingin mengetahui dan berlangganan artikel terbaru di blog kita. Dalam kotak berlangganan biasanya juga berisi pesan acuan biar pengunjung mau berlangganan artikel melalui email.

Kotak berlangganan atau subscription box ini bisa kalian letakkan dibawah artikel atau juga disidebar dan footer lantaran adalah memang subsription box ini responsive design serta fungsi aslinya yang terletak dibawah artikel.

Kotak berlangganan yang akan kita buat ini saya ambil dari template Evo Magz,pasti tahu kan template Evo Magz. Walaupun subcription box pada template buatan Mas Sugeng tersebut berada dibawah artikel tapi anda bisa meletakkannya di sidebar lantaran adalah responsive. Bagaimana penampakan subcription boxnya? Dibawah adalah penampakannya ↴

Cara Membuat Kotak Berlangganan Evo Magz

Langkah 1

Silakan buka blogger, Template pilih Edit HTML

Langkah 2

Lalu salin isyarat dibawah ini kemudian letakkan diatas isyarat ]]></b:skin>

/* SUBSCRIBER BOX */ .berlangganan-box {  border-top: 1px solid #f0f0f0;  border-bottom: 1px solid #f0f0f0;  padding: 15px;  margin:0 -15px 15px;  text-align:center; } .berlangganan-box input.email-address[type="text"] {  width:60%;  padding:10px;  border:1px solid #ddd;  text-align:center;  border-radius: 4px;  outline:none; } .berlangganan-box input.submit-email[type="submit"] {  transition:all 0.5s;-moz-transition:all 0.5s;-webkit-transition:all 0.5s;  padding:10px 15px;  background:#07ACEC;  border-radius: 3px;  color:#fff;  border:none;  font-weight:bold;  outline:none; } .berlangganan-box input.submit-email[type="submit"]:hover {  background:#0D9AD0;  cursor:pointer; } .berlangganan-box input.email-address[type="text"]:focus {  background: #f9f2a5; }

Lalu simpan template


Langkah 3
Salin isyarat dibawah ini kemudian letakkan dimana subcription box ingin ditampilkan,bisa di sidebar/footer atau dibawah artikel.

<!-- Box berlangganan --> <div class='berlangganan-box'><form action='https://feedburner.google.com/fb/a/mailverify' method='post' onsubmit='window.open(&apos;https://feedburner.google.com/fb/a/mailverify?uri=anggasave&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>    <p>Silakan berlangganan Untuk Mendapatkan Film Terbaru :</p><p><input class='email-address' name='email' placeholder='Your email address...' type='text'/></p><input name='uri' type='hidden' value='anggasave'/>    <input name='loc' type='hidden' value='en_US'/>    <p><input class='submit-email' type='submit' value='Subscribe'/></p>    </form>   </div>

Ganti isyarat yang berwarna merah dengan url/id feedburner blog anda.

Sekarang coba lihat blog sobat. Apakah kotak berlangganan sudah tampil di blog anda. Cukup sekian tutorial cara menciptakan subcription box. Semoga membantu dan bermanfaat.

Sumber http://www.tips-trick.com