Hướng dẫn đặt thẻ tiêu đề Blog chính xác

Mặc định trong cấu trúc Widget tiêu đề của mỗi Blog vẫn được đặt trong thẻ <H1> nhưng chỉ đúng với những trang index (trang tìm kiếm) còn với trang bài viết và trang tĩnh thì nên loại bỏ thẻ <H1> vì tiêu đề trong bài viết của các trang này đã được đặt trong thẻ <H1> rồi mà mỗi trang chỉ có tối đa một thẻ <H1> mà thôi.

Do đó chúng ta cần sửa lại đặt thêm điều kiện như vậy sẽ tốt cho SEO hơn. Trong bài viết này mình hướng dẫn cho cả widget version='1' và cà widget version='2'. Đầu tiên đăng nhập vào Blog chọn Chủ đề > Chỉnh sửa HTML > Chuyển đến tiện ích > chọn Header1

1. Đối với widget Header1 version='1'

Bố cục của widget Header version='1' như sau:

Copy

<b:widget-settings>... </b:widget-settings> // Mặc định không đụng đến

<b:includable id='main'>...</b:includable> // Nội dung hiển thị

<b:includable id='description'>...</b:includable> // Mô tả Blog

<b:includable id='title'>...</b:includable> // Tiêu đề Blog

Như vậy chúng ta chỉ cần sửa trong phần <b:includable id='main'>...</b:includable> và <b:includable id='title'>...</b:includable>. Chúng ta sẻ sửa trong phần <b:includable id='title'>...</b:includable> trước bấm dấu ... mở rộng mục này ra thay lại nội dung html bên trong như dưới đây

Copy

<b:if cond='data:view.isHomepage'>

  <data:blog.title/>

<b:else/>

  <a expr:href='data:blog.homepageUrl' expr:title='data:blog.title'><data:blog.title/></a>

</b:if>

Với nội dung html như trên có thể hiểu nếu ở trang chủ chỉ bao gồm tiêu đề Blog hiển thị và không thể click được còn với trang khác thêm a nên có thể click về trang chủ

Tiếp theo chúng ta sẽ sửa nội dung html bên trong mục <b:includable id='main'>...</b:includable> bấm dấu ... mở rộng ra sẽ thấy phần nội dung này dài và khó hiểu nhưng bao giờ bên trong cũng có các dòng chữ: <!--Show the image only--> và  <!--No header image --> và chúng ta chỉ cần sửa lại nội dung html ngay dưới 2 dòng này thôi

Với <!--Show the image only--> sửa thành

Copy

<div id=''>

   <b:if cond='!data:view.isSingleItem'>

    <h1><a expr:href='data:blog.homepageUrl' expr:title='data:title'><img expr:alt='data:title' expr:height='data:height' expr:src='data:sourceUrl' expr:width='data:width'/></a></h1>

  <b:else/>

    <a expr:href='data:blog.homepageUrl' expr:title='data:title'> <img expr:alt='data:title' expr:height='data:height' expr:src='data:sourceUrl' expr:width='data:width'/></a>

  </b:if>

  <!--Show the description-->

  <b:if cond='data:imagePlacement == &quot;BEFORE_DESCRIPTION&quot;'>

    <b:include name='description'/>

  </b:if>

</div>

Với <!--No header image --> sửa thành

Copy

<div id='' >

  <div class=''>

    <b:if cond='!data:view.isSingleItem'>                  

      <h1><b:include name='title'/></h1>

    <b:else/>

      <b:include name='title'/>

    </b:if>

  </div>

    <b:include name='description'/>

  </div>

</div>

Thay id hoặc class theo Blog của bạn, khi thay lại nội dung html bạn cần kiểm tra và chỉnh lại css cho phù hợp

2. Đối với widget Header1 version='2'

Cấu trúc html của widget Header version='2' nó khác với version='1' bao gồm những phần sau:

Copy

<b:widget-settings>...</b:widget-settings> // Mặc định không đụng đến

<b:includable id='main' var='this'>...</b:includable> // Nội dung hiển thị

<b:includable id='behindImageStyle'>...</b:includable> // Reonsive hình ảnh logo

<b:includable id='description'>...</b:includable> // Mô tả Blog

<b:includable id='image'>...</b:includable> // Logo

<b:includable id='title'>...</b:includable> // Tiêu đề Blog

Chúng ta chỉ cần sửa các phần <b:includable id='image'>...</b:includable> và <b:includable id='title'>...</b:includable> còn các mục còn lại cứ để mặc định không đụng đến.

Với <b:includable id='image'>...</b:includable> bấm dấu ... mở rộng thay bằng nội dung html bên trong như dưới đây:

Copy

<b:if cond='!data:view.isSingleItem'>

  <h1><a expr:href='data:blog.homepageUrl' expr:title='data:title'><img expr:alt='data:title' expr:height='data:height' expr:src='data:sourceUrl' expr:width='data:width'/></a></h1>

<b:else/>

  <a expr:href='data:blog.homepageUrl' expr:title='data:title'><img expr:alt='data:title' expr:height='data:height' expr:src='data:sourceUrl' expr:width='data:width'/></a>

</b:if>

Với <b:includable id='title'>...</b:includable> bấm dấu ... mở rộng thay bằng nội dung html bên trong như dưới đây:

Copy

<div class='replaced'>

  <b:if cond='data:view.isMultipleItems and !data:view.isHomepage'>

    <h1><a expr:href='data:blog.homepageUrl' expr:title='data:blog.title'><data:blog.title/></a></h1>

  <b:else/>

  <b:if cond='data:view.isHomepage'>

    <h1><data:blog.title/></h1>

  <b:else/>

    <a expr:href='data:blog.homepageUrl' expr:title='data:blog.title'><data:blog.title/></a>

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

</div>

Lưu template lại kiểm tra và sửa lại css cho class='replaced'

Nội dung chính