Thanh Mạng xã hội chạy bên Forum

PVS

Cộng Sự Đặc Biệt
Thành viên BQT
Tham gia
28/02/2015
Bài viết
13,629
Được Like
9,662
Vào template--> thread_view
Thêm vào cuối:
Nhớ sửa link forum nhé!

Mã:
<div class="thh_ics thh_ics_tooltip">
    <a class="facebook" href="http://www.facebook.com/share.php?u=http://vnxf.vn/{xen:link threads, $thread}"><span>Facebook</span></a>
    <a class="google" href="https://www.google.com.vn/bookmarks/mark?op=add&amp;bkmk=http://vnxf.vn/{xen:link threads, $thread}&amp;title={$thread.title}&amp;annotation="><span>Google+</span></a>
    <a class="yahoo" href="ymsgr:im?+&amp;msg=Xem bài này đi: http://vnxf.vn/{xen:link threads, $thread} Gửi cho bạn bè nữa nha :x"><span>Yahoo!</span></a>
    <a class="zing" href="http://link.apps.zing.vn/pro/view/conn/share?u=http://vnxf.vn/{xen:link threads, $thread}"><span>ZingMe</span></a>
</div>

Thêm vào " thread_view.css":
Mã:
.thh_ics {
    left:50%;
    top:160px;
    position:fixed;
    z-index:5;
    width: 32px;
    margin-left:40%;
}
.thh_ics a {
    display: inline-block;
    width: 32px;
    height:32px;
    margin: 3px;
    vertical-align: middle;
    -o-transition: all .3s;
    -moz-transition: all .3s;
    -webkit-transition: all .3s;
    -ms-transition: all .3s;
}
.thh_ics a.facebook { background: url('images/facebook.png') left top no-repeat; }
.thh_ics a.google { background: url('images/google.png') left top no-repeat; }
.thh_ics a.yahoo { background: url('images/yahoo.png') left top no-repeat; }
.thh_ics a.zing { background: url('images/zing.png') left top no-repeat; }
.thh_ics a:hover { background-position: -32px; }
.thh_ics_tooltip a{
    float:left;
    position:Relative;
    margin-left:10px;
    margin-right:10px;
}
.thh_ics_tooltip a span{
    position:Absolute;
    top: 2px;
    left:120%;
    white-space:nowrap;
    font-size:12px;
    font-family:arial,sans-serif;
    padding:6px 10px;
    border-radius:3px;
    color:white;
    background-color:#101010;
    text-shadow:0 1px 0 rgba(0,0,0,0.7);
    box-shadow:0 1px 1px  rgba(0,0,0,1);
    visibility:hidden;
    opacity:0;
    -moz-transition:right 0.4s,opacity 0.4s ease;
    -webkit-transition:right 0.4s,opacity 0.4s ease;
    -o-transition:right 0.4s,opacity 0.4s ease;
    transition:right 0.4s,opacity 0.4s ease;
}
.thh_ics_tooltip a span:after{
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    bottom: 6px;
    left: -10px;
    border: 6px solid transparent;
    border-right: 7px solid #101010;
}
.thh_ics_tooltip a:hover span{
    visibility:visible;
    opacity:1;
}

Các bạn down file đính kèm về, giải nén ra rồi up tất cả ảnh vào forder images trong host nhé.

Demo:

1.PNG


Nguồn: 4vnn.com​
 

Đính kèm

  • MXH.zip
    19.3 KB · Lượt xem: 18
  • Like
Reactions: THB

THB

Admin - Founder
Thành viên BQT
Tham gia
25/02/2015
Bài viết
6,350
Được Like
3,935
dùng cái nào thì hay hơn?
 

1234

Thượng Đế
Tham gia
09/03/2015
Bài viết
33
Được Like
32
cho em hỏi cái likebox của gamesupport.vn là cái gì vậy bác ?, chỉ em với.Pls
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Hosting Giá rẻ

hosting free
hosting free
Top Bottom