Sabtu, 10 Mei 2014
ul.social_TempatBlogging {5. Cari tag <data:post.body/> dengan menggunakan Ctrl + F
list-style:none;
display:inline-block;
margin:15px auto;
}
ul.social_TempatBlogging li {
display:inline;
float:left;
background-repeat:no-repeat;
}
ul.social_TempatBlogging li a {
display:block;
width:50px;
height:50px;
padding-right:10px;
position:relative;
text-decoration:none;
}
ul.social_TempatBlogging li a strong {
font-weight:400;
position:absolute;
left:20px;
top:-1px;
color:#fff;
z-index:9999;
text-shadow:1px 1px 0 rgba(0,0,0,0.75);
background-color:rgba(0,0,0,0.7);
-moz-border-radius:3px;
-moz-box-shadow:0 0 5px rgba(0,0,0,0.5);
-webkit-border-radius:3px;
-webkit-box-shadow:0 0 5px rgba(0,0,0,0.5);
border-radius:3px;
box-shadow:0 0 5px rgba(0,0,0,0.5);
padding:3px;
}
ul.social_TempatBlogging li.abfacebook {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg1ga_Gj1UFLNpH-6bLjht6OI5brUByCbJMbVsiwQzKh6q-KJ26-cLZxn2T6x0I7wtA9SDt-BWPF6nT8yRET1T9AuZfkZfCRUnCSIpAHrPp0Juprha8QaYg9MgjGGyipFSGkeK6MSo_YfaV/s1600/TempatBlogging-facebook-icon.png);
}
ul.social_TempatBlogging li.abtwitter {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhueDIMgqRiSpVHaAqpPEfso9EqdXYM68hGX8vErzwWOjwC_itHGQtNzCucBcpEUy92QcsLXlfGW7pZ2k_5rafr-yv1Hi_gd-OsDS-Bt7U3yNc3xieHJAR5WYK1Jmalp6d25fIBkLrabR9F/s1600/TempatBlogging-twitter-icon.png);
}
ul.social_TempatBlogging li.abgoogleplus {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgm8aRJyaccHJXwJ8aEj-ugrkUGR_9XSohJI2MwLLE0_O7Ok2i5sT27bnrmfySfoYCTTpNljZ_iPUsqtbb6-IG-y6_fBpL9z9oU61eJ3_1bQrO3bFKPWnCL0ClOVtr91VCaRVYGlUkvzCpY/s1600/TempatBlogging-google-icon.png);
}
ul li.abpinterest {
background-image: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgw0PQpjcU_Jv3Qzfee6PEFtgrYCMWRlaY6jXqIQzKjg4K4fDbz7IzwDbyhlc4Pusik0v6YRnIABIjnzCE8JmGbxoyOnQNEkxI7xXBWTw-SOGOYlGDnVLymnNrhYYvPNwuAJ7ispt661PVf/s1600/TempatBlogging-Pinterest-icon.png);
}
ul.social_TempatBlogging li.abstumbleupon {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgh7G0olvatXwFsd9ymJlf43vosBwYKEjAUSd082wkinWMcL77N6rGxmPSpCgasVAzXmqKfz79QJ7fs1gWuk2nXqWqoUovgiLiK7Gw81A8LsQ06TmRAlS_NLteJDG9Jgds-I7nSp2nW1oJF/s1600/TempatBlogging-StumbleUpon-icon.png);
}
ul.social_TempatBlogging li.abdig {background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjE0HLE65m5_qQOffbZrYMANXb25nTsf5-jV3mBWlYdCiXuKqz12nRJH8hj65-a5MFiTXhpehpqkT-CNM4eEBRGyMKHJxqnGUbKB6Q3-s2T0SsXKZWXgRvxaj7movoCmNEXMm3xfPzvSL-r/s1600/TempatBlogging-Digg-icon.png);
}
ul.social_TempatBlogging li.ablinkedin {
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjshDCCY7GElTZ7FWeej7qDPVBrdYO3eUSAWvNyROJZ1lESHy4osLAfF7XStCthLnIC4vKPBBBylX1_4biqHylQIKlZl7VPLroMxdE4U3aTGfs0ovyFyCUrtkc4kjIWDTsuotX4xhoUN0UF/s1600/TempatBlogging-Linkedin-icon.png);
}
#animation_TempatBlogging:hover li {
opacity:0.2;
}
#animation_TempatBlogging li {
-webkit-transition-property:opacity;
-webkit-transition-duration:500ms;
-moz-transition-property:opacity;
-moz-transition-duration:500ms;
}
#animation_TempatBlogging li a strong {
opacity:0;
-webkit-transition-property:opacity, top;
-webkit-transition-duration:300ms;
-moz-transition-property:opacity, top;
-moz-transition-duration:300ms;
}
#animation_TempatBlogging li:hover {
opacity:1;
}
#animation_TempatBlogging li:hover a strong {
opacity:1;
top:-10px;
}
6. Paste kode di bawah Sebelum tag <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>7. Simpan Template Anda.
<div style='font-size: 22px;'><b>Share this article with your friends.</b></div>
<ul class='social_TempatBlogging' id='animation_TempatBlogging'>
<li class='abfacebook'>
<a expr:href='"http://www.facebook.com/share.php?v=4&src=bm&u=" + data:post.url + "&t=" + data:post.title ' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow'><strong>Facebook</strong></a>
</li>
<li class='abtwitter'>
<a expr:href='"http://twitter.com/home?status=" + data:post.title + " -- " + data:post.url ' rel='nofollow' target='_blank'><strong>Twitter</strong></a>
</li>
<li class='abgoogleplus'>
<a expr:href='"https://plusone.google.com/_/+1/confirm?hl=en&url=" + data:post.url' onclick='window.open(this.href,'sharer','toolbar=0,status=0,width=626,height=436'); return false;' rel='nofollow' target='_blank'><strong>Google+</strong></a>
</li>
<li class='abpinterest'>
<a href='javascript:void((function()%7Bvar%20e=document.createElement('script');e.setAttribute('type','text/javascript');e.setAttribute('charset','UTF-8');e.setAttribute('src','http://assets.pinterest.com/js/pinmarklet.js?r='+Math.random()*99999999);document.body.appendChild(e)%7D)());' rel='nofollow' target='_blank'><strong>Pinterest</strong></a>
</li>
<li class='abstumbleupon'>
<a expr:href='"http://www.stumbleupon.com/submit?url=" + data:post.url + "&title=" + data:post.title ' rel='nofollow' target='_blank'><strong>StumbleUpon</strong></a>
</li>
<li class='abdig'>
<a expr:href='"http://digg.com/submit?url=" + data:post.url + "&title=" + data:post.title' rel='nofollow' target='_blank'><strong>Dig</strong></a>
</li>
<li class='ablinkedin'>
<a expr:href='"http://www.linkedin.com/shareArticle?mini=true&url=" + data:post.url + "&title=" + data:post.title + "&summary=&source="' rel='nofollow' target='_blank'><strong>LinkedIn</strong></a>
</li>
</ul>
</b:if>
Langganan:
Posting Komentar (Atom)
Search
sponsor
Popular Posts
-
Login ke blogger.com Masuk ke bagian Layout / Design Klik Tambahkan Widget . Pilih HTML/Javascript . Copy Kode dibawah ini dan Pastekan di H...
-
Buka akun blogger Anda Masuk ke menu Tata Letak >> Add gadget >> HTML/Javascript Pastekan kode dibawah ini : <style> #s...
-
Pergi ke Blogger.com >> Situs Anda . Klik Template >> Edit HTML . Sekarang Anda baru masuk dalam Blogger HTML Editor tekan ...
Blog Archive
-
▼
2014
(8)
-
▼
Mei
(8)
- Cara Membuat Recent Post Terbaru
- Cara Membuat Floating Social Media di Sisi Blog
- Widget Push Button Media Sosial Dan Rss Subscribe
- Widget Social Subscription Keren Warna Biru
- Widget Sharing Social Dibawah Post Blogger
- Widget Social Media Efek Flipboard Untuk Blogger
- Membuat Widget Recent Post Berupa Gambar Kotak
- Membuat Artikel Terkait dengan Thumbnail
-
▼
Mei
(8)


0 komentar:
Posting Komentar