Tentu sebelu memasangnya, Anda harus sudah punya akun Facebook, Twitter, Feedburner, dan Pinterest. Bisa diganti kok, asal bisa saja gantinya :)
CARA PASANG
1. Layout > klik "Add a Gadget" di Sidebar > pilih HTML/Javasscript
2. Copy & Paste kode berikut ini di kolom "Content". Judul kosongkan!
<!-- SOCIAL PROFILE END -->
<style>
.btrixsocial_box-email{ background:Fff no-repeat 0px 12px ; width:100%;float:left;font-size:1.4em;font-weight:bold;margin:2px 2px 0px 1px;color:#686B6C;}
.btrixsocial_box-emailsubmit{ background:#0084CE;cursor:pointer; color:#fff; border:none;padding:6px;margin:0 0 0px 0;text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25); -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; font:12px sans-serif;}
.btrixsocial_box-emailsubmit:hover{ background:#E98313; }
.textarea{ padding:2px; margin:0px 2px 0px 2px; background:#f9f9f9; border:1px solid #ccc; resize:none; box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); -moz-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); -webkit-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); font-size:13px; width:200px; height:20px;color:#666;}
#socialboxbt {text-align: center;font-weight: bold;padding: 5px 10px 10px 5px;border: 1px solid #ddd;width: 280px;margin-top: -5px;margin-bottom: 15px;background: #FAFAFC;}
</style>
<br />
<div id="socialboxbt">
<a href="http://feeds.feedburner.com/romelteamedia" imageanchor="1" rel="nofollow" style="float: center" target="blank"><img border="0" alt='RSS Feed' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0ZkgBSF5uSAi5A7av1ecJ70kGTAEU0VFeKbsbYRZwUdMfqsBITgt9_tDzn8hH3Im7C_kJAXknICSVhMXtaNv3zVgKupjGeZew_UfAq73w7eg0S8az6MxG1ymIv8IiwL6MziPXmWKKSDen/s1600/rss.png" /></a>
<div class="btrixsocial_box-email" style="margin-top: -15px;margin-bottom: -15px">
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=romelteamedia', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="textarea" gtbfieldid="3" name="email" onblur="if undefinedthis.value == "") {this.value = "Enter email address here";}" onfocus="if undefinedthis.value == "Enter email address here") {this.value = "";}" type="text" value="Enter email address here..." />
<input name="uri" type="hidden" value="romelteamedia" /><input name="loc" type="hidden" value="en_US" />
<input class="btrixsocial_box-emailsubmit" type="submit" value="Submit" />
</form>
</div>
<style class="text/css">
table
{border-bottom: 0px solid #E6E6E6;float: center;width: 300px;margin:-8px 0 0 0px;}
.subicons
{border-right: 0px solid #E6E6E6;}
.Fadeout {filter:alphaundefinedopacity=100);opacity: 1.0;border:0;
}
.Fadeout:hover{filter:alphaundefinedopacity=80);opacity: 0.8;border:0;
}
</style>
<br /><div class="table"><table>
<tbody><tr>
<td><div class="subicons">
<a class="Fadeout" href="http://www.facebook.com/romelteamedia" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivJSE2M1QXew99eHdfNreil9KYv80kyyyUVAvuFuZiFsiOdyR0W37TqZrQlZt66MveVW-wvWgHfxo2sApFicBdKf53C7AJ21RGyXSL9WoLAP5qbDsRNS0iMkSUnA4rZbhSojMYpDFuDkE/s1600/btrix-facebook-icon.png" alt="facebook"/></a></div>
</td><td><div class="subicons">
<a class="Fadeout" href="http://twitter.com/romeltea" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS41rS-lezBCiGRZ4YMxougEdNDELRQiHvoGiER31v-g0hXfEOVkpO2ZctqHDRmNyT4O5F4V9u3QyPYip_82O_9dUMlfuEs2DgYEWVTh1sbYomfnAhwiLu1Q8DvllyMex3IwmYpy8Ui1Y/s1600/btrix-twitter-icon.png" alt="twitter" /></a></div>
</td>
<td><div class="subicons">
<a class="Fadeout" href="http://feeds.feedburner.com/romelteamedia" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGC5gR71PAO0-EY4AWzmLtAjv6lYUVmnvsLMN_RMJEIGXmte7co_OL4QpYZgJyiAMXgjSQ_H-rW3jACG130tTNj6nFh6upSxERjGL7d2Sawev9JOHrRTpMBFWxqI6zmEmjku_J6pyXpYA/s1600/btrix-rss-icon.png" alt="RSS" /></a></div>
</td>
<td><a class="Fadeout" href="https://pinterest.com/romeltea" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinCCUf6wiJGm57w7rfI65ehtZJb-SIX5MFgIvAvEtg7bGqZ5Wwp06UvfDm2EtzFXVY0ZiUBpvPuhZVYaT6v7G5ExPaUM2q3zL8lPAVNSTjQnnjoC3BnsSS2z_zMaxvQSD4A-AE4aSNMmQ/s1600/btrix-Pinterest-icon.png" alt="pinterest" /></a></td>
</tr></tbody></table></div></div>
<!-- SOCIAL PROFILE END -->
<style>
.btrixsocial_box-email{ background:Fff no-repeat 0px 12px ; width:100%;float:left;font-size:1.4em;font-weight:bold;margin:2px 2px 0px 1px;color:#686B6C;}
.btrixsocial_box-emailsubmit{ background:#0084CE;cursor:pointer; color:#fff; border:none;padding:6px;margin:0 0 0px 0;text-shadow:0 -1px 1px rgbaundefined0,0,0,0.25); -moz-border-radius:2px; -webkit-border-radius:2px; border-radius:2px; font:12px sans-serif;}
.btrixsocial_box-emailsubmit:hover{ background:#E98313; }
.textarea{ padding:2px; margin:0px 2px 0px 2px; background:#f9f9f9; border:1px solid #ccc; resize:none; box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); -moz-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); -webkit-box-shadow:inset 1px 1px 1px rgbaundefined0,0,0,0.1); font-size:13px; width:200px; height:20px;color:#666;}
#socialboxbt {text-align: center;font-weight: bold;padding: 5px 10px 10px 5px;border: 1px solid #ddd;width: 280px;margin-top: -5px;margin-bottom: 15px;background: #FAFAFC;}
</style>
<br />
<div id="socialboxbt">
<a href="http://feeds.feedburner.com/romelteamedia" imageanchor="1" rel="nofollow" style="float: center" target="blank"><img border="0" alt='RSS Feed' src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh0ZkgBSF5uSAi5A7av1ecJ70kGTAEU0VFeKbsbYRZwUdMfqsBITgt9_tDzn8hH3Im7C_kJAXknICSVhMXtaNv3zVgKupjGeZew_UfAq73w7eg0S8az6MxG1ymIv8IiwL6MziPXmWKKSDen/s1600/rss.png" /></a>
<div class="btrixsocial_box-email" style="margin-top: -15px;margin-bottom: -15px">
<form action="http://feedburner.google.com/fb/a/mailverify" id="feedform" method="post" onsubmit="window.openundefined'http://feedburner.google.com/fb/a/mailverify?uri=romelteamedia', 'popupwindow', 'scrollbars=yes,width=550,height=520');return true" target="popupwindow">
<input class="textarea" gtbfieldid="3" name="email" onblur="if undefinedthis.value == "") {this.value = "Enter email address here";}" onfocus="if undefinedthis.value == "Enter email address here") {this.value = "";}" type="text" value="Enter email address here..." />
<input name="uri" type="hidden" value="romelteamedia" /><input name="loc" type="hidden" value="en_US" />
<input class="btrixsocial_box-emailsubmit" type="submit" value="Submit" />
</form>
</div>
<style class="text/css">
table
{border-bottom: 0px solid #E6E6E6;float: center;width: 300px;margin:-8px 0 0 0px;}
.subicons
{border-right: 0px solid #E6E6E6;}
.Fadeout {filter:alphaundefinedopacity=100);opacity: 1.0;border:0;
}
.Fadeout:hover{filter:alphaundefinedopacity=80);opacity: 0.8;border:0;
}
</style>
<br /><div class="table"><table>
<tbody><tr>
<td><div class="subicons">
<a class="Fadeout" href="http://www.facebook.com/romelteamedia" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEivJSE2M1QXew99eHdfNreil9KYv80kyyyUVAvuFuZiFsiOdyR0W37TqZrQlZt66MveVW-wvWgHfxo2sApFicBdKf53C7AJ21RGyXSL9WoLAP5qbDsRNS0iMkSUnA4rZbhSojMYpDFuDkE/s1600/btrix-facebook-icon.png" alt="facebook"/></a></div>
</td><td><div class="subicons">
<a class="Fadeout" href="http://twitter.com/romeltea" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhS41rS-lezBCiGRZ4YMxougEdNDELRQiHvoGiER31v-g0hXfEOVkpO2ZctqHDRmNyT4O5F4V9u3QyPYip_82O_9dUMlfuEs2DgYEWVTh1sbYomfnAhwiLu1Q8DvllyMex3IwmYpy8Ui1Y/s1600/btrix-twitter-icon.png" alt="twitter" /></a></div>
</td>
<td><div class="subicons">
<a class="Fadeout" href="http://feeds.feedburner.com/romelteamedia" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGC5gR71PAO0-EY4AWzmLtAjv6lYUVmnvsLMN_RMJEIGXmte7co_OL4QpYZgJyiAMXgjSQ_H-rW3jACG130tTNj6nFh6upSxERjGL7d2Sawev9JOHrRTpMBFWxqI6zmEmjku_J6pyXpYA/s1600/btrix-rss-icon.png" alt="RSS" /></a></div>
</td>
<td><a class="Fadeout" href="https://pinterest.com/romeltea" imageanchor="1" rel="nofollow" target="_blank"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEinCCUf6wiJGm57w7rfI65ehtZJb-SIX5MFgIvAvEtg7bGqZ5Wwp06UvfDm2EtzFXVY0ZiUBpvPuhZVYaT6v7G5ExPaUM2q3zL8lPAVNSTjQnnjoC3BnsSS2z_zMaxvQSD4A-AE4aSNMmQ/s1600/btrix-Pinterest-icon.png" alt="pinterest" /></a></td>
</tr></tbody></table></div></div>
<!-- SOCIAL PROFILE END -->
3. Ganti tulisan warna merah dengan "kepunyaan" Anda
4. Save!
Demikian Cara memasang Widget Subscribe Box plus Sosial Media di Sidebar Blog.
Sumber Kode
No comments:
Post a Comment