1. Login ke akun blogger.
2. Langkah berikutnya Copy kode berikut ini lalu klik Tata Letak > Tambah Widget > HTML/Javascript kemudian paste kode disitu.
- Untuk memasang agar di sidebar, berikut kodenya:
<style>- Untuk memasang agar melayang di sudut atas kanan blog, berikut kodenya:
#accordion-evolutions { position:relative; margin:auto; } #accordion-follower { height:auto; width:290px; background:#e9fbe9; border:1px solid #52e052; padding:10px; display:none; margin:auto; } #accordion-button { height:40px; width:312px; background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHn9gPFU50UkLrd6qE_U8s94rrSLLtHUg2jjM1QeGIEfom-CVmxDwugImKw6XQ-pmxkoG6OA1wAEFQfIqA9y4L3dc38myWHGy3O29sHdXTz3f3e0MTbP6XYGjQoIr1Soj9ArjuxmsUggo/h46/follow_button.png'); display:block; cursor:pointer; margin:auto; }
</style>
<script src="http://faceblog-evolutions.googlecode.com/files/jquery-1.2.6.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){ $("#accordion-button").click(function(){ if ($("#accordion-follower").is(":hidden")){ $("#accordion-follower").slideDown("slow"); } else{ $("#accordion-follower").slideUp("slow"); } }); }); function closeForm(){ setTimeout('$("#accordion-follower").slideUp("slow")', 2000); }
</script>
<div id="accordion-evolutions">
<div id="accordion-follower">
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<div id="div-7w5ths5ahnit"></div>
<script type="text/javascript">
var skin = {};
skin['BORDER_COLOR'] = '#000000';
skin['ENDCAP_BG_COLOR'] = '#e9fbe9';
skin['ENDCAP_TEXT_COLOR'] = '#000000';
skin['ENDCAP_LINK_COLOR'] = '#000000';
skin['ALTERNATE_BG_COLOR'] = '#transparent';
skin['CONTENT_BG_COLOR'] = '#transparent';
skin['CONTENT_LINK_COLOR'] = '#000000';
skin['CONTENT_TEXT_COLOR'] = '#000000';
skin['CONTENT_SECONDARY_LINK_COLOR'] = '#FFFFFF';
skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#000000';
skin['CONTENT_HEADLINE_COLOR'] = '#000000';
skin['NUMBER_ROWS'] = '2';
google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderMembersGadget(
{ id: 'div-7w5ths5ahnit',
site: '10916685731781888212' },
skin);
</script>
</br>
<div class="g-plus" data-action="followers" data-height="200" data-href="https://plus.google.com/104093787575230359634" data-source="blogger:blog:followers" data-width="300">
</div>
<script type="text/javascript">
(function() {
window.___gcfg = {'lang': 'en'};
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
</br>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fandestyle&width=292&height=258&show_faces=true&colorscheme=light&stream=false&show_border=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:200px;" allowTransparency="true"></iframe>
</div>
<div id="accordion-button"></div>
</div>
<style>Keterangan:
#accordion-evolutions { position:fixed; top: 0; right:20px; float:right; } #accordion-follower { height:auto; width:290px; background:#e9fbe9; border:1px solid #52e052; padding:10px; display:none; } #accordion-button { height:40px; width:312px; background-image:url('https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHn9gPFU50UkLrd6qE_U8s94rrSLLtHUg2jjM1QeGIEfom-CVmxDwugImKw6XQ-pmxkoG6OA1wAEFQfIqA9y4L3dc38myWHGy3O29sHdXTz3f3e0MTbP6XYGjQoIr1Soj9ArjuxmsUggo/h46/follow_button.png'); display:block; cursor:pointer; margin:auto; }
</style>
<script src="http://faceblog-evolutions.googlecode.com/files/jquery-1.2.6.min.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(function(){ $("#accordion-button").click(function(){ if ($("#accordion-follower").is(":hidden")){ $("#accordion-follower").slideDown("slow"); } else{ $("#accordion-follower").slideUp("slow"); } }); }); function closeForm(){ setTimeout('$("#accordion-follower").slideUp("slow")', 2000); }
</script>
<div id="accordion-evolutions">
<div id="accordion-follower">
<script type="text/javascript" src="http://www.google.com/friendconnect/script/friendconnect.js"></script>
<div id="div-7w5ths5ahnit"></div>
<script type="text/javascript">
var skin = {};
skin['BORDER_COLOR'] = '#000000';
skin['ENDCAP_BG_COLOR'] = '#e9fbe9';
skin['ENDCAP_TEXT_COLOR'] = '#000000';
skin['ENDCAP_LINK_COLOR'] = '#000000';
skin['ALTERNATE_BG_COLOR'] = '#transparent';
skin['CONTENT_BG_COLOR'] = '#transparent';
skin['CONTENT_LINK_COLOR'] = '#000000';
skin['CONTENT_TEXT_COLOR'] = '#000000';
skin['CONTENT_SECONDARY_LINK_COLOR'] = '#FFFFFF';
skin['CONTENT_SECONDARY_TEXT_COLOR'] = '#000000';
skin['CONTENT_HEADLINE_COLOR'] = '#000000';
skin['NUMBER_ROWS'] = '2';
google.friendconnect.container.setParentUrl('/' /* location of rpc_relay.html and canvas.html */);
google.friendconnect.container.renderMembersGadget(
{ id: 'div-7w5ths5ahnit',
site: '10916685731781888212' },
skin);
</script>
</br>
<div class="g-plus" data-action="followers" data-height="200" data-href="https://plus.google.com/104093787575230359634" data-source="blogger:blog:followers" data-width="300">
</div>
<script type="text/javascript">
(function() {
window.___gcfg = {'lang': 'en'};
var po = document.createElement('script');
po.type = 'text/javascript';
po.async = true;
po.src = 'https://apis.google.com/js/plusone.js';
var s = document.getElementsByTagName('script')[0];
s.parentNode.insertBefore(po, s);
})();
</script>
</br>
<iframe src="//www.facebook.com/plugins/likebox.php?href=https%3A%2F%2Fwww.facebook.com%2Fandestyle&width=292&height=258&show_faces=true&colorscheme=light&stream=false&show_border=false&header=false" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:292px; height:200px;" allowTransparency="true"></iframe>
</div>
<div id="accordion-button"></div>
</div>
Ganti kode yang berwarna merah dengan ID widget follower blog anda, caranya lihat disini.
Ganti 104093787575230359634 dengan ID google+ anda.
Ganti andestyle dengan ID facebook/fanspage anda.
3. Langkah terakhir klik Simpan.
0 Response to "Membuat Widget Follower Accordion Pada Blog"