Saturday, May 10, 2014

Cara membuat widget about me keren di blog

Cara membuat widget about me keren di blog - Hello visitor, Bang Juling, In the article that you are reading in this time with the title Cara membuat widget about me keren di blog, we hope this article useful for your problem information. hopefully the contents of the post label blogger, what we write you can understand. all right, have a nice reading.

Tittle : Cara membuat widget about me keren di blog
Links : Cara membuat widget about me keren di blog

Also read :


Cara membuat widget about me keren di blog

Sore all
kali ini mimin mau kasih Tutorial
Cara membuat widget about me keren di blog














1. Masuk Setelan - tata letak - Tambahkan Gadget - Html / java script
 ( Masukan kode di bawah ini )

<style> #profile{ border:2px solid #888; margin:2px 5px 0px 0px;padding:2px;text-align:justify;height:190px;width: 120px; } #profile:hover { border:2px solid #ccc;cursor:pointer;text-align:justify; } .opacity  { opacity: 0.5;margin-left: 50px;-moz-transition: all 0.5s ease-out;-o-transition: all 0.5s ease-out;-webkit-transition: all 0.5s ease-out;-ms-transition: all 0.5s ease-out;transition: all 0.5s ease-out;-moz-transform: rotate(7deg);-o-transform: rotate(7deg); -webkit-transform: rotate(7deg);-ms-transform: rotate(7deg);transform: rotate(7deg); filter: progid:DXImageTransform.Microsoft.Matrix(                     M11=0.9961946980917455, M12=-0.08715574274765817, M21=0.08715574274765817, M22=0.9961946980917455, sizingMethod='auto expand'); zoom: 1; } .opacity:hover  { opacity: 1; margin-left: 0px; -moz-transform: rotate(0deg); -o-transform: rotate(0deg); -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); filter: progid:DXImageTransform.Microsoft.Matrix(                     M11=1, M12=0, M21=0, M22=1, sizingMethod='auto expand'); zoom: 1; -moz-box-shadow: 1px 1px 4px #000; -webkit-box-shadow: 1px 1px 4px #000; box-shadow: 1px 1px 4px #000; } </style> <img class="opacity" id="profile" src="https://fbcdn-profile-a.akamaihd.net/hprofile-ak-frc1/t1.0-1/c27.0.160.160/p160x160/10171842_624113267674367_8441139293337408510_n.jpg" align="left"/> <div style='text-align:justify'>Nama : muhammad rizal
Status : pelajarSeorang newbie blogger asal jakarta yang ingin share ilmu tutorial yang bermanfaat<a style="color:#888;" href="http://bangjuling.blogspot.com/p/nama-muhammad-rizal-ajahh.html" rel='nofollow' target='_blank'> Read More..</a></div> <style> .touchme a { display:block;height:50px;width:45px;padding:0 4px;margin-top:10px; float:left;background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEimMCOA0O_Sle-gvKNazJJzdsxQRekV8jn80R5FcIuJScjBwxSNeBtdits6Xo0gCcDjXxbwyEH8zIGZ-AIAbDLf99gMumvr9PfdMCwOztaQh9VTgPf1t3b92kZ4d0SyBI3j7IRULOYpXm8/s1600/Sharing+Touch+Me.png) no-repeat;-webkit-transition: ease-in 0.2s all; -moz-transition: ease-in 0.2s all;-o-transition: ease-in 0.2s all;-ms-transition: ease-in 0.2s all; transition: ease-in 0.2s all;cursor:pointer; } .touchme a.googleplus { background-position: 0px -58px; } .touchme a.googleplus:hover { background-position: 0px 0px; } .touchme a.twitter { background-position: 0px -290px; } .touchme a.twitter:hover { background-position: 0px -232px; } .touchme a.facebook { background-position: 0px -406px; } .touchme a.facebook:hover { background-position: 0px -348px; } .touchme a.rss { background-position: 0px -174px; } .touchme a.rss:hover { background-position: 0px -116px; } </style> <div class='touchme'> <!--RSS--> <a class='rss' href="http://feeds.feedburner.com/AbangJali" target='_blank'></a> <!--Google Plus--> <a class='googleplus' href="https://plus.google.com/u/0/101399352908511362766" rel='external nofollow' target='_blank'></a> <!--Facebook--> <a class='facebook' href="https://www.facebook.com/vhtmlcovu" rel='external nofollow' target='_blank'></a> <!-- Twitter --> <a class='twitter' href="https://twitter.com/v_html" rel='external nofollow' target='_blank' ></a> </div>

Keterangan :
Warna : Pink : ganti dengan Gambar kamu
Warna : Oren : ganti dengan Diskripsi kamu
Warna : Merah : ganti dengan URL kamu

4. Simpan dan selesai

Sekian tutorial dari saya semoga bermanfaat
Jika ingin copy paste harap masukan sumber nya



Thanks for visit and reading Cara membuat widget about me keren di blog

That's the article Cara membuat widget about me keren di blog in this time, hopefully it can be of benefit to all of you. well, see you in another article post.

You are now reading the article Cara membuat widget about me keren di blog with the link address https://bangjuling.blogspot.com/2014/05/cara-membuat-widget-about-me-keren-di.html

0 comments

Post a Comment