Tiện ích Favicon Link Exchange cho Blogger

Trang chủ » Favicons » Bạn đang xem:

Tiện ích Favicon Link Exchange cho Blogger

Thứ Hai, 13 tháng 12, 2010

Trao đổi liên kết là một trong những cách làm tăng lượng truy cập cho blog và cũng giúp phổ biến blog của bạn ra cộng đồng dân cư mạng. Chắn hẳn bạn từng biết đến các kiểu trao đổi liên kết như Text Link Exchange, Logo Link Exchange, Banner Link Exchange.

Hôm nay xin giới thiệu một kiểu trao đổi liên kết mới là Favicon Link Exchange. Đây cũng là biển thể của Logo Link Exchange nhưng logo ở đây là icon 16x16 dưới các định dạng file như .ico, .png, .jpg, .gif. Với ý tưởng trao đổi liên kết bằng favicon là biểu tượng cho một blog, tôi tạo ra một tiện ích gọi là Favicon Link Exchange. Tiện ích này có thể đặt trong một tiện ích HTML/JavaScript hoặc đặt ở cuối bài viết.

Dưới đây là code cho tiện ích.

<table border="0" cellpadding="0" cellspacing="2" align="center">
<tbody><tr>
<td><a href="URL_Blog_1" target="_blank" title="Tiêu đề Blog_1"><img alt="" src="URL_favicon_Blog_1" class="favicon" title="Tiêu đề Blog_1" /></a></td>
<td><a href="URL_Blog_2" target="_blank" title="Tiêu đề Blog_2"><img alt="" src="URL_favicon_Blog_2" class="favicon" title="Tiêu đề Blog_2" /></a></td>
<td><a href="URL_Blog_3" target="_blank" title="Tiêu đề Blog_3"><img alt="" src="URL_favicon_Blog_3" class="favicon" title="Tiêu đề Blog_3" /></a></td>
…// bạn thêm vào theo định dạng HTML tương tự
…// bạn thêm vào theo định dạng HTML tương tự
<td><a href="URL_Blog_n" target="_blank" title="Tiêu đề Blog_n"><img alt="" src="URL_favicon_Blog_n" class="favicon" title="Tiêu đề Blog_n" /></a></td>
</tr>
</tbody></table>
<style type="text/css">
.favicon {width:16px;height:16px;padding: 2px;border: 1px solid #7b68ee;}
</style>

Việc bạn cần làm là lần lượt thay địa chỉ blog, tiêu đề blog và địa chỉ icon blog trong đoạn code ở trên.

* Nếu muốn đặt tiện ích trên sidebar thì đặt toàn bộ đoạn code ở trên trong một tiện ích HTML/JavaScript.

* Nếu muốn đặt tiện ích ở cuối bài viết thì khi chỉnh sửa HTML của Template, chọn Mở rộng mẫu tiện ích, đặt trước dòng ]]></b:skin> với đoạn code bên dưới.

.favicon {width:16px;height:16px;padding: 2px;border: 1px solid #7b68ee;}

Sau đó tìm dòng <div class='post-footer-line post-footer-line-3'> rồi đặt trước nó với đoạn code bên dưới.

<b:if cond='data:blog.pageType == "item"'>
<table border="0" cellpadding="0" cellspacing="2" align="center">
<tbody><tr>
<td><a href="URL_Blog_1" target="_blank" title="Tiêu đề Blog_1"><img alt="" src="URL_favicon_Blog_1" class="favicon" title="Tiêu đề Blog_1" /></a></td>
<td><a href="URL_Blog_2" target="_blank" title="Tiêu đề Blog_2"><img alt="" src="URL_favicon_Blog_2" class="favicon" title="Tiêu đề Blog_2" /></a></td>
<td><a href="URL_Blog_3" target="_blank" title="Tiêu đề Blog_3"><img alt="" src="URL_favicon_Blog_3" class="favicon" title="Tiêu đề Blog_3" /></a></td>
…// bạn thêm vào theo định dạng HTML tương tự
…// bạn thêm vào theo định dạng HTML tương tự
<td><a href="URL_Blog_n" target="_blank" title="Tiêu đề Blog_n"><img alt="" src="URL_favicon_Blog_n" class="favicon" title="Tiêu đề Blog_n" /></a></td>
</tr>
</tbody></table>
</b:if>

Copy bài viết: