Thêm dữ liệu có cấu trúc BreadcrumbList trong bài viết với Label tùy chỉnh

Trong bài viết Thêm dữ liệu có cấu trúc BreadcrumbList trong bài viết mình có trình bày phương pháp thêm đường dẫn Breadcrumb trong bài viết với trường hợp tên Label hiển thị tự động. Bài này mình trình bày cách thêm đường dẫn Breadcrumb nhưng với Label tùy chỉnh.

Cụ thể khi bạn thêm tên Label không dấu mà bạn muốn hiển thị tên có dấu bạn cần tùy chỉnh bằng điều kiện để Label đó hiển thị có dấu. Các bạn đọc bài viết Hướng dẫn tối ưu cho Nhãn hiển thị tiếng Việt có dấu và tạo link không dấu để hiểu rõ hơn.

Trong thẻ tag <b:includable id='breadcrumb' var='posts'>...</b:includable> của widget Blog1 mở rộng dấu ... ra chúng ta sẽ có đoạn <b:if cond='data:blog.pageType == &quot;item&quot;'> hoặc <b:if cond='data:view.isPost'> điều kiện trong bài viết

Copy

<b:if cond='data:blog.pageType == &quot;item&quot;'>

// Đường dẫn Breadcrumb của bài viết

<b:else/>

Bây giờ chúng ta sẽ thay lại nội dung như sau:

Copy

    <b:if cond='data:blog.pageType == &quot;item&quot;'>

      <b:loop values='data:posts' var='post'>

        <div class='breadcrumbs'>

          <ul typeof='BreadcrumbList' vocab='http://schema.org/'>

            <li property='itemListElement' typeof='ListItem'>

              <a expr:href='data:blog.homepageUrl' expr:title='data:messages.home' property='item' typeof='WebPage'><span property='name'><data:messages.home/></span></a>

              <meta content='1' property='position'/>

            </li>                    

            <b:loop index='item' values='data:post.labels' var='label'>

            <b:if cond='data:label.isLast != &quot;true&quot;'> › </b:if>

            <b:if cond='data:label.name == &quot;ten-label&quot;'>

              <li property='itemListElement' typeof='ListItem'>

                <a expr:href='data:label.url' property='item' title='Tên Label' typeof='WebPage'><span property='name'>Tên Label</span></a>

                <b:if cond='data:label.isLast != &quot;true&quot;'><meta expr:content='data:item + 2' property='position'/></b:if>

              </li>

            <b:else/>    

              <li property='itemListElement' typeof='ListItem'>

                <a expr:href='data:label.url' expr:title='data:label.name' property='item' typeof='WebPage'><span property='name'><data:label.name/></span></a>

                <b:if cond='data:label.isLast != &quot;true&quot;'><meta expr:content='data:item + 2' property='position'/></b:if>

              </li>

            </b:if>

            </b:loop>

          </ul>

        </div>

      </b:loop>

   <b:else/>

Trong đó: <b:if cond='data:label.name == &quot;ten-label&quot;'>  đặt điều kiện cho tên Label, ví dụ mình có đoạn mẫu sau:

Copy

    <b:if cond='data:blog.pageType == &quot;item&quot;'>

      <b:loop values='data:posts' var='post'>

        <div class='breadcrumbs'>

          <ul typeof='BreadcrumbList' vocab='http://schema.org/'>

            <li property='itemListElement' typeof='ListItem'>

              <a expr:href='data:blog.homepageUrl' expr:title='data:messages.home' property='item' typeof='WebPage'><span property='name'><data:messages.home/></span></a>

              <meta content='1' property='position'/>

            </li>                    

            <b:loop index='item' values='data:post.labels' var='label'>

            <b:if cond='data:label.isLast != &quot;true&quot;'> › </b:if>

            <b:if cond='data:label.name == &quot;blog&quot;'>

              <li property='itemListElement' typeof='ListItem'>

                <a expr:href='data:label.url' property='item' title='Blog' typeof='WebPage'><span property='name'>Blog</span></a>

                <b:if cond='data:label.isLast != &quot;true&quot;'><meta expr:content='data:item + 2' property='position'/></b:if>

              </li>

            <b:else/>

            <b:if cond='data:label.name == &quot;blogger-template&quot;'>

              <li property='itemListElement' typeof='ListItem'>

                <a expr:href='data:label.url' property='item' title='Blogger Template' typeof='WebPage'><span property='name'>Blogger Template</span></a>

                <b:if cond='data:label.isLast != &quot;true&quot;'><meta expr:content='data:item + 2' property='position'/></b:if>

              </li>

            <b:else/>    

              <li property='itemListElement' typeof='ListItem'>

                <a expr:href='data:label.url' expr:title='data:label.name' property='item' typeof='WebPage'><span property='name'><data:label.name/></span></a>

                <b:if cond='data:label.isLast != &quot;true&quot;'><meta expr:content='data:item + 2' property='position'/></b:if>

              </li>

            </b:if></b:if>

            </b:loop>

          </ul>

        </div>

      </b:loop>

   <b:else/>

Căn cứ vào đoạn mẫu trên sẽ ra đường dẫn nếu bài viết có 2 Label tên blog và blogger-template như sau:

Trang chủ › Blog › Blogger Template

Và Google khi thu thập dữ liệu có cấu trúc sẽ lập chỉ mục cho URL của bài viết trên kết quả tìm kiếm như sau:

https://www.vietblogdao.com › Blog › Blogger Template

Kiểm tra dữ liệu có cấu trúc theo đường dẫn https://search.google.com/structured-data/testing-tool/u/0/#url=https%3A%2F%2Fwww.vietblogdao.com%2F2018%2F07%2Fviet-blogger-magazine-blogger-template.html

Nội dung chính