Hướng dẫn cách tối ưu đường dẫn trang Nhãn (Label) cho Blogspot

huong dan cach toi uu url trang nhan label cho blogspot

Nếu bạn đã và đang sử dụng nền tảng Blogger.com để làm trang cá nhân thì ắt hẳn bạn cũng biết một điều là các đường dẫn (URLs) của các trang nhãn trông chẳng đẹp tí nào nếu như bạn để ở dạng tiếng Việt có dấu.

Do đó, thủ thuật này rất có ích khi các bạn muốn làm cho đường dẫn trang nhãn của bạn trông đẹp hơn, chuyên nghiệp hơn trong mắt người đọc và cả cho chính bạn nữa.

Để xem DEMO, bạn có thể nhấn vào đường dẫn một nhãn bất kỳ trong Socbay Blogs để xem đường dẫn đó đã được tối ưu như thế nào nhé!

Nguyên tắc hoạt động

Cách thức hoạt động của thủ thuật này rất đơn giản. Về nguyên tắc, nhãn của bạn vẫn sẽ giữ nguyên cấu trúc của nó và nhãn đó sẽ được hiển thị thay thế bởi một cụm từ mà bạn muốn nhờ vào một đoạn mã Javascript.

Vì thế, trước khi thực hiện thì bạn hãy đổi các nhãn của bạn sang dạng tối ưu trước. Ví dụ, bạn hãy đổi nhãn từ "Thủ thuật Blogspot" sang "thu-thuat-blogspot".

Các bước thực hiện tối ưu URL trang nhãn Blogspot

Bước 1. Đăng nhập vào tài khoản Blogger > Chủ đề > Chỉnh sửa HTML.

Bước 2. Sao chép đoạn mã Javascript dưới đây rồi dán chúng vào giữa hai thẻ <body></body>, nhưng tốt nhất là nên đặt vào trước thẻ đóng </body>.

<script type='text/javascript'>
//<![CDATA[ 
$(".socbay-labels").each(function() {
var text = $(this).text();
text = text.replace("thu-thuat-blogspot", "Thủ thuật Blogspot");
/* Bạn có thể thêm các đối tượng khác ở đây */
$(this).text(text);
});
//]]>
</script>

Trong đoạn mã trên, bạn hãy chú ý một số điểm sau:

  • .socbay-labels: đây chính là thẻ chứa tên nhãn của bạn (hãy tìm thẻ gần nhất chứa nhãn của bạn).
  • thu-thuat-blogspot: đây chính là nhãn thật trong bài viết của bạn.
  • Thủ thuật Blogspot: đây chính là nhãn thay thế cho nhãn thật để trông đẹp hơn.
  • Ngoài ra, bạn có thể làm cho nhiều nhãn khác bằng cách chép đoạn mã chứa đối tượng thành nhiều bản rồi sau đó điều chỉnh cho phù hợp.

Để dễ hiểu hơn, bạn có thể xem đoạn mã ví dụ dưới đây (cái này chỉ là ví dụ nên có thể khác với của bạn).

<b:if cond='data:post.labels'> CHỦ ĐỀ:
<b:loop values='data:post.labels' var='label'>
<a expr:href='data:label.url' rel='tag'>
<span class='socbay-labels'>
<data:label.name/>
</span>
</a>
<b:if cond='data:label.isLast != &quot;true&quot;'>,
</b:if> </b:loop> </b:if>

Bước 3. Nhấn nút Lưu chủ đề để hoàn tất sau khi đã thiết lập xong.

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