√ Cara Menciptakan Widget Subscribe Di Blog Dengan Tampilan Keren

Sebagai seorang blogger kita harus selalu memperlihatkan pelayanan yang terbaik kepada seluruh pengunjung blog kita, salah satu bentu pelayanan tersebut yakni menyediakan fitur buat para pengunjung blog yang ingin berlangganan artikel dari blog kita. Jika kau belum tahu bagaimana cara Membuat Widget Subscribe di Blog dengan tampilan yang keren. silahkan ikuti panduan dibawah ini.

Dengan adanya fitur Box subcribe di blog, setiap pengunjung yang berlangganan artikel akan secara otomatis mendapat notifikasi melalui email kalau kita mengupdate/memposting artikel gres di blog kita. dengan cara relasi kau dengan pengunjung akan jauh lebih baik.

Dengan membuat Membuat Widget Subscribe di Blog, secara tidak pribadi kau telah melaksanakan seo optimization, soalnya google sangat suka dengan blog yang selalu memperlihatkan pelayan terbaik kepada seluruh visitor.

Kamu dapat meletakan Subcribe Box ini pada bab atas sidebar ataupun pada bab footer blog. sepakat mari pribadi saja kita mulai Cara Membuat Widget Subscribe di Blogspot Yang Keren.

Baca Juga:

Cara Mengubah Judul Posting Blog Menjadi H1 semoga Lebih SEO Friendly

3 Website Untuk Cek Plagiarisme Konten Blog, No 3 Terbaik Didunia!

Cara Membuat TOC (Table of Content) Sederhana di Blogger

Cara Membuat Widget Subscribe di Blog

Langkah 1: Silahkan masuk kedasboard blogger kamu » kemudian pilih tab tema » kemudian klik Edit HTML. Silahkan kau cari kode </head>, Jika kau kesulitan untuk menemukan arahan tersebut. Gunakan kombinasi tombol CTRL+F untuk mempermudah pencarian kode </head>.

Jika kode </head> sudah kau temukan, masukan arahan dibawah ini sempurna diatas kode </head> 

<link href='https://maxcdn.bootstrapcdn.com/font-awesome/4.4.0/css/font-awesome.min.css' rel='stylesheet' type='text/css'/>
<link href='//fonts.googleapis.com/css?family=PT+Sans:400,700' rel='stylesheet' type='text/css'/>

Langkah 2: Lalu cari kode ]]></b:skin> atau </style> dan letakan CSS dibawah ini sempurna diatas arahan tersebut.

#subscribebox{background:#576269;padding:20px;font-family:'PT Sans',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:#fff}
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:#F35D5C;-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:#f1d640}
.subscribe-button:focus{outline:0}
.creadit a{color: #A7A6A6; float: right; font-size: 8px;}

Jika sudah klik Save Template.

Sekarang kau hanya perlu memasang arahan HTML dibawah ini pada bab widget tata letak blog, adapun caranya sebagai berikut.

Langkah 3: Masih didalam dasboard blogger, pilih hidangan Tata Letak » Tambahkan Gadget » HTML / Javascript kemudian masukan arahan HTML dibawah ini.

<div id="subscribebox">
<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-dribbble"></i></a></li>
<li><a href="#" target="_blank"><i class="fa fa-instagram"></i></a></li>
</ul>
</div>
<p>Subscribe to my Newsletter</p>
<form class="subscribe" action='http://feedburner.google.com/fb/a/mailverify?uri=YOUR-USER-NAME' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=YOUR-USER-NAME, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' target='popupwindow'>
<input name='uri' type='hidden' value='YOUR-USER-NAME'/>
<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>

Note: Silahkan ganti YOUR USER NAME yang ada dibaris 14 dengan Username Feedburner blog kamu.

Sekian isu dari lapak usang “Cara Membuat Widget Subscribe di Blog” Jika kau suka dengan panduan ngeblog lapaklama.com, silahkan berlangganan artikel terbaru kami secara gratis via email. dan sekedar informasi, kalau kau ingin bergabung didalam lembaga komunitas blogger indonesia, silahkan daftarkan diri kau melalui halaman pendaftaran. terimakasih.

Sumber aciknadzirah.blogspot.com