TutorialWordpress

Wordpress

Latest Post

Tampilkan postingan dengan label Facebook. Tampilkan semua postingan
Tampilkan postingan dengan label Facebook. Tampilkan semua postingan

Widget Social Sharing Dengan Icon Angry Birds


Widget Social Sharing dengan icon Angry Birds - Salah satu cara mempercantik blog adalah dengan cara memasang widget yang menarik. Seperti salah satu widget yang akan saya bagi berikut ini, yaitu Widget sosial sharing. Berbeda dengan widget yang lainnya. Widget ini menggunakan icon angry birds. Sobat penasaran? Lihat gambar diatas.

Berikut ini cara membuat Widget Social Sharing dengan icon Angry Birds.



  • Masuk ke dashboard blog sobat
  • buka menu template > edit HML
  • lalu cari kode ]]></b:skin> gunakan ctrl+F untuk mempermudah mencari
  • letakkan kode dibawah ini tepat diatas kode ]]></b:skin>

/* Vikrymadz */
.bubblewrap{
list-style-type:none;
margin:0;
padding:0;
}
.bubblewrap li{
display:inline;
width: 60px;
height:60px;
}
.bubblewrap li img{
width: 50px; /* width of each image.*/
height: 50px; /* height of each image.*/
border:0;
margin-right: 4px; /*spacing between each image*/
-webkit-transition:-webkit-transform 0.1s ease-in; /*animate transform property */
-o-transition:-o-transform 0.1s ease-in; /*animate transform property in Opera */
}
.bubblewrap li img:hover{
-moz-transform:scale(1.8); /*scale up image 1.8x*/
-webkit-transform:scale(1.8);
-o-transform:scale(1.8);
}

  • lalu simpan
  • kemudian masuk ke > tata letak > add gadget/tambah gadget (HTML/JavaScript)
  • lalu masukkan kode dibawah ini

<li><a href="https://plus.google.com/#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh7uiDb4djkMdqs7AAjAcJc8oJP38bGMnBvlZZjtN6T8hdGCJ2kkPiB4hEbBdoE_UgO3FVcJ2HACxQq5Ly1fC1Hp1jp88wW9vgujuuDeq2rRnkLzZkZaU8WEkqlnd9WOa3fMrVf9U-CLE8/s1600/bloggertrix-googleplus.png" title="Add to Google+" /></a></li>
<li><a href="http://www.facebook.com/#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgG8EavMxwrpcDa2tEO29M5IJaddZLgjSt5KbfQovOJ9MSqrFOUV2a2cEjcJz4dm9aZot8n1dbS8_Bxu7zpiXmZ4gR9TzHEdhI9Tf_qoNyedxTmKfWqZGe-QhD88XYGQCBXczCjkd1JqVM/s1600/bloggertrix-facebook.png" title="Add to Facebook" /></a></li>
<li><a href="http://www.youtube.com/#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh6UH66xDDwPl62OTG72s0PMHdtgRD7_uBzSd82DjeTrm8H6LpTFQoP4VUCBaMaJvnMAKjNV03Dvj1YlUB6iw5vGQlzEW1r9uXg3IK8yPpBcNMXQNWkp4NGXHDYTk-JG18TwbXPLMMJqcU/s1600/bloggertrix-youtube.png" title="Add to Youtube" /></a></li>
<li><a href="http://www.twitter/#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjTAXCtHaAwxCj68pLfeU3ebZJGwKinstLQyW6DI5DKUbgHEEOhB7ceC6dgK41L2QoNNA97ZH2yhchyIWdk7fAysxWk2iWpVAioGKLmVI6O_rhI71R9PfXTVnO79oEe6XbCvRf1DUc0yBY/s1600/bloggertrix-twitter.png" title="Add to Twitter" /></a></li>
<li><a href="http://feeds2.feedburner.com/#"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjxg7xUefaRY7BMH9V5dbMZJFW5TYvLsLL8zWQN7r8a3Cmz2EvuT3D7Umy34IPoaUJ2jrASSKKZSfDyIFsuVQnlv242iH0DhSWudAC0CXCzXP_Cl14A_kAcEwNSTjWA9z2Nc8uVyEo-WkU/s1600/bloggertrix-Rss.png" title="Add RSS Feed" /></a></li>
</ul>
  • Simpan dan lihat hasil nya

