HTML5 memperkenalkan pelbagai ciri baharu yang hebat dan pilihan mudah. Tidak lama lagi ia akan disokong sepenuhnya oleh kebanyakan pelayar yang digunakan hari ini. Akhirnya semua orang perlu menukar tema WordPress mereka daripada XHTML kepada HTML5. Selepas kemas kini Panda Google, tapak web anda memerlukan kod yang lebih jelas dan mudah dibaca untuk mendapat kedudukan yang lebih baik di Google. Saya akan mengajar anda cara menukar tema anda daripada XHTML kepada HTML5. Kami juga akan menjaga 2% pengguna internet yang telah melumpuhkan JavaScript (untuk keserasian ke belakang).

Matlamat kami

Dalam tutorial ini, kami akan menumpukan pada menukar tema WordPress daripada XHTML kepada HTML5. Kami akan membimbing anda melalui perubahan langkah demi langkah melalui fail yang disenaraikan di bawah (fail ini terletak dalam folder tema anda, iaituwp-content/themes/yourtheme/here!)

• header.php
• index.php
• bar sisi.php:
• footer.php
• single.php(pilihan)

Susun atur HTML5 asas

Mari kita lihat reka letak asas HTML5 yang akan kita bina. HTML5 adalah lebih daripada sekadar jenis dokumen pada permulaan kod. Beberapa elemen yang baru diperkenalkan membantu kami menggayakan dan kod dengan cara yang cekap dengan kurang penanda (ini adalah salah satu sebab mengapa HTML5 lebih baik).

    
     
 
 
Title of the Article
  
Some lorem ispum text of your post goes here.
 
The article's text ends.
 
  
     

Kini kita hanya perlu mengetahuiheader,footer,nav,sectiondanarticle> Tempat untuk meletakkan teg HTML5 baharu. Berbeza dengan XHTML berstrukturdiv, nama teg yang baru diperkenalkan adalah jelas.header、footer、nav、section和article的新 HTML5 标签放在哪里即可。与div结构化 XHTML 相比，新引入的标签的名称是不言自明的。

步骤 1将 header.php 转换为 HTML5

现在我将向您展示XHTML WordPress主题的header.php中常用的代码。

XHTML 主题 header.php

     
   
 
 
My Blog is Working Great.
 
 
  
 
 
  
 
 
  

有人必须问我们为什么要做这一切？答案很简单，就是 HTML5 的语义标记。它减少了标记，使其非常易于理解和管理。

HTML5 header.php（转换）

阅读代码，然后按照以下说明将主题的 header.php 转换为 HTML5。

     
   
 
 
My Blog is Working Great.
 
 
     

正如您所看到的，转换后的代码与 XHTML 代码非常相似。让我们讨论一下这些变化。

• – HTML5 有一个非常简单的 doctype，但它包含许多新的语义标签
• – 标头部分的语义标记

注意：有些人在标头中包含section标记。关于这一点有很多争论。我个人反对在标头中包含section标签，因为它会破坏 HTML5 的美感。当然，您可以在那里使用旧的div。

脚本和样式表怎么样？

将 WordPress 主题转换为 HTML5 时，标头中包含的脚本和样式表确实非常简单。在 HTML5 中，我们只使用