În acest tutorial, ne vom concentra pe transformarea temei WordPress de la XHTML la HTML5. Vom merge mai departe pas cu pas, studiind modificările din fișierele listate mai jos (aceste fișiere se află în dosarul temei dvs., adică wp-content / themes / your-theme /)
Format HTML5 de bază
Să ne uităm la marcajul HTML5 de bază pe care îl vom face. HTML5 este mult mai mult decât valoarea "doctype" la începutul codului. Mai multe elemente noi ne vor ajuta să programați și să descrieți stilul într-un mod mult mai eficient și cu un marcaj mai mic (acesta este unul dintre motivele pentru care HTML5 este mai bun).
Acum trebuie doar să aflăm unde să inserăm noile etichete ale antetului HTML5. subsol. nav. secțiune și articol. Numele etichetelor noi vorbesc de la sine despre funcții, spre deosebire de XHTML. structurat cu div.
Pasul 1. Conversia header.php la HTML5
header.php pe XHTML
Acum vă voi arăta codul utilizat în mod obișnuit în header.php în temele WordPress pe XHTML.
Cineva va întreba: de ce noi toți facem asta? Răspunsul este simplu: pentru marcajul semantic HTML5. Acest lucru reduce cantitatea de marcare, făcând înțelegerea și controlul mult mai simple.
header.php la HTML5 (convertit)
După cum puteți vedea, codul convertit este foarte asemănător cu codul XHTML. Să discutăm despre schimbări.
- - HTML5 are un doctype foarte simplu, dar include multe etichete semantice noi.
- etichetă semantică pentru unitatea capului.
Fiți atenți. unele includ o etichetă secțiune în antet. Există multe dezbateri despre acest lucru. Personal, sunt împotriva includerii etichetei secțiunii în antet, deoarece va distruge frumusețea HTML5. Desigur, puteți folosi vechiul div aici.
Cum rămâne cu scripturile și foile de stil?
Luați în considerare browserele mai vechi
O sugestie. plasați etichetele care apar secvențial înăuntru
Fiți atenți. Acest script trebuie plasat chiar în partea de sus a etichetei