Banner

Cách đặt điều kiện cho script khi tải trang bằng thẻ b:if

Sử dụng các thẻ điều kiện b:if trong Blogger đặt các đoạn script trong thẻ điều kiện chỉ tải tại trang nhất định.


Script là thành phần quan trọng không thể thiếu với bất kỳ mã nguồn trang web nào, và Blogger cũng không ngoại lệ. Viết script thế nào thì bạn cần có kiến thức về nó nhưng đặt điều kiện tải hay thực thi script bạn có thể làm được.

Có 2 phương pháp đặt điều kiện cho script: chèn script trực tiếp trong thẻ điều kiện và tạo điều kiện bằng script sau đó đặt script trong điều kiện

Với phương pháp chèn script trực tiếp trong thẻ điều kiện áp dụng cho những code script dài chẳng hạn như code script related posts chỉ áp dụng với trang bài viết, ví dụ

<b:if cond='data:view.isPost'>
  <script>//<![CDATA[

  //]]></script>
</b:if>

Hoặc script đó chỉ tải trên trình duyệt mà không tải trên mobile

<b:if cond='data:view.isPost and !data:blog.isMobileRequest'>
  <script>//<![CDATA[

  //]]></script>
</b:if>

Với phương pháp tạo điều kiện bằng script sau đó đặt script trong điều kiện áp dụng cho những đoạn script ngắn chỉ vài dòng. Đầu tiên sẽ tạo điều kiện trước như sau:

<script>
  var data={
    view:{
      isHomepage:&quot;<b:if cond='data:view.isHomepage'>true</b:if>&quot;, // Trang chủ
      isArchive:&quot;<b:if cond='data:view.isArchive'>true</b:if>&quot;, // Lưu trữ
      isPost:&quot;<b:if cond='data:view.isPost'>true</b:if>&quot;, // Bài viết
      isPage:&quot;<b:if cond='data:view.isPage'>true</b:if>&quot;, // Trang tĩnh
      isSearch:&quot;<b:if cond='data:view.isSearch and !data:view.search.label and !data:view.search.query'>true</b:if>&quot;, // Các bài đăng tiếp theo
      isLabelSearch:&quot;<b:if cond='data:view.search.label'>true</b:if>&quot;, // Trang Label
      isSearchQuery:&quot;<b:if cond='data:view.search.query'>true</b:if>&quot;, // Tìm kiếm
      isMultipleItems:&quot;<b:if cond='data:view.isMultipleItems'>true</b:if>&quot;, Trang index
      isSingleItem:&quot;<b:if cond='data:view.isSingleItem'>true</b:if>&quot;, // Bài viết + Trang tĩnh
      isMobileRequest:&quot;<b:if cond='data:blog.isMobileRequest'>true</b:if>&quot; // Mobile
    },
    blog:{
      blogId:&quot;<data:blog.blogId/>&quot;, // blog ID
      postId:&quot;<b:if cond='data:view.isPost'><data:blog.postId/></b:if>&quot;, // post ID
      pageId:&quot;<b:if cond='data:view.isPage'><data:blog.pageId/></b:if>&quot;, // page ID
      pageName:&quot;<b:if cond='data:blog.pageName'><data:blog.pageName/></b:if>&quot;, // pageName
      searchqueryescaped:&quot;<b:if cond='data:view.search.query'><data:view.search.query.escaped/></b:if>&quot;, // Từ khóa tìm kiếm
      homepageUrl:&quot;<data:blog.canonicalHomepageUrl/>&quot;, // url trang chủ
      url:&quot;<data:blog.canonicalUrl/>&quot; // url trang hiện tại
    }
  }
</script>

Đoạn script này nên đặt trước thẻ đóng </head>

Tiếp theo đặt đoạn script thực thi trong điều kiện, ví dụ

<script>//<![CDATA[
  if(data.view.isHomepage!='true'){ // Không thực thi script trang chủ

  }
  if(data.view.isLabelSearch=='true'){ // Chỉ thực thi trang Label

  }
  if(data.view.isSearchQuery=='true'){ // Chỉ thực thi trang tìm kiếm

  }
  if(data.blog.postId=='ID'){ // Chỉ thực thi với điều kiện id bài viết

  }
  if(data.blog.pageId!='ID'){ // Không thực thi với điều kiện id trang tĩnh

  }
//]]></script>

Thêm đánh giá

Trở thành người đầu tiên bình luận cho bài viết này!

Liên hệ Zalo