Cara Memasang Kotak Berlangganan dan Media Sosial

Memasang Kotak Berlangganan dan Media Sosial di Sidebar Blog

Sobat Portal Blog- Manfaat memasang sosial media dan kotak berlangganan merupakan hal penting untuk meningkatkan pengunjung diblog kita. Pengunjung akan dengan mudah mengikuti update blog juga membagikan kepada publik melalui sosial media dengan sangat mudah, karena kita telah tempatkan semuanya di sidebar blog kita.

Berikut ini tampilan kotak berlangganan dan media sosial share yang simple dan bagus.

Nah Sobat PortalBlog sebelum anda memasukan kode HTML dibawah ini, pastikan semua akun media sosial anda sudah lengkap. 

Berikut tahapan memasang kotak berlangganan dan mesia sosial di sidebar blog :

1. Klik Layout (Tata Letak) kemudian Add A Gadget
2. Untuk Judul Widget silahklan dikosongkan saja atau bila ingin di isi juga gak masalah
3. Selanjutnya copypaste kode dibawah ini ke dalam kontent.

<style>
.tbisubscribe {
border: 1px solid #D3D3D3;
padding: 8px;
width: 300px;
-webkit-transition: all 0.5s ease-in-out;
-moz-transition: all 0.5s ease-in-out;
-ms-transition: all 0.5s ease-in-out;
-o-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
</style>
<link href="http://fonts.googleapis.com/css?family=Oswald" rel="stylesheet" type="text/css">
<div class="tbisubscribe">
<div style="color: #666666; font-weight: bold; font: 22px Oswald, cursive; margin: 0px 0px 10px 15px;">
Get Free Updates in your Inbox</div>
<div style="color: #666666; font-weight: bold; font: 11px Oswald, cursive; margin: 0px 0px 10px 15px;">
Receive Quality Posts Straight in your Inbox   by submitting your Email ID below</div>
<div style="margin: 10px 0 0 6px;">
<!--Subscription Box-->
<br>
<form action="http://feedburner.google.com/fb/a/mailverify" class="emailform" method="post" onsubmit="window.open('http://feedburner.google.com/fb/a/mailverify?uri=portalblog', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" style="margin: 0pt;" target="popupwindow">
<input name="uri" type="hidden" value="portalblog">
<input name="loc" type="hidden" value="en_US">
<input class="tbimailbox" name="email" onblur="if (this.value == &quot;&quot;) {this.value = &quot;Enter your email...&quot;;}" onfocus="if (this.value == &quot;Enter your email...&quot;) {this.value = &quot;&quot;}" type="text" value="Enter your email...">
<input alt="" class="tbisubmit" title="" type="submit" value="Subscribe">
</form>
</div>
<div style="border: none; color: #666666; font: 22px Oswald, cursive; margin: 25px 0 0 5px;">
Follow us on:</div>
<div style="margin: -32px 0 0 120px;">

<!--Facebook URL-->
<a href="http://www.facebook.com/cbblogger" target="_blank" title="Join us on Facebook"><img alt="facebook" src="http://3.bp.blogspot.com/-ChHaXU5VfIE/UJkIg5tptTI/AAAAAAAABEg/kzXjQ2QxEPo/s1600/facebook.png"></a>

<!--Twitter URL-->

<a href="http://www.twitter.com/username" rel="nofollow" target="_blank" title="Follow us on Twitter"><img alt="twitter" src="http://3.bp.blogspot.com/-aG-POFOiBHc/UJkIkayVTGI/AAAAAAAABE4/hhun4Hjaudw/s1600/twitter.png"></a>

<!--Google+ URL-->

<a href="https://plus.google.com/117777485377884008783" rel="author" target="_blank" title="Follow us on Google+"><img alt="gplus" src="http://2.bp.blogspot.com/-gxpckVUYzWI/UJkIh5kHQ5I/AAAAAAAABEo/IlR9Bt-FVBE/s1600/googleplus.png"></a>

<!--LinkedIn URL-->
<a href="http://www.linkedin.com/in/cbblogger" rel="nofollow" target="_blank" title="Follow us on LinkedIn"><img alt="linkedin" src="http://1.bp.blogspot.com/-c7m7fLXHewI/UJPaWsVTZ6I/AAAAAAAAA-M/uvdMMglb8fE/s1600/linkedin-circle-2.png"></a>

<!--RSS URL-->
<a href="http://feeds.feedburner.com/contohblognih" rel="nofollow" target="_blank" title="Subscribe to RSS"><img alt="rss" src="http://4.bp.blogspot.com/-aN0dAN4mIno/UJkIje-dmSI/AAAAAAAABEw/gyK0zwpvjdE/s1600/rss.png"></a>
</div>
</div>
<!-- End -->

K

4. Ganti tulisan berwarna merah dengan ID sosial media yang anda miliki.
Kemudian Save.

Mudah bukan..?? selamat mencoba.

*Referensi : http://www.contohblog.com

Advertisement