Kali ini saya mau share masih seputar blogger broo...heee,yaitu cara menambahkan widget share yang cantik di bawah postingan,blogger yang cantik tentunya akan menjadikan pengunjung menjadi betah,apalagi kalau yang buat juga cantik heee ane juga bakalan betah dah ngunjungin blognye...wkwkkwk,yuk langsung ke tip dan tricknya aja broooo,langsung di pasang langsung di comot jangan sungkan2 dan jangan malu2...ok
Contoh Tampilan
Cara Penerapan
1.Masuk ke Blogger
2.Pilih Template kemudian pilih Edit HTML
2.Pilih Template kemudian pilih Edit HTML
Maka akan keluar tampilan semua Code HTML
3.Pilih Lanjutkan----> Centang Expand Template Widget
4.Tekan CTRL+F untuk membuka menu Search
cari code <post.body></post.body>
5. Taruh code tambahan di atasnya <post.body></post.body>
Berikut ini adalah code yang perlu anda tambahkan
<style></style>
/*--------Flipper Sharing Widget ------*/
.flipper a {
display:block;
height:48px;
width:48px;
padding:0 4px;
float:left;
background:transparent url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgN9t4HoDPZtBydYjHQy7MZejw0Y37x_YgNoofPmFJZiwwAM3BZRgGYL4QWkbO3CMkA6Hqp2K1qDgpnSl_QBxv7w5oXG4QlUKG4WsGSZV8ODwkQ3N_JqXiy6sHD9ZQw3ECJLp_m5eU1VQIT/s1600/flipper.png) no-repeat;
-webkit-transition: ease-in 0.15s all;
-moz-transition: ease-in 0.15s all;
-o-transition: ease-in 0.15s all;
-ms-transition: ease-in 0.15s all;
transition: ease-in 0.15s all;
cursor:pointer;
}
.flipper a.googleplus {
background-position: 0px -348px;
}
.flipper a.googleplus:hover {
background-position: 0px -406px;
}
.flipper a.pinterest {
background-position: 0px -464px;
}
.flipper a.pinterest:hover {
background-position: 0px -522px;
}
.flipper a.delicious {
background-position: 0px 0px;
}
.flipper a.delicious:hover {
background-position: 0px -58px;
}
.flipper a.digg {
background-position: 0px -116px;
}
.flipper a.digg:hover {
background-position: 0px -174px;
}
.flipper a.stumbleupon {
background-position: 0px -812px;
}
.flipper a.stumbleupon:hover {
background-position: 0px -870px;
}
.flipper a.technorati {
background-position: 0px -928px;
}
.flipper a.technorati:hover {
background-position: 0px -406px;
}
.flipper a.twitter {
background-position: 0px -928px;
}
.flipper a.twitter:hover {
background-position: 0px -986px;
}
.flipper a.facebook {
background-position: 0px -232px;
}
.flipper a.facebook:hover {
background-position: 0px -290px;
}
.flipper a.reddit {
background-position: 0px -580px;
}
.flipper a.reddit:hover {
background-position: 0px -638px;
}
.flipper a.rss {
background-position: 0px -696px;
}
.flipper a.rss:hover {
background-position: 0px -754px;
}
.Pleaseshare{
margin:10px 0px;
color:#333333;
font-weight:bold;
font-size:20px;
font-family:sans-serif;
}
<if cond="data:blog.pageType == "item""></if>
6.Save...
7. Enjoy.....
 |
 |
Related Post:
yodicakep Assalammualaikum, Nama saya Muhammad Yodi Assari:
saya dari Brebes Jawa Tengah,saya ucapkan terimakasih kepada teman-teman semua yang telah mengunjungi Website kami,mudah-mudahan bermanfaat,jika teman-teman menemukan kesulitan silahkan hubungi kami
0 komentar:
Posting Komentar