NOTE : Gantilah setiap tanda #dengan User Name yang sesuai dengan punya sobat

Widget Share (RSSfeed, Twitter, Facebook) Artikel Untuk Blogspot



Widget Share (RSSfeed, Twitter, Facebook) Artikel Untuk Blogspot -Banyaknya widget Share Artikel yang bisa dipasang pada blog, membuat saya bingung untuk memberi judul pada artikel kali ini. Namun inti nya ini adalah widget share seperti yang terlihat pada gambar diatas.
Widget ini terdapat sosial boorkmark seperti RSSfeed, twitter, facebook.

Jika sobat tertarik ingin memasang widget ini pad blog sobat. Caranya sebagai berikut:

1. Masuk ke Dashboard > Template > Edit Html.
2. Jangan lupa back up Template, dan Check Expand Widgets Box.
3. Cari kode <data:post.body/>
4. Masukkan kode berikut ini dibawah kode <data:post.body/>




<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style> 
form.emailform{ 
margin:20px 0 0; 
display:block; 
clear:both; 
} 
.mbttext{ 
background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjz_QqifqRd4LMP7-mpNgt4K3Pq-FZhhFlGrDpBEaNZ3YjdwT8b4oDRLQTaFlhOrEn4DYGKf0pfiF_w1C6obwSQx3RfX8VpXFaajWgavb60LY7Kt9GCWIElR47VceaUzZ_H7jnLOr8GZc4o/s28/w2b-mail.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; 
} 
.mbtbutton{ 
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=&#39;#FBFBFB&#39;, endColorstr=&#39;#F4F4F4&#39;,GradientType=0 ); 
background: linear-gradient(top, #fbfbfb 0%,#f4f4f4 100%); 
}
#doulike-outer { 
-moz-border-radius: 10px 10px 10px 10px; 
-webkit-border-radius: 10px 10px 10px 10px; 
-goog-ms-border-radius: 10px 10px 10px 10px; 
border-radius: 10px; 
background: none repeat scroll 0 0 transparent; 
border: 1px solid #D3D3D3; 
padding: 8px; 
-moz-transition: all 0.3s ease-out; 
-o-transition: all 0.3s ease-out; 
-webkit-transition: all 0.3s ease-out; 
-ms-transition: all 0.3s ease-out; 
transition: all 0.3s ease-out; 
width:480px; 
} 
#doulike-outer:hover{ 
background: none repeat scroll 0 0 #FFF; 
-moz-box-shadow: 1px 1px 2px #CCC inset; 
-webkit-box-shadow: 1px 1px 2px #CCC inset; 
box-shadow: 1px 1px 2px #CCC inset; 
} 
#doulike-outer td{ 
padding:3px 0; 
} 
</style>
<div id='doulike-outer'> 
<div id='doulike'> 
<table width='100%'> 
<tbody> 
<span style='font-style: italic; font-size: 30px; font-family: arial,sans-serif, verdana;  color:#FF683F;'>Do you like this blog?</span> 
<tr> 
<td>
<div id='fb-root'/><script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/><fb:like font='' href='' layout='button_count' send='true' show_faces='false' width='300'/>
</td>
</tr>
<tr>
<td align='left'> <p style='color:#666; font-style:italic; margin:0px 0px 5px 0px; '>Get Free Email Updates Daily!</p> 
<form action='http://feedburner.google.com/fb/a/mailverify' class='emailform' method='post' onsubmit='window.open(&apos;http://feedburner.google.com/fb/a/mailverify?uri=onetroverlight&apos;, &apos;popupwindow&apos;, &apos;scrollbars=yes,width=550,height=520&apos;);return true' style='margin: 0pt;' target='popupwindow'> 
<input name='uri' type='hidden' value='onetroverlight'/> 
<input name='loc' type='hidden' value='en_US'/> 
<input class='mbttext' 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='mbtbutton' title='' type='submit' value='Submit'/> 
</form> 
</td>

