Cara Membuat Widget Berlangganan/Subscribe Box Keren Di Blog - Nandea96
Artikel Terbaru
Loading...

Monday, 8 July 2019

Cara Membuat Widget Berlangganan/Subscribe Box Keren Di Blog




Hy semua. ketemu lagi nih dengan Dea. nah kali ini Dea  akan memberikan sebuah tutorial bagus dan keren. tutorial tersebut ialah Cara Membuat Widget Berlangganan/Subscribe Keren Di Blog. sebelumnya apa kalian sudah mengetahui widget berlangganan di blog?. mungkin dari kalian ada yang sudah tau dan ada yang belum tau. nah bagi yang belum tau. widget ini sangat bagus dipasang. kenapa? yup. sama layaknya tombol "Subscribe" pada youtube. widget ini mampu menggaet seseorang yang ingin melihat artikel - artikel terbaru setiap hari di blog tersebut..jika ia menyukai artikel kalian. maka ia akan berlangganan dan akan menunggu artikel menarik dari kalian setiap hari/minggu/bulanan. nah bagaimanakah caranya? Ikuti langkah - langkah  dibawah ini.

Step By Step :

  • Buka blog kalian disini
  • Cari "Tata Letak"
  • Jika sudah. tambahkan "Add Widget/Add gadget/tambahkan Gadget" pada Footer..
  • Lalu akan muncul kotak tabel. disini pilih HTML/Javascript
  • Kemudian disini ada dua kolom. besar dan kecil. yaitu "Judul" dan "Konten"..copy dan pastekan code dibawah ini tepat pada "Konten" tersebut. judul dibiarkan kosong..
<style>
#subscribebox{background:#1b291e;padding:20px;font-family:&#39;PT Sans&#39;,sans-serif;}
.widget_follow_subscribe .widget-detail{padding:36px 30px 40px}
#subscribebox p{color:#fff;font-size:15px;text-align:center;font-weight:700}
.follow-subscribe-social{margin:0 0 15px;padding:0 0 14px;border-bottom:#858585 solid 1px}
.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:#cacaca;-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:#2ecc7e}
form.subscribe{margin-top:-7px}
form.subscribe input{display:block;width:100%}
.subscribe-email{height:45px;border:none;margin:0 0 10px;font-size:.928571em;background-color:rgba(255,255,255,0.2);text-align:center;color:#fff}
.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:none;background-color:#1b291e;-webkit-transition:background-color .2s ease-in-out;-moz-transition:background-color .2s ease-in-out;-ms-transition:background-color .2s ease-in-out;-o-transition:background-color .2s ease-in-out;transition:background-color .2s ease-in-out}
.subscribe-button:hover{background-color:#48cb51}
.subscribe-button:focus{outline:0}
.creadit a{color: #A7A6A6; float: right; font-size: 8px;} 
}
</style>
<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css' rel='stylesheet'/>
<div id="subscribebox">
<div class="follow-subscribe-social">
<ul>
<li><a href="https://www.facebook.com" target="_blank"><i class="fa fa-facebook"></i></a></li>
<li><a href="https://twitter.com" target="_blank"><i class="fa fa-twitter"></i></a></li>
<li><a href="https://www.googleplus.com" target="_blank"><i class="fa fa-google-plus"></i></a></li>
<li><a href="https://www.pinterest.com" target="_blank"><i class="fa fa-pinterest"></i></a></li>
<li><a href="https://www.instagram.com" target="_blank"><i class="fa fa-instagram"></i></a></li>
</ul>
</div>
<p>Follow My NewsLetter</p>
<form class="subscribe" action='http://feedburner.google.com/fb/a/mailverify?uri=Gxgame' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=Gxgame, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='Gxgame'/>
<input name='loc' type='hidden' value='en_US'/>
<input class="subscribe-email" type='text' name='email' onblur='if (this.value == &quot;&quot;) {this.value = &quot;Your Email&quot;;}' onfocus='if (this.value == &quot;Your Email&quot;) {this.value = &quot;&quot;;}' value='Tuliskan Email Kamu Disini......'/>
<input class="subscribe-button" type="submit" value="Subscribe" />
</form>
</div>
Ganti tulisan merah tersebut dengan url akun social media kalian. dan ganti tulisan biru tersebut dengan username feedburner kalian. apa kalian pernah mendapatkan url yang diberikan oleh feedburner sebelum mendaftar?. jika pernah maka copy lalu pastekan usernamenya saja. jika belum maka kalian harus mendaftar dari awal. dan jika lupa. kalian dapat melihat di feedburner...



Share with your friends

Give us your opinion

Selamat Datang Di Website Nandea96
Mohon untuk selalu mencuci tangan dengan air bersih serta sabun setiap 15 menit sekali agar terhindar dari covid-19 dan penyakit lainnya seperti diare. selalu gunakan masker ketika berpergian kemanapun 😷. meskipun itu hanya berbelanja sekitar 0.1 km atau ke tetangga. hindari kontak fisik dan beri jarak sekitar 2 meter dari jarak tempat kita berdiri dengan seseorang agar tidak memunculkan klaster baru yang tidak di-inginkan.

-Terimakasih 🙏-
Done