Home Blog THỦ THUẬT [ Blogger ] Bộ Nút Like ,Nút Share Sau Hình Lá Cờ

[ Blogger ] Bộ Nút Like ,Nút Share Sau Hình Lá Cờ

http://khophanmem0022.blogspot.com/ 03:46 Blog , THỦ THUẬT Edit

***

Chia sẻ tới các bạn bộ nút Like , nút Share bài viết sau những lá cờ nhỏ ..sẽ tạo cảm giác thú vị khi người xem dê chuột tới :

Ảnh Demo:

Các bước thực hiện :

-B1: Đăng nhập vào blogspot => Bố cục => Thêm Tiện ích =>HTML/Javascripts rồi copy đoạn code sau !!

<style>
.social-share-top {
    background: none repeat scroll 0 0 #CCCCCC;
    float: left;
    height: 62px;
    margin: 0 3px;
    width: 62px;
}
.social-share-top .soc-item {
    margin-top: 11px;
    opacity: 0;
}
.twitter-top-share {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEgq88BuXj9HyIZ3ikHbuORhJ082cLk117Q1S26i1RYANF9jrQhpqSiiitTX_Asf5NW05gqMIf4DbFI_m0KAWXEQniD0aMA9QXHXaV2vGVR4RDHBD7AX7ML-f-VwCgnYbLevL3vsnb-OM/s1600/social-icon-namkna-blog.png") no-repeat scroll 0 0 transparent;
}
.twitter-top-share:hover .soc-item {
    opacity: 1;
}
.twitter-top-share:hover {
    background: none repeat scroll 0 0 transparent;
}
.facebook-top-share {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEgq88BuXj9HyIZ3ikHbuORhJ082cLk117Q1S26i1RYANF9jrQhpqSiiitTX_Asf5NW05gqMIf4DbFI_m0KAWXEQniD0aMA9QXHXaV2vGVR4RDHBD7AX7ML-f-VwCgnYbLevL3vsnb-OM/s1600/social-icon-namkna-blog.png") no-repeat scroll -134px 0 transparent;
}
.facebook-top-share:hover .soc-item {
    opacity: 1;
}
.facebook-top-share:hover {
    background: none repeat scroll 0 0 transparent;
}
.google-top-share {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEgq88BuXj9HyIZ3ikHbuORhJ082cLk117Q1S26i1RYANF9jrQhpqSiiitTX_Asf5NW05gqMIf4DbFI_m0KAWXEQniD0aMA9QXHXaV2vGVR4RDHBD7AX7ML-f-VwCgnYbLevL3vsnb-OM/s1600/social-icon-namkna-blog.png") no-repeat scroll -68px 0 transparent;
}
.google-top-share:hover .soc-item {
    opacity: 1;
}
.google-top-share:hover {
    background: none repeat scroll 0 0 transparent;
}
.share-top-share {
    background: url("https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiEgq88BuXj9HyIZ3ikHbuORhJ082cLk117Q1S26i1RYANF9jrQhpqSiiitTX_Asf5NW05gqMIf4DbFI_m0KAWXEQniD0aMA9QXHXaV2vGVR4RDHBD7AX7ML-f-VwCgnYbLevL3vsnb-OM/s1600/social-icon-namkna-blog.png") no-repeat scroll -270px 0 transparent;
}
.share-top-share:hover .soc-item {
    opacity: 1;
}
.share-top-share:hover {
    background: none repeat scroll 0 0 transparent;
}
.addthis_floating_style.addthis_counter_style {
    padding: 0 !important;
}
</style>
<div style="display:block; width: 300px; height:69px; border-bottom: 3px solid #ff6a40; margin-top:15px;" class="sectionAd">
<div style="margin: -12px 14px 2px">
<div class="social-share-top facebook-top-share">
<div class="soc-item">
<iframe src="//www.facebook.com/plugins/like.php?href=http://sinhvienviet360.blogspot.com/&send=false&layout=box_count&width=44&show_faces=false&font&colorscheme=light&action=like&height=90&appId=294310977347137" style="border:none; overflow:hidden; width:54px; height:60px;" allowtransparency="true" frameborder="0" scrolling="no"></iframe>
</div>
</div>
<div class="social-share-top google-top-share">
<div class="soc-item">
    <xen:if is="{$xenOptions.plusone}">
        <div class="plusone shareControl">
            <div id="___plusone_2" style="text-indent: 0px; margin: 0px; padding: 0px; background: none repeat scroll 0% 0% transparent; border-style: none; float: none; line-height: normal; font-size: 1px; vertical-align: baseline; display: inline-block; width: 50px; height: 60px;">