<td><p style='color:#666; font-style:italic; margin:0px 0px 5px 0px;  '>Follow us!</p> 
<a href='http://feeds.feedburner.com/onetroverlight' rel='nofollow' target='_blank' title='Suscribe to RSS Feed'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEibui6fJozjxWVHh-OS1F3XIRDLATUwpbVFifJuYz0z8M0HbXjN28fURYjx7GHaYd-U4xcFwrtJXbOCA-sKkadS4h5g0wGdtXCX6Iyd47ItiGF4-buZn3JlRI7rzl5_O_I2cMqeBya_Na-G/s40/w2bRSS .png'/></a>
<a href='http://twitter.com/one_troverlight' rel='nofollow' target='_blank' title='Follow us on Twitter'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgCbijzTos2apg4f3ec038C206uam-L9SmJVAAX0BXmVvpaDAInNArBqVZ-3ms30UoaaiWAA8fPz0VQD23vyIFb8uTEhmM8qpjAs03dTT5QCwO9nzbN1M2WUcw2SJDCidJjdIaSSZkH5GtO/s40/w2bTwitter.png'/></a>
<a href='http://www.facebook.com/Onetroverlight' rel='nofollow' target='_blank' title='Follow us on Facebook'><img src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg_FTCyq697FevLdNfusIhyphenhyphen9asDEeBYLNsskwcoi53W0w3d8dE9cMXL-Zh1UB-Jb2EB0K2wDdGTr3SCAMDtuXpmroUKh9Z6W5WHhkQEzBR5KdKCEYbK5LxONNkFBZpY0RpKyganVx7wCxhE/s40/w2bFaceBook.png'/></a> 
</td>
</tr>
</tbody></table></div></div> 
</b:if>



Note: ubah setiap tulisan berwarna merah sesuai dengan URL atau pun ID blog sobat.

:: SELAMAT MENCOBA ::









Get free daily email updates!
Follow us!

Cara Termudah Membuat Likebox Facebook Melayang Pakai Tombol Close



Baiklah, karena banyak sobat yang masih bertanya bagaimana cara Membuat Facebook Like Box bisa melayang di blog ?  Kali ini saya akan sharing cara memasangnya di blog. Sangat pas sekali bagi sobat sudah kehabisan tempat widget diblognya dan juga untuk memberi efektifitas tambahan Like pada blog sobat,

Berikut ini saya berbagi cara  memasang Like box secara floating dan akan turun jika croll mouse ke bawah dan enaknya ada tombol closenya. 

Syaratnya, sobat harus sudah punya halaman fanpage facebook, lalu Ambil kode Script Likebox yang sudah disesuaikan dengan blognya. ( untuk yang belum punya Fanpage Facebook, boleh klik disini)



Cara Termudah Membuat Likebox Facebook Pakai Tombol Close. Berikut ini langkah-langkahnya :


1. Pertama Login Seperti biasa ke akun blognya masing2
2. Pada halaman Dashboard blog pilih >> Tata Letak >> Lalu Klik Add a Gadget atau Tambah Gadget
3. Scroll ke bawah sedikit >> Lalu pilih Widget HTML/Javascript 
4. Jika sudah Copy Kode di Bawah ini dan Paste di dalam Widget kolom HTML/Javascript

