Tạo hộp list liên kết cho Blogger

CODE 1

<style type="text/css">

#anhbiafacebook{margin:0; padding: 0; height:238px; overflow: auto; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpxo4yJskBBrJ5dKPMjs9-us2-InPC-YqvfHPYKT8vzA6zK5IpvjW73seJoAu0XHCpJLgqbatShn5BSivxNo9V_R2gz04Q-d5PTDnsELWqxGqoLrZvKDweIYB5S2BXIshIdJOISscNPSrX/s1600/lienketblogger.jpg) no-repeat bottom right; font-weight:bold}

#anhbiafacebook p {margin:0; padding:2px 10px}

.favicon {width:50px; height:40px; margin-right:5px}

.connect {width:48px; height:48px; margin:5px 10px -15px 0}

</style>

<marquee align='left' direction='up' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' height='100' width='60%'>

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEh_PktgW2l21crl4hnn4Is8orNYSFG74BSzV2qX_70B2QXjFEry9rE7wJ8DwmpoVl4K738LGYZCkKRhn9x9N43raqFniCUhbY11q7nx0tc1VorYqY6kxuU7gOZKoROcHNkTzzzSjfv_jcA/s1600/RONG+BIEN.jpg" class="favicon" /> <a href="http://suoinganthong.blogspot.com/2013/11/ve-ep-vinh-cam-ranh....html" target="_blank">Vẻ đẹp Vịnh Cam Ranh...

</a><hr />

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi4a9dmtt6DZOORAMhkeMrhO7MaNMV4HwPmvD8svydaWaDTdMqAvzNZaRtYU9tGnXHGJY8I6cBmmvmDhRMg0OeL3lsO2nu-GCB7OEXvIcMwk4C6dwrPIS2fGOij3iarCB4rNLtHGQDXQVA/s1600/NT2.jpg" class="favicon" /> <a href="http://suoinganthong.blogspot.com/2013/08/chieu-nha-trang-bien-goi.html" target="_blank">Chiều Nha Trang biển gọi

</a><hr />

<img src="http://anhdep.anhsaokhuya.net/anh-dep-tinh-yeu/anhsaokhuya.net%20(47).gif" class="favicon" /> <a href="http://suoinganthong.blogspot.com/2012/09/vo-gia-cung-co-gia.html" target="_blank">Vo gia cũng có giá

</a><hr />

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi3PaaGvW4C0uFz6YIAuoo4Za7nPNQnzTsLaf28WfLajEpml5Y09XtWEUo2TYJmLxTV1p3acDAMt89gpyTBP_9grZdLRtwLT5ZPJNyLBIzFaDERgVlGdsdoQ507K4gXQJWvTOT0jk0a9LA/s320/DSC02206.JPG" class="favicon" /> <a href="http://suoinganthong.blogspot.com/2013/07/kuala-lumpur-mot-goc-nhin_4.html" target="_blank">Kuala Lumpur một góc nhìn

</a><hr />

<img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg-rSuqNzJxsrwfoLynZ03bKZx5drDhZXF2NO_IRDEAdLfR2tAZ_0uvgaavH_EelDR_tOdD4PpFi7uDHjlE_s8ynzyKe_9DET1oA4NPKkof069TCP4g7uaXFBUudS2Crte1V_-_cnRtIG47/s1600/0162.gif" class="favicon" /> <a href="http://suoinganthong.blogspot.com/2013/05/blog-post.html" target="_blank">Đường xưa không lối

</a><hr />

</marquee></div>

Nếu không kèm theo hinh sử dụng code sau

<div class="nganthong">

<div class="tieude">
Tên của ô chạy</div>
<div class="flexcroll" id="mycustomscroll">
<marquee direction="up" onmouseout="this.start()" onmouseover="this.stop()" scrollamount="2" scrolldelay="98">
<ul>
<li><a href="Link bài viết 1">Tên bài viết 1</a></li>
<li><a href="Link bài viết 2">Tên bài viết 2</a></li>
<li><a href="Link bài viết 3">Tên bài viết 3</a></li>
<li><a href="Link bài viết 4">Tên bài viết 4</a></li>
</ul>
</marquee></div>
</div>

CODE2

<style type="text/css"> 
#anhbiafacebook{margin:0; padding: 0; height:238px; overflow: auto; background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhpxo4yJskBBrJ5dKPMjs9-us2-InPC-YqvfHPYKT8vzA6zK5IpvjW73seJoAu0XHCpJLgqbatShn5BSivxNo9V_R2gz04Q-d5PTDnsELWqxGqoLrZvKDweIYB5S2BXIshIdJOISscNPSrX/s1600/lienketblogger.jpg) no-repeat bottom right; font-weight:bold}
#anhbiafacebook p {margin:0; padding:2px 10px}
.favicon {width:16px; height:16px; margin-right:5px}
.connect {width:48px; height:48px; margin:5px 10px -15px 0}
</style>
<div id="anhbiafacebook">
<center style="margin-bottom:25px"><a href="http://anhbiafacebook.blogspot.com/p/lien-ket-blogger.html">LIÊN KẾT BLOGGER</a></center>

<marquee align='left' direction='up' onmouseout='this.start()' onmouseover='this.stop()' scrollamount='2' height='165' width='100%'>

<img src="http://anhbiafacebook.blogspot.com/favicon.ico" class="favicon" /> <a href="http://anhbiafacebook.blogspot.com/" target="_blank">Ảnh bìa Faceboook
</a><hr />
<img src="http://vnwindows8.blogspot.com/favicon.ico" class="favicon" /> <a href="http://vnwindows8.blogspot.com/" target="_blank">Thủ thuật Windows 8
</a><hr />
</marquee></div>

Lưu ý:
+ Link màu tím: Là địa chỉ thông báo "liên kết site" của bạn.
+ Link màu xanh: Địa chỉ hình favicon của site bạn muốn liên kết (Nếu là Blogspot thì đều có dạng link này)
+ Link màu xanh đậm: URL site bạn muốn liên kết
+ Dòng chữ màu đỏ: Tên site bạn muốn liên kết
+ Nếu muốn thêm liên kết site mới thì chỉ việc chèn thêm đoạn code mình đã tô màu nền.

Tạo hộp list liên kết cho Blogger
CODE

<center><select onchange="if (this.value != '#') window.open(this.value, '_blank');" style="font-family: Arial; font-size: 8pt; height: 23; width: 150">
<option value="#" />--Website--
<option value="http://www.4shared.com/account/home.jsp#dir=dRspDTFv" />4shared<option value="http://vi.netlog.com/thong_ngan" />Netlog nganthong
<option value="http://mathophanglang.blogtiengviet.net/?cat=698899" />Mạt hồ phẳng lặng Bog
<option value="http://pics.bloghaikich.com" />Funny Pictures
<option value="http://www.hotgirl9x.com" />Hot Girls 9x
<option value="http://demkhongngu.com" />Diễn đàn Kết bạn
</select></center>

Nguồn http://suoinganthong.blogspot.com/

Bạn có thể xem thêm các bài:

Những Code Thông Dụng Cho Blogspot

Cách thêm tiện ích (widget) vào vị trí bất kỳ trong blogspot

Code tạo hình nền và chia cột cho bài viết Blog

Socializer Widget by Nguyen D. Khanh

SOCIALIZE IT →

Tweet

FOLLOW US →

SHARE IT →

Các bạn có thể tham khảo thêm nhiều kiến thức từ các bài viết mà mình đã SEO bằng các Từ khóa bên dưới bài đăng nầy để tìm hiểu thêm về các khái niệm và ứng dụng có liên quan nhé..