Bài đăng phổ biến chuẩn HTML5 cho Blogger

Cách thức để tối ưu cho một Blogger template đạt chuẩn HTML5 thì khá là lằng nhằng. Đặc biệt ngoài việc chỉnh sửa lại cấu trúc bên trong blog, chúng ta còn phải chỉnh sửa luôn cả những widget mặc định của nó. Trước đây mình đã có một bài viết hướng dẫn các bạn cách để chỉnh sửa widget Tiêu đề để phần logo blog đạt chuẩn HTML5, và hôm nay mình xin hướng dẫn các bạn chỉnh một widget hầu như có trên mọi blog "bài đăng phổ biến" đạt chuẩn HTML5.

Bài đăng phổ biến chuẩn HTML5 cho Blogger

Cũng như bài viết hướng dẫn khắc phục logo không đạt chuẩn, vấn đề nằm ở thẻ img chứa những thuộc tính không cần thiết, đây là đoạn mã được báo lỗi.

<img alt='' border='0' expr:height='data:thumbnailSize' expr:src='data:post.thumbnail' expr:width='data:thumbnailSize'/>

Chuẩn HTML5 không chấp nhận những thuộc tính có thể căn chỉnh bằng css. Do đó để khắc phục, bạn chỉ cần xóa những thuộc tính đó và sử dụng css để căn chỉnh lại. Để tránh phiền hà cho các bạn mình đã sẵn decode lại, bạn chỉ cần thay thế đoạn mã phía trên bằng đoạn mã ở đây.

<img expr:alt='data:post.title' expr:src='data:post.thumbnail' expr:style='&quot;width:&quot; + data:thumbnailSize + &quot;px;height:&quot; + data:thumbnailSize + &quot;px;&quot; + &quot;border:0&quot;'/>

như bạn thấy mình đã xóa bỏ những đoạn màm mình đã đánh dấu ở trên và dồn chúng vào thuộc tính style mình tự viết. Mình còn thêm cả tiêu đề bài viết vào thuộc tính alt tối ưu hơn cho SEO so với đoạn mã mặc định chỉ là ký tự rỗng.

Lời kết

Sau khi hoàn thành thì bạn đã làm cho widget bài đăng phổ biến trên blog của bạn đạt chuẩn HTML5, những bạn nào muốn biết mình làm thế nào để có thể đưa chúng vào trong thuộc tính style để mốt tự chỉnh sửa thì có thể tham khảo qua các bài viết thể ngôn ngữ lập trính Blogger trên blog của mình.