<!-- Script kotak like Facebook Melayang mrrainboow-xp -->
<style type="text/css">
#topbar{
position:absolute;
padding-left:260px;
background-color: transparancy;
width: 300px;
visibility: hidden;
z-index: 100;
}
</style>
<script type="text/javascript">
var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser session
var startX = 30 //set x offset of bar in pixels
var startY = 5 //set y offset of bar in pixels
var verticalpos="fromtop" //enter "fromtop" or "frombottom"
function iecompattest(){
return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body
}
function get_cookie(Name) {
var search = Name + "="
var returnvalue = "";
if (document.cookie.length > 0) {
offset = document.cookie.indexOf(search)
if (offset != -1) {
offset += search.length
end = document.cookie.indexOf(";", offset);
if (end == -1) end = document.cookie.length;
returnvalue=unescape(document.cookie.substring(offset, end))
}
}
return returnvalue;
}
function closebar(){
if (persistclose)
document.cookie="remainclosed=1"
document.getElementById("topbar").style.visibility="hidden"
}
function staticbar(){
barheight=document.getElementById("topbar").offsetHeight
var ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;
var d = document;
function ml(id){
var el=d.getElementById(id);
if (!persistclose || persistclose && get_cookie("remainclosed")=="")
el.style.visibility="visible"
if(d.layers)el.style=el;
el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};
el.x = startX;
if (verticalpos=="fromtop")
el.y = startY;
else{
el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;
el.y -= startY;
}
return el;
}
window.stayTopLeft=function(){
if (verticalpos=="fromtop"){
var pY = ns ? pageYOffset : iecompattest().scrollTop;
ftlObj.y += (pY + startY - ftlObj.y)/8;
}
else{
var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;
ftlObj.y += (pY - startY - ftlObj.y)/8;
}
ftlObj.sP(ftlObj.x, ftlObj.y);
setTimeout("stayTopLeft()", 10);
}
ftlObj = ml("topbar");
stayTopLeft();
}
if (window.addEventListener)
window.addEventListener("load", staticbar, false)
else if (window.attachEvent)
window.attachEvent("onload", staticbar)
else if (document.getElementById)
window.onload=staticbar
</script>
<br />
<div class="clear">
</div>
<div id="topbar">
<table border="1" bgcolor="FFFFFF">
<tr>
<td>
<div style="text-align: right;">
<a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7_TsOEc353dTkD5oCUwFNROoQlmrQIKWIra-eUkjaloPN2RKjX1DslrW7VAdilcOiY-4pY4uAlDD4LcJIli5cBEmXiOScm-LrAfJQztxE30QArQfvx-poxEhFlqJUEPZUFxvwqw_YNB19/s1600/close3.png" /></a></div>
<center>
<div style="background: #fff;"> 
Kode Script Facebook Likebox Here !!! 
</div>
</center></td>
</tr>
</table>
</div>
<!-- End Like Fan Page Melayang MrRainboow-xp -->


5. Save !! Lihat Hasilnya

Catatan:
*)Ganti Kode merah "Kode Script Facebook Likebox Here !!!" dengan kode script yang sudah diambil dari fanpage facebook yang sudah dibuat sebelumnya . 





-==™  SELAMAT MENCOBA ™==-





Membuat Pop Up ditengah Postingan All Script




Pada umumnya yang pernah saya lihat ketika berkunjung di blog sobat, Pop Up pada blogger sering kali muncul berupa like box facebook, seperti gambar disamping ini.
Namun bagaimana jika kita ingin memasang Pop Up selain like box facebook? Untuk sobat blogger, berikut ini tentang cara membuat Pop Up yang muncul ditengah postingan blog,namun pop up ini dapat di isi script berupa iklan atau sesuatu yang bersifat mempromosikan blog kita.






Berikut Caranya:
  • Log in ke akun blogger
  • Pada Dasbor click Tata Letak > Tambah Gadget
  • Lalu sobat pilih HTML/Java Scrip > Setelah itu copy kode berikut dan paste atau letakkan di dalamnya!
Lihat Script:
<style type="text/css">#topbar{position:absolute;padding-left:20%;padding-top:10%;background-color: transparancy;width: auto;heigth:auto;visibility: hidden;z-index: 100;}</style> <script type="text/javascript">var persistclose=0 //set to 0 or 1. 1 means once the bar is manually closed, it will remain closed for browser sessionvar startX = 30 //set x offset of bar in pixelsvar startY = 5 //set y offset of bar in pixelsvar verticalpos="fromtop" //enter "fromtop" or "frombottom"function iecompattest(){return (document.compatMode && document.compatMode!="BackCompat")? document.documentElement : document.body}function get_cookie(Name) {var search = Name + "="var returnvalue = "";if (document.cookie.length > 0) {offset = document.cookie.indexOf(search)if (offset != -1) {offset += search.lengthend = document.cookie.indexOf(";", offset);if (end == -1) end = document.cookie.length;returnvalue=unescape(document.cookie.substring(offset, end))}}return returnvalue;}function closebar(){if (persistclose)document.cookie="remainclosed=1"document.getElementById("topbar").style.visibility="hidden"}function staticbar(){barheight=document.getElementById("topbar").offsetHeightvar ns = (navigator.appName.indexOf("Netscape") != -1) || window.opera;var d = document;function ml(id){var el=d.getElementById(id);if (!persistclose || persistclose && get_cookie("remainclosed")=="")el.style.visibility="visible"if(d.layers)el.style=el;el.sP=function(x,y){this.style.left=x+"px";this.style.top=y+"px";};el.x = startX;if (verticalpos=="fromtop")el.y = startY;else{el.y = ns ? pageYOffset + innerHeight : iecompattest().scrollTop + iecompattest().clientHeight;el.y -= startY;}return el;}window.stayTopLeft=function(){if (verticalpos=="fromtop"){var pY = ns ? pageYOffset : iecompattest().scrollTop;ftlObj.y += (pY + startY - ftlObj.y)/8;}else{var pY = ns ? pageYOffset + innerHeight - barheight: iecompattest().scrollTop + iecompattest().clientHeight - barheight;ftlObj.y += (pY - startY - ftlObj.y)/8;}ftlObj.sP(ftlObj.x, ftlObj.y);setTimeout("stayTopLeft()", 10);}ftlObj = ml("topbar");stayTopLeft();}if (window.addEventListener)window.addEventListener("load", staticbar, false)else if (window.attachEvent)window.attachEvent("onload", staticbar)else if (document.getElementById)window.onload=staticbar</script><div class="clear"></div><div id="topbar"><div style="text-align: right;"><a href="" onclick="closebar(); return false"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7_TsOEc353dTkD5oCUwFNROoQlmrQIKWIra-eUkjaloPN2RKjX1DslrW7VAdilcOiY-4pY4uAlDD4LcJIli5cBEmXiOScm-LrAfJQztxE30QArQfvx-poxEhFlqJUEPZUFxvwqw_YNB19/s1600/close3.png" alt="close"/></a></div><center><div style="background: #fff;">*** MASUKAN HTML WIDGET/IKLAN/GAMBAR/DSB DISINI***</div></center></div>


  • NOTE : warna merah silahkan anda ganti dengan iklan anda (bisa berupa gambar, video, teks dan lainnya). sedangkan warna biru (padding-left : 20%;") adalah angka horizontal dan padding-top : 10%;" adalah vertikalnya. silahkan sobat sesuaikan sendiri.

Pasang Tombol Like di Setiap Postingan



Memasang Tombol Like adalah cara alternatif untuk mempromosikan blog kita ke khalayak ramai. Apalagi jika sobat melakukan trik yang satu ini, yaitu memasang tombol like disetiap postingan. Tentunya sangat berguna untuk mempromosikan artikel ataupun blogger sobat. Jika sobat tertarik untuk memasang tombol like, caranya cukup mudah. Sobat hanya perlu mengikuti tahap-tahapnya yang akan saya share kali ini.



1.    Login Blogger
2.    Masuk ke Menu Template - Edit HTML
3.    Beri Tanda Centang Expand Template Widget
4.    Cari Kode : <data:post.body/>
5.    Letakan kode berikut tepat dibawah kode <data:post.body/>

<iframe allowTransparency='true' expr:src='&quot;http://www.facebook.com/plugins/like.php?href=&quot; + data:post.url + &quot;&amp;layout=standard&amp;show_faces=false&amp;width=100&amp;action=like&amp;font=tahoma&amp;colorscheme=light&quot;' frameborder='0' scrolling='no' style='border:none; overflow:hidden; width:310px; height:31px;'/>

6.    Simpan Template

Catatan :
Jika dalam pencarian kode <data:post.body/> sobat menemukan lebih dari 1 kode, maka pilih saja kode yang kedua.

Cara Menyesuaikan dan Mengatur Kembali Ukuran Like Box Facebook



Mungkin bagi sobat yang sudah sering membuat blog dan fans page pada facebook, ini adalah hal yang mudah, yaitu menambahkan like box facebook pada blog. 
Namun, suatu kejadian kemarin membuat saya bingung, tanpa disengaja ketika mengganti template blogger, like box facebook pada blogger saya menjadi tidak sesuai. Namun setelah sedikit utak atik sekarang saya telah menemukan solusinya.



Kali ini saya akan membagikan cara menyesuaikan ukuran like box facebook pada blog, cara sangat mudah sekali. Saya menyarankan melakukan tips dibawah ini dari pada mengatur manual di HTML/Javascript "Like box facebook" yang sudah pernah ditambahkan.
2. Pada kotak yang tersedia masukkan url Facebook Page sobat
3. Secara otomatis like box facebook sobat akan muncul, setelah itu...
4. Lakukan pengaturan :

- Width: lebar tampilan facebook like, sesuaikan dengan lebar sidebar widget.

- Color scheme: pilih light jika ingin tampilan terang, dan dark untuk tampilan gelap.




- Show Faces: Centang untuk menampilkan foto profil likers.

- Border color: Isikan dengan kode warna jika ingin memberi border atau kosongkan agar transparan.

- Show stream: Centang jika ingin menampilkan informasi/posting terakhir di like box.
- Show header: Centang jika ingin menampilkan tulisan header "Find Us on Facebook"
- Lihat preview tampilan di sebelah kanan form tersebut.

5. Jika settingan yang dibuat sudah beres, klik get code. Kemudian akan muncul pop-up window yang menampilkan 3 jenis kode, HTML5, iFrame dan XFBML, pilih HTML5, dan copy.(Jika sudah pernah memasang script like box  facebook sebelumnya, maka copy kode yang dibawah saja)

6. Buka Dashboard > Tata Letak > Klik add a gadget/tambah gadget.
- Pilih opsi HTML/Javascript.
- Masukkan kode yang telah dicopy ke dalam kotak kode.
- Save.


-==™  SELAMAT MENCOBA ™==-


Memasang Widget Share Melayang



Facebook, Twitter dan Google+ merupakan jejaring sosial yang mampu mendongkrak traffic kunjungan dan popularitas blog. Pada kesempatan ini saya akan membuat tutorial tentang cara membuat dan memasang like share facebook dan tweet dan google plus diblog.

Cara membuat dan memasang like share facebook dan tweet dan google plus di blog, sebagai berikut:

1. Masuk ke akun blogger
2. Dasbor > Tata Letak > Tambahkan Gadget > Pilih Html/Javascript
3. Masukkan kode di bawah ini


<style type="text/css">*{margin:0;padding:0;}
* html #z33sHare{position: absolute;}
#z33sHare{left:10%;width: 70px;background:transparant;border:0px solid #E7E7E7;-moz-border-radius:3px;-webkit-border-radius:3px;position:fixed;top: 35%;}
#z33sHare div{padding:6px 6px 6px 5px;}
#stw{margin-left:-2px;}
#sfs{margin-left:-5px;}
</style><div id="z33sHare"><div id="ssl-box"><div id='pageshare' title="Share AF Sahabat Artikel and Thank U for Coming"><div id="stw"><a href="http://twitter.com/share" class="twitter-share-button" data-count="vertical">Tweet</a><script type="text/javascript" src="http://platform.twitter.com/widgets.js"></script></div><div class='sbutton' id='gplusone'><script type="text/javascript" src="https://apis.google.com/js/plusone.js"></script><g:plusone size="tall"></g:plusone></div><div><script type="text/javascript">(function() {var s = document.createElement('SCRIPT'), s1 = document.getElementsByTagName('SCRIPT')[0];s.type = 'text/javascript';s.async = true;s.src = 'http://widgets.digg.com/buttons.js';s1.parentNode.insertBefore(s, s1);})();</script><a class="DiggThisButton DiggMedium"></a></div><div><a name="fb_share" type="box_count" href="http://www.facebook.com/sharer.php">Share</a><script src="http://static.ak.fbcdn.net/connect.php/js/FB.Share" type="text/javascript"></script></div><div style="clear:both;"></div></div>


4. Terakhir simpan > simpan setelan.
5. Selesai




-==™  SELAMAT MENCOBA ™==-







Get free daily email updates!
Follow us!