Sering kali gagal untuk membuat widget sosial subscriptions di bawah postingan blog membuat saya berkeinginan untuk berbagi cara untuk membuatnya kepada anda. Oleh karena itu, disini kita akan belajar untuk membuat widget sosial subscription pada blogger blog.
Sebelumnya saya akan memberikan keuntungan yang bisa kamu dapatkan. Memasang widget ini akan membuat pengunjung blog anda bisa dengan mudah untuk mendapatkan update artikel blog anda. Ini artinya jika mereka tertarik dengan apa yang anda tulis, maka mereka akan membuka dan membaca blog anda.
Maka dari itu, membuat widget sosial subscription akan menambah traffic pengunjung blog anda. Selain itu, blog anda akan semakin populer dengan mendapatkan banyak pengunjung.
Selain widget sosial subscription yang ada di bawah postingan blog kamu, kamu juga bisa menambahkan wideget sosial subscription di sidebar blog kamu.
Cara Membuat Widget Sosial Subscription Yang Keren Pada Blogger Blog
Sebenarnya untuk membuat widget ini tidak terlalu sulit, namun pemahaman yang kurang akan membuat anda gagal untuk membuatnya. Maka dari itu, silahkan ikuti langkah-langkah di bawah ini untuk membuat widget sosial subscription pada blog anda.
Live Demo
Langkah 1 : Login blogger >> Dashboard >> TemplateCatatan : Pastikan setiap anda ingin edit HTML blog kamu, kamu backup dulu template yang anda gunakan.
Langkah 2 : Check Expand widget template
Langkah 3 : Temukan kode di bawah ini :
<data:post.body/>
Langkah 4 : Copy dan paste kode di bawah ini tepat di bawah kode <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<style>
.RBstyle{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgSoNDZOS08eEKeyuaJQk_2rd7rWcds1cHgoGiigu7YJJlx8P9DSXWes39DOGu8sD-SzAykPTPtyvRyKfNrvnU5bQV1LrP7VnTYJoM7u-uTYtbAurhltB41cNpK2JM13K2MGJ28lh_0jsPr/s400/email_icon.png) no-repeat scroll 4px center transparent;
padding:7px 15px 7px 35px;
color:#666;
font-weight:bold;
text-decoration:none;
border:1px solid #D3D3D3;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
border-radius: 4px;
-moz-box-shadow: 1px 1px 2px #CCC inset;
-webkit-box-shadow: 1px 1px 2px #CCC inset;
box-shadow: 1px 1px 2px #CCC inset;
}
.RBsubmit{
color:#666;
font-weight:bold;
text-decoration:none;
padding:6px 15px;
border:1px solid #D3D3D3;
cursor: pointer;
-moz-border-radius: 4px;
-webkit-border-radius: 4px;
-goog-ms-border-radius: 4px;
border-radius: 4px;
background: #fbfbfb;
background: -moz-linear-gradient(top, #fbfbfb 0%, #f4f4f4 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fbfbfb), color-stop(100%,#f4f4f4));
background: -webkit-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -o-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
background: -ms-linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#FBFBFB', endColorstr='#F4F4F4',GradientType=0 );
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%);
}
</style>
<center>
<div id='emailwidget-outer'>
<div id='emailwidget'>
<table style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;' width='100%'>
<tbody>
<tr style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'>
<td align='left' style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 15px;'> <p style='color:#008E00; font-size: 15px; margin:0px 0px 5px 0px; '>
Get free daily email updates!</p>
<form action='http://feedburner.google.com/fb/a/mailverify' class='feedburner' method='post' onsubmit='window.open('http://feedburner.google.com/fb/a/mailverify?uri= cofeemix', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true' style='margin: 0pt;' target='popupwindow'>
<input name='uri' type='hidden' value='Realcombiz'/>
<input name='loc' type='hidden' value='en_US'/>
<input class='RBstyle' name='email' onblur='if (this.value == "") {this.value = "Enter your email…";}' onfocus='if (this.value == "Enter your email…") {this.value = ""}' type='text' value='Enter your email…'/>
<input alt='' class='RBsubmit' title='' type='submit' value='Submit'/>
</form>
</td>
<td style='border:none; margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;'><p style='color:#008E00; font-size: 14px; margin:0px 0px 5px 0px; '>
Follow us!</p>
<a href='http://feedburner.google.com/fb/a/mailverify?uri=cofeemix' rel='nofollow' target='_blank' title='Suscribe to RSS Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhDNcrHG2AMsiWD2svbRZbGzxhgGwfrnyj-Xzqe3NNXzSMB_U5z47XAvH8cXWOPRJnpKaYBpp_QQBhYZ3QzGsrG61St9dg4liV8W4G_PO9HCv528qcLkL7oryXx988QnedmB3Rnf60Xtuk/s1600/rss-30×43.png'/></a>
<a href='http://twitter.com/sentotadipati' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgl2vaRh4e-kHU447B79S8qE97Pomy-GtwwozJVoF0s0ZGG_7IZBW40YS9YdEM5UEzd1yFoljhxJnnzM01PD5U-NTDhAdKJBjwomq1TG98DIZadVV1MKpIykiW3McryRNP95VPl0VoKmoU/s1600/twitter-30×43.png'/></a>
<a href='http://www.facebook.com/bloggerkampusperjuangan' rel='nofollow' target='_blank' title='Follow us on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj-rukK_YTVNaBhnf-zgGXgU68BziEgokANhB-8yced9hKMh117LIX6BDkcYU_LCXjKYdXg_070B4AZiquVoFU1Rm34E8XcRPI1aNZ12CzCHYJKcMwhfiCwJctG0LOvzzkJTaGDsRCdIvg/s1600/facebook-30×43.png'/></a>
<a href='https://plus.google.com/108358802743279232329' rel='nofollow' target='_blank' title='Follow us on Google+'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjpgXYQRGoT3zTrypJ9-PoEzI7Uyg2Dp8t3_n-_ha4psBDb0JcRPk5QBfkKMMdLHCtryQfk5yqQcopMNudSKjWeHELDNbIsjdgZMe_P_9spgsGDbJLD0E7LekgJQRi-MdnhVb9UNyvlz9A/s1600/googleplus-30×43.png'/></a>
</td>
</tr>
</tbody></table>
</div>
</div>
</center>
</b:if>
Catatan : Sebelum anda simpan template anda, pastikan kode di atas bekerja dengan baik dengan klik pratinjau. Jika terjadi eror, jangan bingung. Mungkin kode di atas perlu di pharse terlebih dahulu. Klik disini untuk pharse HTML.
Langkah 5 : Simpan Template !
Mudah bukan ? Nah sekarang kita masuk bagaimana cara untuk mengedit widget sosial subscription tersebut agar sesuai dengan profil jejaring sosial anda. Ikuti langkah di bawah :
Ganti user id di bawa yang telah saya beri warna dengan user id anda :
Ganti cofeemix dengan rss feed anda !
Ganti sentotadipati dengan user name twitter anda !
Ganti bloggerkampusperjuangan dengan facebook fans page id anda !
Ganti 108358802743279232329 dengan google+ id anda !
Nah, kalau kamu sudah berhasil untuk membuatnya, jangan lupa tinggalkan komentar di bawah ! Dan juga jangan lupa untuk like facebook fans page kami. Terima kasih anda telah membaca cara membuat sosial subscription widget pada blogger blog.
Jillur Rahman
I'm Jillur Rahman. A full time web designer. I enjoy to make modern template. I love create blogger template and write about web design, blogger. Now I'm working with Themeforest. You can buy our templates from Themeforest.
Website: http://masala-jr.blogspot.com/
No Comment to " Membuat Subscription Widget Blog Keren Di Bawah Postingan Blog "