Chia sẽ button share hiệu ứng hover khi rê chuột đẹp cho blogspot

Chia sẽ button share hiệu ứng hover khi rê chuột đẹp cho blogspot

Chia sẽ button share hiệu ứng hover khi rê chuột đẹp cho blogspot

Rảnh nên chia sẽ cho mọi người button share hiệu ứng khá đẹp do mình edit cho mọi người cùng sử dụng nhé ^^ CÁCH THỰC HIỆN: 1. Cách bạ...
Lê Bá Long Tác giả:
Xuất bản: 7/18/2018
Rảnh nên chia sẽ cho mọi người button share hiệu ứng khá đẹp do mình edit cho mọi người cùng sử dụng nhé ^^


CÁCH THỰC HIỆN:

1. Cách bạn chèn đoạn code bên dưới vào trước thẻ ]]></b:skin>
/*===============
= Social Box lebalongit
===================*/
.social-box{float:left;width:100%;display:inline-flex;}
.instagram{background-color:#458eff;}
.pinterest{background-color:#C92228;}
.reddit{background-color:#ff4500;}
.instagram,.pinterest,.reddit{width:20%;height:50px;border-radius: 20px;}
.instagram a,.pinterest a,.reddit a{display:block;text-decoration:none;font-size:10px;padding: 8px 0 30px 0;text-align:center;width:68%;margin:auto;}
.instagram a i,.pinterest a i,.reddit a i{display:block;font-size:2em;padding:5px;background-color:#fff;border-radius:10px;width:20px;text-align:center;margin:0 auto;margin-bottom:20px;border:solid 3px #fff;-webkit-transform:rotate(-25deg);-moz-transform:rotate(-25deg);-o-transform:rotate(-25deg);transform:rotate(-25deg);}
.instagram a i{color:#458eff;}
.pinterest a i{color:#C92228;}
.reddit a i{color:#ff4500;}
.instagram:hover i,.pinterest:hover i,.reddit:hover i{color:#fff;border-radius:50px;background-color:transparent;margin-bottom:15px;-webkit-transform:rotate(-0deg);-moz-transform:rotate(-0deg);-o-transform:rotate(-0deg);transform:rotate(-0deg);}
2. Tiếp theo chèn code bên dưới vào nơi bạn muốn nó hiển thị thường là dưới thẻ tag:
  <b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='social-box'><span>Share:</span>
<div class='instagram'>
<a class='wow slideInUp animated' expr:href='&quot;http://www.facebook.com/sharer.php?u=&quot; + data:post.url + &quot;&amp;title=&quot;+ data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=600, height=400, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' style='visibility: visible; animation-name: slideInUp;' target='_blank'><i class='fa fa-facebook-official'/></a>
</div>
<div class='pinterest'>
<a class='wow slideInUp animated' expr:href='&quot;https://plus.google.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=600, height=400, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' style='visibility: visible; animation-name: slideInUp;' target='_blank'><i class='fa fa-google-plus'/></a>
</div>
<div class='reddit'>
<a class='wow slideInUp animated' expr:href='&quot;http://twitter.com/share?url=&quot; + data:post.url + &quot;&amp;title=&quot; + data:post.title' onclick='window.open(this.href, &apos;windowName&apos;, &apos;width=600, height=400, left=24, top=24, scrollbars, resizable&apos;); return false;' rel='nofollow' style='visibility: visible; animation-name: slideInUp;' target='_blank'><i class='fa fa-twitter'/></a>
</div>
</div>
</b:if>
Lời kết:
Chúc các bạn thành công nếu có thắc mắc hay yêu cầu gì bình luận ngay bên dưới nhé <3

Chia sẽ button share hiệu ứng hover khi rê chuột đẹp cho blogspot Chia sẽ button share hiệu ứng hover khi rê chuột đẹp cho blogspot Lê Bá Long8.8stars based on9reviewsRảnh nên chia sẽ cho mọi người button share hiệu ứng khá đẹp do mình edit cho mọi người cùng sử dụng nhé ^^ CÁCH THỰC HIỆN: 1. Cách bạ...

Blogger Comments

Hiện tại có 17 nhận xét:

  1. theme bá long it đang được dùng nhìu lắm

    Trả lờiXóa
  2. E nên tắt quảng cáo dạng popup vì nó gây ảnh hưởng đến ng đọc e ạ. Tỷ lệ thoát sẽ cao.
    #Góp #Ý

    Trả lờiXóa