Assalamualaikum.............
saya akan membagikan gambar cara mengikat sabuk karate berikut gambarnya:
1.
2.
3.
4.
5.
Sekian dari saya semoga bermanfaat.
Rohman Blog
Monday, May 6, 2013
Cara membuat tombol social media pada blog
Assalamualaikum..............
sosial media adalah media online dengan para penggunanya bisa dengan mudah berpatisipasi berbagi dan menciptakan isi meliputi blog, forum dan jejaring sosial
widget ini mungkin jadi bermanfaat bagi anda, dengan widget ini anda dapat mengunfang visitor untuk tergabung atau terlibat dalam jejaring sosial anda, membuat visitor lebih akrab dengan anda, dan dapat meningkatkan reputasi blog anda, tombol sosial media ini di lengkapi dengan efek hover pada tombol tersebut
berikut langkah-langkahnya:
- login ke dashboard blogger sobat
- masuk tata letak /layout
- pilih HTML/Java Script
- masukkan kode dibawah ini
<style>
#tbisose{list-style:none; text-decoration:none; font-size:0.9em; font-family:trebuchet ms,sans-serif;}
#tbisose a{text-decoration:none; font-family:trebuchet ms,sans-serif;}
#tbisose li{position:relative; height:38px; cursor:pointer; padding: 0 !important;}
#tbisose .facebook, .googleplus, .pinterest, .rss, .twitter{position:relative; z-index:5; display:block; float:none; margin:10px 0 0; width:210px; height:38px; border-radius:5px; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiDa5MwY1rWq5ChFOPRyU3dFFHYQ1fSDlmKU-ozRC8T4tldAG0eJBhx4WmNBVvn8990fyIb1s49CuaApLlCPy7hFAlr8gWUX43Wyy19_JDL5IlWxL2BIiS5JM8ZHInQs9B3TyPzlN_M9WQ/s800/sprites.png) no-repeat; background-color:rgba(217,30,118,.42); -webkit-box-shadow:rgba(0,0,0,.28) 0 2px 3px; -moz-box-shadow:rgba(0,0,0,.28) 0 2px 3px; box-shadow:rgba(0,0,0,.28) 0 2px 3px; color:#141414; text-align:left; text-indent:50px; text-shadow:#333 0 1px 0; white-space:nowrap; line-height:32px; -webkit-transition:width .25s ease-in-out,background-color .25s ease-in-out; -moz-transition:width .25s ease-in-out,background-color .25s ease-in-out; -ms-transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-transition:width .25s ease-in-out,background-color .25s ease-in-out; transition:width .25s ease-in-out,background-color .25s ease-in-out; -o-box-shadow:rgba(0,0,0,.28) 0 2px 3px;}
#tbisose li:after{position:absolute; top:0; left:50px; z-index:2; display:block; height:38px; color:#141414; content:attr(data-alt); line-height:32px;}
#tbisose .icon{overflow:hidden; color:#fafafa;}
#tbisose .facebook{width:32px; height:32px; background-color:rgba(59,89,152,0.42); background-position:0 0;}
#tbisose .twitter{width:32px; height:32px; background-color:rgba(64,153,255,0.42); background-position:0 -33px;}
#tbisose .googleplus{width:32px; height:32px; background-color:rgba(228,69,36,0.42); background-position:-3px -66px;}
#tbisose .pinterest{width:32px; height:32px; background-color:rgba(174,45,39,0.42); background-position:0 -95px;}
#tbisose .rss{ width:32px; height:32px; background-color:rgba(255,102,0,0.42); background-position:-3px -126px;}
#tbisose li:hover .icon,
.touch #tbisose li .icon{width:210px;}
.touch #tbisose li .facebook, #tbisose li:hover .facebook{background-color:rgba(59,89,152,1);}
.touch #tbisose li .twitter, #tbisose li:hover .twitter{background-color:rgba(64,153,255,1);}
.touch #tbisose li .googleplus, #tbisose li:hover .googleplus{background-color:rgba(228,69,36,1);}
.touch #tbisose li .pinterest, #tbisose li:hover .pinterest{background-color:rgba(174,45,39,1);}
.touch #tbisose li .rss, #tbisose li:hover .rss{background-color:rgba(255,102,0,1);}
</style>
<ul id="tbisose">
<li data-alt="Follow us on Facebook"><a class="icon facebook" href="URL">Follow us on Facebook</a></li>
<li data-alt="Follow us on Twitter"><a class="icon twitter" href="URL">Follow us on Twitter</a></li>
<li data-alt="Follow us on Google+"><a class="icon googleplus" href="URL">Follow us on Google+</a></li>
<li data-alt="Follow us on Pinterest"><a class="icon pinterest" href="URL">Follow us on Pinterest</a></li>
<li data-alt="Subscribe with RSS"><a class="icon rss" href="URL">Subscribe with RSS</a></li>
</ul>
<small><div style="font-size:80%; text-align:right; text-shadow:2px 2px 2px #adadad;">
<a href="http://badarclan.blogspot.com/2013/03/cara-membuat-tombol-social-media-pada.html" target="_blank" title="Widget Follow Us">+ Get This Widget Here</a></div>
</small>
- Ganti kata URL dengan masing masing alamat social media
Subscribe to:
Comments (Atom)


.jpg)


