Hướng dẫn Cấu trúc lại dữ liệu theo chuẩn trên nền tảng Blogger

Hello! Các bạn .Trong 2 bài viết trước tôi đã có bài giới thiệu về dữ liệu có cấu trúc trên nền tản Blogger. Trong bài này tôi sẽ hướng dẫn bạn cách xóa cấu trúc cũ và tạo lại cấu trúc mới cũng từ template các bạn đang sử dụng theo đúng chuẩn.

Triển khai dữ liệu có cấu trúc trên nền tảng blogger

Trước tiên bạn hãy backup lại template để tránh trường hợp làm xong bị lỗi thì chúng ta có thể Restore lại nhanh chóng vì như mình nói mỗi template thì cấu trúc khác nhau nó tùy thuộc vào người tạo ra nó. Ok chúng ta bắt đầu tiến hành

Như chúng ta đã biết Template blogger đa phần sử dụng dữ liệu cấu trúc dạng Microdata, qua việc sử dụng các thuộc tính itemprop, itemscope, itemtype nên việc xóa đi rất đơn giản để cấu trúc  lại một template blogger cho đúng chuẩn cấu trúc như gợi ý từ google master tools

- Đầu tiên chúng ta lần lượt tìm các với 3 từ khóa itemprop, itemscope, itemtype

+ Nếu là tag HTML

Ví dụ <div id='xxx' itemprop='publisher' itemscope='' itemtype='https://schema.org/Organization'> thì xóa hết thuộc tính chỉ để lại div,id,class.. hoặc bất kì thuộc tính nào không liên quan tới 3 từ khóa trên.

Kết quả <div id='xxx'>

+ Nếu là thẻ meta thì xóa luôn thẻ meta

+ Để xóa hvcard tìm class='fn' và xóa đi ví dụ <span class='fn'...> thì xóa thành <span...>

+ Để xóa hatom tìm class hfeed và xóa đi ví dụ <div class='post hfeed'...> thì xóa thành <div class='post'...>

+ Để xóa hentry tìm class hentry và xóa đi ví dụ <div class='post hentry'...> thì xóa thành <div class='post'...>

Như vậy với cách trên thì các bạn đã hoàn toàn xóa hết các thuộc tính râu ria của template. Bây giờ thì chúng ta tiến hành tạo lại cấu trúc. Tôi sẽ để code bên dưới theo trình tự bạn chỉ cần Search trong template của mình các code tương ứng và thay thế là xong.

Header

Code ban đầu:

<div class='header-wrap' id='header-wrap'>

Code tạo cấu trúc:

<div class='header-wrap' id='header-wrap' itemscope='itemscope' itemtype='http://schema.org/WPHeader'>

Sidebar

Code ban đầu:

 <div class='sidebar-wrapper' id='sidebar-wrapper'>

Code tạo cấu trúc:

<div class='sidebar-wrapper' id='sidebar-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPSideBar'>

Footer

 Code ban đầu:

<div class='lowerbar-wrapper' id='lowerbar-wrapper'>

Code tạo cấu trúc:

<div class='lowerbar-wrapper' id='lowerbar-wrapper' itemscope='itemscope' itemtype='http://schema.org/WPFooter'>

Main Wrapper hoặc Content Wrapper

 Code ban đầu:

<div class='body-row' id='content-wrapper'>

Code tạo cấu trúc:

<div class='body-row' id='content-wrapper' itemscope='itemscope' itemtype='http://schema.org/Blog' role='main'>

Menu

 Code ban đầu:

<div class='tm-menu' id='tm-menu'>

Code tạo cấu trúc:

 <div class='tm-menu' id='tm-menu' itemscope='itemscope' itemtype='http://schema.org/SiteNavigationElement'>

Sau khi đã tạo cấu trúc cho các thành phần xong bạn lại tiếp tục tạo cấu trúc cho các thành phần con của chúng  bạn có thể tham khảo trực tiếp tại link trang chủ

http://schema.org/SiteNavigationElement

Đây là link cung cấp tất cả các thứ liên quan đến Schema website tuy nhiên nếu bạn nào chưa rành về nó thì nhìn nó như đám rừng. Nếu như không hiểu về code cũng như lập trình thì bạn có thể tìm search trên mạng rồi sau đó fix dần các lỗi cấu trúc.

Kết luận: Với cách trên tôi đã hướng dẫn các bạn tái cấu trúc lại một template blogger theo chuẩn. Trong các bài viết sau tôi sẽ hướng dẫn các bạn cấu trúc lại các thành phần con bên trong của nó.

Chúc các bạn thành công!