Arxius d'un tema per WordPress

En WordPress no utilitzem una sola fulla anomena de index.php si no que dividim la fulla principal en parts per facilitar les coses. Això ens serveix per no haver d’escriure la mateixa porció de codi en diverses plantilles.  Per exemple, la secció de la capçalera del lloc sempre és igual, portarà un logo i una botonera que no volem que canviï. En un lloc construït íntegrament en HTML hauríem de copiar aquest codi en cadascuna de les pàgines.

Però en WordPress n’hi haurà prou amb escriure tot el codi de la capçalera dins header.php i després demanar la capçalera en cada secció que el necessitem. El mateix sistema per a la barra lateral (sidebar.php) i el peu de pàgina (footer.php).

how-theme-works

D’aquesta manera quan es llista el index d’un lloc WordPress, aquest estarà compost dels arxius header.php, index.php, sidebar.php i footer.php.

De totes maneres, un tema de WordPress pot estar format per molts arxius, però perquè un tema de WordPress funcioni, només necessitarà dos arxius: index.php i style.css

plantilla_curs_css
Per cridar des de l’index.php els arxius en qüestió utilitzarem les funcions:

get_header();
get_sidebar();
get_footer();

Anem aveure quins són els principals arxius que han de composar un tema i quines funcions tenent:

  • / images – Carpeta amb les imatges del tema.
  • /scripts – Carpeta amb els scripts
  • style.css – Full d’estils del tema. Obligatòria perquè el tema funcioni.
  • index.php – Obligatori perquè el tema funcioni. Per defecte serà la pàgina principal.
  • screenshot.png. – Mostra la imatge en miniatura que es veurà al panell de adminsitració la interfície.
  • favicon.ico – La imatge que es veurà en el navegador i en desar el marcador.
  • header.php – Mòdul que conté la capçalera del tema.
  • sidebar.php – La barra lateral del tema.
  • footer.php –  Mòdul que conté el peu de pàgina del tema.
  • single.php – Aquest fitxer indica com es veu una entrada de bloc.
  • category.php – Mostra com es veu la pàgina de resultats d’una categoria.
  • tag.php – Mostra com es veu la pàgina de resultats d’una etiqueta.
  • search.php – Mostra com es veu la pàgina de resultats de cerca.
  • page.php – Aquest fitxer indica com es veu una pàgina a Worpress
  • functions.php – Arxiu amb les funcions del nostre tema de WordPress.

Ara farem una petita introducció al php. Tot i que, no necessitarem saber gaire php per realitzar el curs si que imprescindible tenir uns mínims de coneixement.

Un arxiu php és mot similar a un arxiu html. Això és degut a que el codi php s’incrusta dins del codi html. Veiem un exemple. Creem un arxiu que es digui exemple.php amb el següent codi a dins:

[php]
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>Documento sin título</title>
</head>

<body>
<?php
echo "<p>Hola món!</p>"; //això és un comentari
?>

</body>
</html>

[/php]

El resultat ens mostrarà una pàgina web amb un paràgraf a on diu Hola món!. La instrucció echo mostra per pantalla el que té després.

Encara que es tracti d’un arxiu PHP podem veure que s’assembla moltíssim a un HTML. Només que en el moment d’agregar codi de programació hem afegit dues etiquetes (un d’obertura i una altra de tancament) per indicar que el que es troba entre elles és codi PHP i ha de ser executat.

En php també podem trobar variables. Les variables no són més que magatzems d’informació temporals. Aquestes tenen per finalitat guardar informació que després utilitzaràs o que et servirà per realitzar una operació determinada. Veiem un exemple. A l’arxiu anterior, avanç de l’etiqueta “/body” afegirem el següent codi:

[php]
<?php
$nom="Marçal";

echo "<p>Hola món, sóc en $nom Galí</p>"; // les cometes dobles interpreten el codi a l’interior
echo ‘hola món, sóc $nom Galí</br>’; //les cometes simples mostren exactament el que hi ha entre elles, no interpreten les variables.

?>
[/php]

En aquest exemple hem afegit una variable que és diu $nom i em guardat al seu interior el nom “Marçal”. Després em mostrar per pantalla el text amb la variable a dins i com a resultat em obtingut Hola món, sóc en Marçal Galí.

Una altra característica de PHP és l’operador d’unió Cadenes (.). El (.) ens permet enllaçar cadenes de text per que es vegin com una sola sèrie de dades. S’utilitza molt per enllaçar html amb variables de php. Veiem un exemple.

[php]
<?php
$nom="Marçal";

echo "Hola món, sóc en ".$nom." Galí</br>";
?>
[/php]

El resultat per pantalla serà el mateix que a l’exemple anterior.

Vist això ja podem començar a treballar amb arxius php. A la pròxima classe veurem com maquetar un tema per WordPress.