<iframe title="+1" data-gapiattached="true" src="https://apis.google.com/u/0/_/+1/fastbutton?usegapi=1&bsv=o&count=true&size=tall&hl=vi-VN&origin=http%3A%2F%2Fsinhvienviet360.blogspot.com/&url=http%3A%2F%2Fsinhvienviet360.blogspot.com/%2F&gsrc=3p&jsh=m%3B%2F_%2Fscs%2Fapps-static%2F_%2Fjs%2Fk%3Doz.gapi.vi.Qdj2g3tOcX8.O%2Fm%3D__features__%2Fam%3DIQ%2Frt%3Dj%2Fd%3D1%2Frs%3DAItRSTPKKLYAlxtiNS76Jw9oophWOmv-3Q#_methods=onPlusOne%2C_ready%2C_close%2C_open%2C_resizeMe%2C_renderstart%2Concircled%2Cdrefresh%2Cerefresh%2Conload&id=I2_1389940686204&parent=http%3A%2F%2Fsinhvienviet360.blogspot.com/&pfname=&rpctoken=10456990" name="I2_1389940686204" id="I2_1389940686204" vspace="0" tabindex="0" style="position: static; top: 0px; width: 50px; margin: 0px; border-style: none; left: 0px; visibility: visible; height: 60px;" marginwidth="0" marginheight="0" hspace="0" frameborder="0" scrolling="no" width="100%"></iframe></div>
</div>
</xen:if>
</div>
</div>
<div class="social-share-top twitter-top-share">
<div class="soc-item">
   <xen:if is="{$xenOptions.tweet.enabled}">
    <div class="tweet shareControl">
      <a class="addthis_button_tweet" tw:count="vertical"></a>>

<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
    </div>
</xen:if>
</div>
</div>
<div class="social-share-top share-top-share">
<div class="soc-item">

<div class="addthis_toolbox addthis_default_style ">
<a href="#" style="display: block;" class="addthis_counter"><a href="#" title="View more services" target="_blank" class="addthis_button_expanded">0</a><a class="atc_s addthis_button_compact"><span></span></a></a>
<div class="atclear">
</div>
</div>
<script type="text/javascript" src="http://s7.addthis.com/js/250/addthis_widget.js#pubid=xa-4fcc0e503f99ef6b"></script>
</div>
</div>
</div>
</div>
<iframe src="//www.facebook.com/plugins/like.php?href=http%3A%2F%2Fwww.facebook.com%2Fhttp://sinhvienviet360.blogspot.com/&width=300&height=80&colorscheme=light&layout=standard&action=like&show_faces=true&send=false&appId=340580066059320" style="border:none; overflow:hidden; width:300px; height:80px;" allowtransparency="true" frameborder="0" scrolling="no"></iframe>

Các bạn thay đổi sinhvienviet360.blogspot.com thành blog của bạn nhé!!
-B2 : Save lại !

Chúc các bạn thành công !!

Share this:

ABOUT THE AUTHOR

Hello We are OddThemes, Our name came from the fact that we are UNIQUE. We specialize in designing premium looking fully customizable highly responsive blogger templates. We at OddThemes do carry a philosophy that: Nothing Is Impossible

Copyright 2014 SINH VIÊN VIỆT.

Designed by OddThemes | Published By Gooyaabi Templates