Thư viện

Trải nghiệm

Chủ Nhật, tháng 4 13, 2014

Chỉnh sửa tiện ích Followers chuẩn HTML5 cho blogspot

Sửa lỗi tiện ích người theo dõi Followers để blogspot của bạn đạt chuẩn html của w3c, tối ưu hóa seo tối đa cho blog,

Chia sẻ:
Tiện ích người theo dõi Followers được rất nhiều người sử dụng tuy nhiên có một vấn đề là khi sử dụng tiện ích này trong blog thì blog của bạn sẽ lỗi w3c không chuẩn HTML5. Nguyên nhân của hiện tượng này là bạn không thể chỉnh sửa nội dung của tiện ích Followers trong mẫu do đó bạn không thể khắc phục được lỗi.
Chỉnh sửa tiện ích Followers chuẩn HTML5 cho blogspot
Trong bài viết hướng dẫn chỉnh sửa blogspot để trang của bạn đạt chuẩn HTML5 (W3C) lần trước của mình từng có hướng khắc phục hiện tượng này là xóa đoạn chỉnh sửa tiện ích nhanh của blog và website.
<b:include name='quickedit'/>
Tuy nhiên với tiện ích Followers sau khi bạn xóa đi và lưu lại thì phần này vẫn còn. Bạn không thể xóa do vậy check w3c sẽ gặp một số lỗi như bên dưới.
Chỉnh sửa tiện ích Followers chuẩn HTML5 cho blogspot

Vậy làm thế nào để có thể sử dụng tiện ích này mà blog của bạn vẫn đạt chuẩn html5 của w3c. Hãy theo dõi hướng dẫn sau đây để chỉnh sửa những lỗi liên quan nha.

» Hướng dẫn tạo tiện ích người theo dõi Followers chuẩn HTML5

1. Bạn vào xem trang blog của bạn và bấm tổ hợp phím Ctrl + U (Hoặc click chuột phải vào trình duyệt chọn xem nguồn view source) để xem nguồn trang.

2. Tại cửa sổ mã nguồn của trang bạn tìm đến đoạn code của tiện ích người theo dõi (Followers) có dạng tương tự như bên dưới:
<div id="div-1tb8tedl5dw0r" style="width: 100%; "></div>
<script type="text/javascript">
    var skin = {};
    skin['FACE_SIZE'] = '32';
    skin['HEIGHT'] = "260";
    skin['TITLE'] = "Ng\u01b0\u1eddi theo d\xf5i";
    skin['BORDER_COLOR'] = "transparent";
    skin['ENDCAP_BG_COLOR'] = "transparent";
    skin['ENDCAP_TEXT_COLOR'] = "#000000";
    skin['ENDCAP_LINK_COLOR'] = "#000000";
    skin['ALTERNATE_BG_COLOR'] = "transparent";
    
    skin['CONTENT_BG_COLOR'] = "transparent";
    skin['CONTENT_LINK_COLOR'] = "#000000";
    skin['CONTENT_TEXT_COLOR'] = "#000000";
    skin['CONTENT_SECONDARY_LINK_COLOR'] = "#FFFFFF";
    skin['CONTENT_SECONDARY_TEXT_COLOR'] = "#000000";
    skin['CONTENT_HEADLINE_COLOR'] = "#000000";
    skin['FONT_FACE'] = "Arial";
    google.friendconnect.container.setParentUrl("/");
    google.friendconnect.container["renderMembersGadget"](
    {id: "div-1tb8tedl5dw0r",
     height: 260,
     
     
     
     site: "16563312070204608152",
     
     locale: 'vi' },
     skin);
  </script>

Chỉnh sửa tiện ích Followers chuẩn HTML5 cho blogspot
Ảnh minh họa
- Mỗi blog khác nhau thì đoạn in đậm lại khác nhau. Bạn chỉ cần copy lấy toàn bộ đoạn script trên và thực hiện bước tiếp theo.

3. Đăng nhập vào blog → Chọn Bố cục (Layout) → Chọn Thêm tiện ích (Add widget) → Tạo một tiện ích HTML/Javascript và dán đoạn code copy được ở bên trên vào phần nội dung của tiện ích vừa tạo.

