GẮN HỘP GIỚI THIỆU CHO BLOG LIÊN KẾT

Để phát triển cộng đồng Blogger và để giao lưu học hỏi với các Web/Blog khác, các bạn có thể gắn liên kết các Web/Blog vào Blog của mình.

Có nhiều cách để gắn liên kết như: liên kết bằng địa chỉ URL hoặc bằng hình ảnh...v...v...

Trong giới hạn bài viết này, tôi chia sẻ với các bạn một tiện ích nhỏ cho việc gắn liên kết, sử dụng tiện ích này bạn sẽ tiết kiệm được khá nhiều không gian của blog mặc dù vậy nó vẫn hiển thị đầy đủ các yêu cầu gắn liên kết của bạn.

Thủ thuật này sẽ tạo ra một hộp nhỏ chứa đựng các đường link mà mình muốn liên kết. Khi khách tham quan bấm vào mũi tên nằm ở bên phải của hộp thì hộp sẽ xổ dọc xuống tất cả các tên Web/Blog mà bạn đã liên kết, ứng với mỗi tên Web/Blog là một vài dòng giới thiệu mô tả phía dưới của hộp nhằm để khách tham quan có thể dễ dàng lựa chọn chủ đề mà mình muốn xem từ Web/Blog đã liên kết.

Bạn bấm vào "Xem thử" phía dưới để thấy rõ hơn thủ thuật này.

Xem thử

Thủ thuật này cũng khá đơn giản, bạn chỉ việc đăng nhập vào Blog > Chọn thiết kế > Thêm tiện ích HTML (đối với các bạn đang sử dụng giao diện blog mới thì bạn đăng nhập vào Blog > Chọn Bố cục > Thêm tiện ích HTML) rồi dán code phía dưới vào.

<center>

<form name="combowithtext">

<select name="example" size="1" onchange="showtext()">

<option value="địa chỉ link liên kết 0" />Tên Web/blog liên kết 0

<option value="địa chỉ link liên kết 1" />Tên Web/blog liên kết 1

<option value="địa chỉ link liên kết 2" />Tên Web/blog liên kết 2

<option value="địa chỉ link liên kết 3" />Tên Web/blog liên kết 3

<option value="địa chỉ link liên kết 4" />Tên Web/blog liên kết 4

<option value="địa chỉ link liên kết 5" />Tên Web/blog liên kết 5

<option value="địa chỉ link liên kết 6" />Tên Web/blog liên kết 6

</select>

<input type="button" value="OK!"

onclick="gothere()" /><br />

<textarea rows=5 cols=30 wrap="virtual" name="text"></textarea>

<script language="javascript">

<!--

var shortcut=document.combowithtext

var descriptions=new Array()

//extend this list if neccessary to accomodate more selections

descriptions[0]="nhập dòng giới thiệu cho link liên kết 0 vào đây"

descriptions[1]="nhập dòng giới thiệu cho link liên kết 1 vào đây"

descriptions[2]="nhập dòng giới thiệu cho link liên kết 2 vào đây"

descriptions[3]="nhập dòng giới thiệu cho link liên kết 3 vào đây"

descriptions[4]="nhập dòng giới thiệu cho link liên kết 4 vào đây"

descriptions[5]="nhập dòng giới thiệu cho link liên kết 5 vào đây"

descriptions[6]="nhập dòng giới thiệu cho link liên kết 6 vào đây"

shortcut.text.value=descriptions[shortcut.example.selectedIndex]

function gothere(){

location=shortcut.example.options[shortcut.example.selectedIndex].value

}

function showtext(){

shortcut.text.value=descriptions[shortcut.example.selectedIndex]

}

//-->

</script>

</form>

</center>

Bây giờ, bạn thay đổi các dòng lệnh màu đỏ để phù hợp với blog mình.

Mở rộng thêm:

Ở đoạn code phía trên có tất cả là 7 đường link liên kết (tính luôn số 0), vì vậy nếu bạn muốn nhiều hơn thì copy dòng lệnh này:

<option value="địa chỉ link liên kết" />Tên Web/Blog liên kết

Dán trên thẻ </select> phía trên.

Tiếp tục copy dòng lệnh này:

descriptions[7]="nhập dòng giới thiệu vào đây"

Dán vào phía dưới và thay đổi số thứ tự nằm trong ngoặc theo số tiến dần.

Ví dụ: Tôi muốn thêm 2 link liên kết nữa thì code sẽ giống như thế này:

<center>

<form name="combowithtext">

<select name="example" size="1" onchange="showtext()">

<option value="địa chỉ link liên kết 0" />Tên Web/blog liên kết 0

<option value="địa chỉ link liên kết 1" />Tên Web/blog liên kết 1

<option value="địa chỉ link liên kết 2" />Tên Web/blog liên kết 2

<option value="địa chỉ link liên kết 3" />Tên Web/blog liên kết 3

<option value="địa chỉ link liên kết 4" />Tên Web/blog liên kết 4

<option value="địa chỉ link liên kết 5" />Tên Web/blog liên kết 5

<option value="địa chỉ link liên kết 6" />Tên Web/blog liên kết 6

<option value="địa chỉ link liên kết 7" />Tên Web/blog liên kết 7

<option value="địa chỉ link liên kết 8" />Tên Web/blog liên kết 8

</select>......

descriptions[0]="nhập dòng giới thiệu cho link liên kết 0 vào đây"

descriptions[1]="nhập dòng giới thiệu cho link liên kết 1 vào đây"

descriptions[2]="nhập dòng giới thiệu cho link liên kết 2 vào đây"

descriptions[3]="nhập dòng giới thiệu cho link liên kết 3 vào đây"

descriptions[4]="nhập dòng giới thiệu cho link liên kết 4 vào đây"

descriptions[5]="nhập dòng giới thiệu cho link liên kết 5 vào đây"

descriptions[6]="nhập dòng giới thiệu cho link liên kết 6 vào đây"

descriptions[7]="nhập dòng giới thiệu cho link liên kết 7vào đây"

descriptions[8]="nhập dòng giới thiệu cho link liên kết 8 vào đây"

shortcut.text.....

</center>

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

▀▄▀▄▀▄ dunghennessy.blogspot.com ▄▀▄▀▄▀