Hướng dẫn Social network icon in sidebar - Biểu tượng mạng xã hội trong sidebar

PVS

Cộng Sự Đặc Biệt
Thành viên BQT
Tham gia
28/02/2015
Bài viết
14,799
Được Like
11,093
Social network icon in sidebar - Biểu tượng mạng xã hội trong sidebar

Bài viết này sẽ chỉ cho bạn làm thế nào để đặt các biểu tượng mạng xã hội trong sidebar. Chỉ muốn cho bạn biết rằng biểu tượng đi kèm với kích thước khác nhau để đáp ứng nhu cầu diễn đàn của bạn và nó rất đẹp (biểu tượng HD)

Capture.PNG

Cài đặt:
1. Tải về và giải nén tập tin đính kèm.
2. Tìm các biểu tượng bạn cần với bất kỳ kích thước nào bạn muốn
3. Sau đó tải nó lên hosting của bạn để có được url hình ảnh
4. Chèn đoạn mã sau dưới đây vào sidebar của bạn
Mã:
<style type='text/css'>
.social ul {list-style:none; display:inline}
.social li {float:left;padding: 0px 1px 0px 0px; margin-top:-4px}
.social li a img{height:59px;width:59px}
</style>
<div class='social'>
<a href="your_social_network_url"><img  src="your_social_network_icon_url" /></a>
<a href="your_social_network_url"><img  src="your_social_network_icon_url" /></a>
<a href="your_social_network_url"><img src="your_social_network_icon_url" /></a>
<a href="your_social_network_url"><img src="your_social_network_icon_url" /></a>
</div>

Đừng quên chỉnh sửa đoạn code trên.

Ví dụ:
Mã:
<style type='text/css'>
.social ul {list-style:none; display:inline}
.social li {float:left;padding: 0px 1px 0px 0px; margin-top:-4px}
.social li a img{height:59px;width:59px}
</style>
<div class='social'>
<center>
<a href="http://twitter.com/iXenforo"><img  src="http://i1057.photobucket.com/albums/t382/iXenforo/586bcd2d.png" /></a>
<a href="http://delicious.com/ixenforo"><img  src="http://i1057.photobucket.com/albums/t382/iXenforo/291a2a7f.png" /></a>
<a href="http://technorati.com/blogs/ixenforo.blogspot.com"><img src="http://i1057.photobucket.com/albums/t382/iXenforo/e7aae044.png" /></a>
<a href="http://feeds.feedburner.com/ixenforo"><img src="http://i1057.photobucket.com/albums/t382/iXenforo/0daeec71.png" /></a>
</center></div>

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


Nguồn: xenforo.com​
 

Đính kèm

  • Social Icon.zip
    20.5 KB · Lượt xem: 8
  • Like
Reactions: THB

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

XenForo 1 XenForo 2
Translate by PVS


Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Điện Lạnh Thịnh Phát
Top Bottom