Thủ thuật blogspot - Dautoblog

Sửa lỗi thẻ H1 tại trang chủ và trang bài viết

Khắc Phục Lỗi Thẻ H1 Tại Trang Chủ Và Trang Bài Viết
Tất cả các blogspot khi tiến hành cải thiện seo với việc chỉnh sửa tối ưu hóa cho thẻ h1 và h3 thì đến 90% các bạn ít quan tâm tới việc phân bổ thẻ H1 khi nó được gán là tiêu đề blogspot tại các trang trong blogspot.

Xin lưu ý:

- Lỗi thẻ H1 chỉ xẩy ra khi bạn đã tối ưu thể H3 mà mặc định của blogger là tiêu đề bài viết thành thẻ H1 khi xem ở trang bài viết.Thông qua thủ thuật Sửa tiêu đề bài viết thành H1

- Cần xem người thiết kế template họ để tiêu đề bài viết là H3 hay H2 bằng cách vào trang chủ blogspot chuột phải chọn xem mã nguồn.

Như trong ảnh họ đặt tiêu đề bài viết là H3

Code bài này viết cho tiêu đề bài viết là H3 nếu template của bạn tiêu đề bài viết là H2 thì phải đổi toàn bộ H3 trong code thành H2.
Khắc Phục Lỗi Thẻ H1 Tại Trang Chủ Và Trang Bài Viết
Tiêu đề blog là H1 ở trang chủ
Khắc Phục Lỗi Thẻ H1 Tại Trang Chủ Và Trang Bài Viết
Tiêu đề bài viết là H3 ở trang chủ
Sẽ xẩy ra 2 trường hợp
Trường hợp 1:Không sử dụng logo
Trong trường hợp này blogger sẽ lấy tiêu đề blogspot là chữ làm thẻ H1
Tại trang chủ mọi chuyện rất ổn vì tiêu đề blog là H1 và tiêu đề bài viết là H3 hoặc H2 tùy thuộc vào người chỉnh template.
Nhưng ở trang bài viết lại xẩy ra vấn đề là có 2 thẻ H1 vì 1 của tiêu đề blog và 1 của tiêu đề bài viết sau khi đã tối ưu thẻ h3 thành h1

Trường hợp 2: Sử dụng logo(hình ảnh) thay cho tiêu đề blog.
Khắc phục lỗi thẻ H1 tại trang chủ và trang bài viết

Trong trường hợp này blogger tự động xóa bỏ thẻ h1 và thay thế là hình ảnh do vậy trang chủ không có thẻ h1
Nếu các bạn kiểm tra trên một số công cụ seo online thì thấy rõ vấn đề này.
Vậy làm thế nào để khắc phục việc thiếu và trùng lặp thẻ h1 tại trang chủ và trang bài viết.
Công việc cần làm là:
Đối với trường hợp 1:Không sử dụng logo(hình ảnh)
Các bạn vào chỉnh sửa mẫu tìm tới đoạn
<div id='header-wrapper'>
Thay nó thành
<div id='header-wrapper' itemscope='itemscope' itemtype='http://schema.org/Organization'>
Công đoạn này cần tiến hành cho cả 2 trường hợp.
Sau đó sửa đoạn:
<!--No header image -->
<div id='header-inner'>
<div class='titlewrapper'>
<h1 class='title'>
<b:include name='title'/>
</h1>
</div>
Tôi lấy cả <!--No header image --> để các bạn dễ nhận thấy nó trong mẫu.
Thành:
<!--No header image -->
<div id='header-inner'>
<div class='titlewrapper'>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<h1 class='title'>
<b:include name='title'/>
</h1>
<b:else/>
<h3 class='title'>
<b:include name='title'/></h3>
</b:if>
</div>
Đối với trường hợp 2:Sử dụng logo thay cho tiêu đề blog(trường hợp này là phổ biến)
Với trường hợp này bạn tìm tới đoạn code:
<!--Show the image only-->
<div id='header-inner'>
<a expr:href='data:blog.homepageUrl' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' style='display: block' title=''/>
</a>
<!--Show the description-->
Nhưng ta chỉ cần thay từ
<a expr:href='data:blog.homepageUrl' style='display: block'>
......Tới........
</a>
Và thay nó thành:
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<h1 itemprop='name'>
<a expr:href='data:blog.homepageUrl' itemprop='url' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span><data:blog.title/></span></a>
</h1>
<b:else/>
<h3 itemprop='name'>
<a expr:href='data:blog.homepageUrl' itemprop='url' style='display: block'>
<img expr:alt='data:title' expr:height='data:height' expr:id='data:widget.instanceId + &quot;_headerimg&quot;' expr:src='data:sourceUrl' expr:width='data:width' itemprop='logo' style='display: block'/><span><data:blog.title/></span></a></h3>
</b:if>
Tại phần CSS trong mẫu sửa:
.header h1 a {.....}
Thành
.header h1 a,.header h3 a {.....}
Sau đó thêm vào trước thẻ ]]></b:skin>
Đoạn code sau:
.header h1 a,.header h3 a, .header h1 a:visited, .header h3 a:visited{color:#fff; font-size:1px;text-decoration:none;margin:0;padding:0}
.header h1 span, .header h3 span{text-indent:-999em; display:block;}
Nhận xét
Facebook
Blogger