- Nhớ thêm cả đoạn js bên dưới vào trước đoạn code trên nha:
<script src="http://www.google.com/friendconnect/script/friendconnect.js" type="text/javascript"> </script>

- Lưu lại. Lúc này bạn sẽ được một tiện ích theo dõi mới chuẩn w3c (HTML5)

4. Công việc tiếp theo của bạn là xóa tiện ích người theo dõi Followers của blogger đi để xóa bỏ các lỗi w3c do tiện ích đó gây ra.

19 nhận xét:

  1. Site e bịnh 1 đống lỗi e ko biết sửa chổ nào luôn a ơi @@ hjxhjx

    Trả lờiXóa
  2. Nam ơi cô muốn cài thích fb vào sau tiêu đề bài đăng trên blog . thì để lấy code của fb cần dán linh của blog ở trang nào? cô dán đường linh trang chủ blog thì thích tất cả bài biết đều như nhau như vậy thì khhoong được. nhờ cháu chỉ giúp

    Trả lờiXóa
    Trả lời
    1. Cô tìm đoạn code có dạng như sau:

      <h3 class='post-title entry-title'>
      <b:if cond='data:post.link'>
      <a expr:href='data:post.link'><data:post.title/></a>
      <b:else/>
      <b:if cond='data:post.url'>
      <b:if cond='data:blog.url != data:post.url'>
      <a expr:href='data:post.url'><data:post.title/></a>
      <b:else/>
      <data:post.title/>
      </b:if>
      <b:else/>
      <data:post.title/>
      </b:if>
      </b:if>
      </h3>

      Thêm vào sau nó đoạn code bên dưới:

      <div class='fb-like' data-font='verdana' data-layout='button_count' data-send='false' data-show-faces='true' data-width='44'/>
      <div id="fb-root"></div>
      <script>(function(d, s, id) {
      var js, fjs = d.getElementsByTagName(s)[0];
      if (d.getElementById(id)) return;
      js = d.createElement(s); js.id = id;
      js.src = "//connect.facebook.net/vi_VN/all.js#xfbml=1&appId=413761485359136";
      fjs.parentNode.insertBefore(js, fjs);
      }(document, 'script', 'facebook-jssdk'));</script>
      <style>
      .fb-like{float:left}
      </style>

      Xóa
  3. A Nam ơi xem cho e mẫu đi, gần 1 tháng rùi. Có khó sửa ko ạ hay a quên rùi e gửi lại--)

    Trả lờiXóa
    Trả lời
    1. Mấy hôm nay anh đi công tác xuốt ít có thời gian vào mail e ak.

      Xóa
  4. Bạn Nam hướng dẫn các lỗi CSS thường gặp cho mọi người cùng biết luôn nghen. Cám ơn!

    Trả lờiXóa
  5. Nhận xét này đã bị quản trị viên blog xóa.

    Trả lờiXóa
    Trả lời
    1. Cám ơn bạn. Bài viết rất rõ ràng và chi tiết.

      Xóa
  6. anh xem cái này em tý
    http://feeds.feedburner.com/tinnet3s
    tai sao sao bài của em nó không có ngắt dòng (đọc thêm) dày quá tải lâu

    Trả lờiXóa
  7. thế anh xem lại trang này em với - http://www.giasuvinh24h.com/
    bạn nó làm em khong hieu

    Trả lờiXóa
    Trả lời
    1. Có dấu ngắt trong bài viết thì trong cài đặt cũng phải như thế. E xem bài viết này sẽ hiểu rõ hơn.
      Lấy dữ liệu Blogspot khác và Bảo vệ dữ liệu blogspot bản thân.

      Xóa
  8. Nhận xét này đã bị quản trị viên blog xóa.

    Trả lờiXóa
  9. Nhận xét này đã bị quản trị viên blog xóa.

    Trả lờiXóa
  10. Nhận xét này đã bị quản trị viên blog xóa.

    Trả lờiXóa
  11. Giúp vũ cái này với

    Nó cứ hiện cái nút chỉnh sửa phía trên chuyên mục

    Demo : http://avatarapk.blogspot.com/

    Trả lờiXóa
    Trả lời
    1. Khong có nút chỉnh sửa nào hết bạn ak. Cái bạn nhìn thấy là phần chỉnh sửa chỉ có amin trang mới nhìn thấy nên không sao đâu.

      Xóa