Tạo widget liên kết bạn bè đơn giản cho Blogspot

Mục lục bài viết

Việc tạo widget liên kết bạn bè trên Blogspot không chỉ giúp blog của bạn trông chuyên nghiệp hơn mà còn giúp tăng cường liên kết giữa các blog, hỗ trợ SEO và tạo sự kết nối trong cộng đồng blogger. Dưới đây là hướng dẫn chi tiết để bạn có thể tự tạo một widget liên kết bạn bè đơn giản cho Blogspot.

Widget liên kết bạn bè là gì?

Widget liên kết bạn bè là một tiện ích nhỏ được hiển thị trên thanh bên (sidebar) của blog, thường hiển thị các liên kết đến các blog hoặc website bạn bè mà bạn muốn giới thiệu.

Lợi ích khi sử dụng widget liên kết bạn bè

Tăng cường SEO nội bộ và ngoại vi

• SEO nội bộ: Liên kết bạn bè giúp tạo ra các liên kết nội bộ giữa các bài viết trên blog của bạn, giúp công cụ tìm kiếm dễ dàng lập chỉ mục và hiểu cấu trúc trang web của bạn hơn. Điều này có thể cải thiện thứ hạng của các trang trong kết quả tìm kiếm.
• SEO ngoại vi: Khi bạn liên kết với các blog khác và họ cũng liên kết lại với bạn, điều này tạo ra các backlink chất lượng. Backlink từ các trang web uy tín có thể tăng độ tin cậy và thứ hạng của trang web bạn trên các công cụ tìm kiếm.

Xây dựng cộng đồng

• Kết nối blogger: Việc liên kết với các blogger khác trong cùng lĩnh vực giúp tạo ra một mạng lưới hỗ trợ lẫn nhau. Bạn có thể chia sẻ kinh nghiệm, kiến thức và thậm chí hợp tác trong các dự án chung.
• Tăng tương tác: Khi các blogger liên kết với nhau, độc giả của họ cũng có thể khám phá và theo dõi các blog khác, từ đó tăng lượng truy cập và tương tác cho tất cả các bên.

Giao diện chuyên nghiệp

• Tăng tính thẩm mỹ: Widget liên kết bạn bè có thể được thiết kế đẹp mắt, giúp blog của bạn trông hấp dẫn và chuyên nghiệp hơn.
• Thân thiện với người dùng: Một giao diện gọn gàng và có tổ chức giúp người đọc dễ dàng tìm thấy các liên kết hữu ích và điều hướng trang web một cách thuận tiện.

Cách tạo widget liên kết bạn bè đơn giản

Bước 1: Đăng nhập vào Blogspot
Truy cập blogger.com và đăng nhập vào tài khoản Google của bạn.
Bước 2: Truy cập Giao diện quản lý
Chọn blog mà bạn muốn thêm widget.
Chọn Bố cục từ menu bên trái.
Bước 3: Thêm tiện ích (widget)
Nhấp vào Thêm tiện ích tại khu vực bạn muốn hiển thị widget (thường là thanh bên).
Tìm và chọn HTML/Javascript.
Bước 4: Thêm Mã HTML
Dưới đây là đoạn mã HTML cơ bản để tạo widget liên kết bạn bè (thay đổi các liên kết và tên blog cho phù hợp):

<div class="ahi-blog-list-container">
  <ul id="aHiBlogList">
    <li>
      <div class="web-icon">
        <img alt="icon" src="https://www.google.com/s2/favicons?domain=https://www.anhtrainang.com" />
      </div>
      <div class="web-title">
        <a href="https://www.anhtrainang.com/" target="_blank"
          title="Anh Trai Nắng Blog - Thủ thuật blogspot - Blogger template - chia sẻ tổng hợp.">
          Anh Trai Nắng Blog
        </a>
      </div>
    </li>
    <li>
      <div class="web-icon">
        <img alt="icon" src="https://www.google.com/s2/favicons?domain=http://www.blogspotvn.net" />
      </div>
      <div class="web-title">
        <a href="http://www.blogspotvn.net/" target="_blank" title="Blogspot VN - Chia Sẻ Thủ Thuật Blogger - Internet">
          Blogspot VN
        </a>
      </div>
    </li>
    <li>
      <div class="web-icon">
        <img alt="icon" src="https://www.google.com/s2/favicons?domain=https://www.dantocking.com" />
      </div>
      <div class="web-title">
        <a href="https://www.dantocking.com/" target="_blank"
          title="Kho sách cũ quý hiếm - Ký sự phía bên kia không gian chiều thứ tư">
          Dân tộc KING
        </a>
      </div>
    </li>
    <li>
      <div class="web-icon">
        <img alt="icon" src="https://www.google.com/s2/favicons?domain=https://kinhnghiem-affiliate.marketing" />
      </div>
      <div class="web-title">
        <a href="https://kinhnghiem-affiliate.marketing/" target="_blank" title="Kinh Nghiệm Affiliate Marketing 2024">
          Kinh Nghiệm Affiliate
        </a>
      </div>
    </li>
    <li>
      <div class="web-icon">
        <img alt="icon" src="https://www.google.com/s2/favicons?domain=https://www.thanhtruongblog.com" />
      </div>
      <div class="web-title">
        <a href="https://www.thanhtruongblog.com/" target="_blank"
          title="SEO website, blogspot/blogger, tài liệu học tập">
          Thành Trương Blog
        </a>
      </div>
    </li>
    <li>
      <div class="web-title">
        <a href="/2024/04/dat-lien-ket-ban-be-cung-blogger-anh-hi.html" title="Đặt liên kết bạn bè cùng Blogger anh Hí">
          Gửi yêu cầu đặt liên kết
        </a>
      </div>
    </li>
  </ul>
</div>
<style>
  .ahi-blog-list-container ul {
    padding: 0;
    max-height: 320px;
    overflow: auto;
  }
  #aHiBlogList li {
    margin-bottom: 5px;
    height: 25px;
    margin: 0;
    padding: 0;
    line-height: normal;
    display: flex;
    float: left;
    text-align: center;
    width: 100%
  }

  #aHiBlogList .web-icon {
    margin-right: 5px;
    width: 16px;
    height: 16px;
    overflow: hidden;
    float: left;
  }

  #aHiBlogList img {
    height: 16px;
    width: 16px;
  }

  #aHiBlogList .web-title {
    height: 25px;
    float: left;
  }
</style>

Bước 5: Lưu và kiểm tra
Nhấp Lưu để hoàn tất.
Truy cập blog để kiểm tra widget đã hiển thị đúng chưa.

Kết luận

Việc tạo widget liên kết bạn bè trên Blogspot rất đơn giản nhưng mang lại hiệu quả cao trong việc xây dựng mạng lưới liên kết và cải thiện SEO. Hãy bắt tay vào thực hiện và chia sẻ kết quả của bạn nhé!