Selasa, 12 November 2013
Browse »
home»
bawah
»
di
»
membuat
»
postingan
»
subscription
»
tips
»
widget
»
Tips Membuat Widget Subscription di Bawah Postingan

Tips Membuat Widget Subscription di Bawah Postingan
Pada postingan sebelumnya saya telah menjelaskan apa fungsi dari sebuah tombol share dan bagaimana memunculkannya di blog anda.
Pada prinsipnya sebuah promosi blog bisa dilakukan dengan berbagai cara, salah satunya adalah melalui media social dan subscription. Kenapa harus di share di social media dan subscription? Ada banyak pejelajah internet yang menemukan situs kita hanya sekedar kebetulan. Dengan memasukan suatu kata kunci akhirnya si penjelajah masuk ke situs kita. Ketika dia menyukai konten situs kita, maka harus ada media yang kita berikan padanaya untuk membagikan informasi tersebut kepada teman-temanya yang juga memiliki minat yang sama selain itu harus juga disediakan sebuah media agar dia bisa subscription/berlangganan dengan situs kita. Dan itulah fungsi sebuah widget subscription.
Karena itulah hari ini saya ingin sedikit berbagi informasi tentang cara membuat sebuah widget subscription di bawah postingan artikel anda.
Beberapa langkah yang harus anda lakukan dalam memasang widget ini yaitu:
- Masuk ke blog anda >> Templete >> Edit HTML
- Temukan (Crl + F) tag <data:post.body/>
- Kemudian taruh script berikut di bawah tag tersebut
<b:if cond=data:blog.pageType == "item">
<style>
.RBstyle{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ3g77wzZRmWwbfNfZbKhFCBfBFuezXALez6cAB0qGIsn_Am7pcBSw1VQ_odk9ebLPMezC8pHepwbO9jTqdUFyHBEjsPSecGxPnVuUXozhCpFTO7UpsEmn7rFdd44DFvBN-cVPg670DqXC/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= blogspot/YbAuT, 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=blogspot/YbAuT rel=nofollow target=_blank title=Suscribe to RSS Feed><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhR8rBziG0NmxbNwgzBvfbkymrd5h7Pm5L-hq4uOHxoAl0MoAOk4JT1m6uEPM48ydKV_Mni_iU-hYr2TdmkzRW8vZuUjpHR6IpTKQs_DvZEYGOdwzF6n8whEsM8F9RcciybYvmyX8UTOY/s1600/rss-30×43.png/></a>
<a href=http://twitter.com/nym_artopraph rel=nofollow target=_blank title=Follow us on Twitter><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK3nHKx3eGsl2W8rEna0YAJC1dHlxZXkYnavTpG-YskyaeD9f-saJDVhGrKvkgJo5as6WViXjbEdCcpCCj72WG4jGWd0ikZZv065Ks6l8sLYqgl2qsqu_xTjKXDqkKkHUV7IGATKeVMco/s1600/twitter-30×43.png/></a>
<a href=http://www.facebook.com/AFewStories rel=nofollow target=_blank title=Follow us on Facebook><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS3T5SXjK9jN0k9TWZqw-fKcFhwyaP6cnHiXMMcC31ztdpFVL8Sg1hVH9JVipwATtT4e0Dd9AsTV-K6UldnAl-MzHCyi8PBC6kmsGi0ko9x4KRLGadjfsumqs8tKDE9gHfl2FC24uxU2o/s1600/facebook-30×43.png/></a>
<a href=https://plus.google.com/101530619421571417577 rel=nofollow target=_blank title=Follow us on Google+><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHDPKiR46Skxub7K5jQ5JAeH_MTGJk1LBgAoVgHZ8J6C6pSItqk3bvavGSDZhM0BMTPBOpFnh_RceAvKU2VpujiN7BJUwPrGmgcHndG8IcHAgoxE5DDuFU2FXy4SZu2BROUEN1IlrGHfM/s1600/googleplus-30×43.png/></a>
</td>
</tr>
</tbody></table>
</div>
</div>
</center>
</b:if>
<style>
.RBstyle{
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgJ3g77wzZRmWwbfNfZbKhFCBfBFuezXALez6cAB0qGIsn_Am7pcBSw1VQ_odk9ebLPMezC8pHepwbO9jTqdUFyHBEjsPSecGxPnVuUXozhCpFTO7UpsEmn7rFdd44DFvBN-cVPg670DqXC/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= blogspot/YbAuT, 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=blogspot/YbAuT rel=nofollow target=_blank title=Suscribe to RSS Feed><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhR8rBziG0NmxbNwgzBvfbkymrd5h7Pm5L-hq4uOHxoAl0MoAOk4JT1m6uEPM48ydKV_Mni_iU-hYr2TdmkzRW8vZuUjpHR6IpTKQs_DvZEYGOdwzF6n8whEsM8F9RcciybYvmyX8UTOY/s1600/rss-30×43.png/></a>
<a href=http://twitter.com/nym_artopraph rel=nofollow target=_blank title=Follow us on Twitter><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiK3nHKx3eGsl2W8rEna0YAJC1dHlxZXkYnavTpG-YskyaeD9f-saJDVhGrKvkgJo5as6WViXjbEdCcpCCj72WG4jGWd0ikZZv065Ks6l8sLYqgl2qsqu_xTjKXDqkKkHUV7IGATKeVMco/s1600/twitter-30×43.png/></a>
<a href=http://www.facebook.com/AFewStories rel=nofollow target=_blank title=Follow us on Facebook><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjS3T5SXjK9jN0k9TWZqw-fKcFhwyaP6cnHiXMMcC31ztdpFVL8Sg1hVH9JVipwATtT4e0Dd9AsTV-K6UldnAl-MzHCyi8PBC6kmsGi0ko9x4KRLGadjfsumqs8tKDE9gHfl2FC24uxU2o/s1600/facebook-30×43.png/></a>
<a href=https://plus.google.com/101530619421571417577 rel=nofollow target=_blank title=Follow us on Google+><img src=https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHDPKiR46Skxub7K5jQ5JAeH_MTGJk1LBgAoVgHZ8J6C6pSItqk3bvavGSDZhM0BMTPBOpFnh_RceAvKU2VpujiN7BJUwPrGmgcHndG8IcHAgoxE5DDuFU2FXy4SZu2BROUEN1IlrGHfM/s1600/googleplus-30×43.png/></a>
</td>
</tr>
</tbody></table>
</div>
</div>
</center>
</b:if>
Klik save kemudian lihat hasilnya! Kurang lebih tampilannya akan seperti ini:

Selamat mencoba, goog luck :)
Note : Ada kemungkinan script tersebut akan eror ketika anda save. Sehingga kalau sampai terjadi eror. Coba check di blogscrowds HTML parser untuk menata ulang script tersebut.
Langganan:
Posting Komentar (Atom)
Tidak ada komentar:
Posting Komentar