Để 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.
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.....
Chúc các bạn thành công
4 nhận xét:
Sao không có chổ nào để chỉnh độ rộng của hộp tiện ích này vậy anh Dũng ?
Cái này hay lắm Anh Dũng ơi! Em cũng có tham khảo nhiều trang Blog về cách gắn liên kết. Nhưng những trang đó họ có làm nhưng không có phần giới thiệu về trang Blog cụ thể như cách Anh giới thiệu!
---------------
Em áp dụng cách của Anh và em thấy hài lòng về phần này!
-> Em chỉ có ý nhỏ này Anh nghiên cứu và phát triển lên chút ít nửa không biết được không!
+ Khi em click chuột vào OK thì nó mở một Tab mới hoàn toàn target='_blank' chứ không phải nó chuyển hướng từ trang của mình sang trang bạn!
+ OK Anh Dũng nhé!
----------------------------
Cảm ơn Anh một thủ thuật thật thú vị
Ok, yêu cầu của em khá hay để anh nghiên cứu thử nếu được anh sẽ đăng bài cho em tham khảo nha
Thanks
Tour Bà Nà Hills | Tour Hội An | Tour Ðà Nẵng | Tour Mỹ Son | Tour Hang Son Doong | Tour Da Nang City | Du Lịch Ðà Nẵng
Đăng nhận xét