Hoy traigo un pequeño howto o codekata, un resumen, sobre el sistema de plantillas para WordPress. En la documentación oficial está muy extendido. No he encontrado un resumen de todo esto, así que aquí estoy entonces compartiendo sobre este tema.
Este post es en parte continuación de un post anterior sobre cómo crear temas propios para WordPress. Más en concreto es el cómo trabajar los temas para estructurarlos. No hay que hacer grandes ficheros, si no ir dividiendo en pequeños problemas fáciles de resolver.
Este post resumen el cómo usar la función get_template_part() para seguir esas buenas prácticas recomendas por WordPress, dividir todo, para poder hacer después plantillas hijas del theme en curso. Al grano..
Un poco de teoría
Los ficheros principales y necesarios para generar una plantilla son index.php y style.css. A partir de este index.php se podrían importar el resto de los ficheros. A fecha de hoy los principales ficheros que se consideran necesarios para hacer theming de WordPress son:
- header.php
- footer.php
- sidebar.php
Estos tres ficheros los puedes importar dentro del index.php usando las funciones get_header(), get_footer() y get_sidebar(). Hay una función principal que incluye la barra de administración, es wp_footer(). A partir de aquí ya es todo suma y sigue..
Un index.php básico como punto de partida
Por ejemplo un index.php básico podría ser:
<?php
get_header();
if ( have_posts() ) :
while ( have_posts() ) : the_post();
the_content();
endwhile;
else :
_e( 'Sorry, no posts matched your criteria.', 'textdomain' );
endif;
get_sidebar();
get_footer();
wp_footer();Un poco de seguridad
De igual manera a que lo hacemos con los plugins, lo ideal es proteger los ficheros de plantillas para que sólo sean llamados desde WordPress. Así evitaremos que nadie programe ataques directos a estos ficheros.
Bastaría con poner al inicio de cada plantilla:
<?php
defined('ABSPATH') or die('No no no');Igualmente habría que limpiar, comprobar y sanitizar los datos que recibimos en cada plantilla.
El sistema nativo de WordPress para incluir otros ficheros de plantilla
Es lógico usar includes para incluir unas plantillas dentro de otras. Pero WordPress nos sirve de la función get_template_part() para hacernos la vida más fa?il. Por ejemplo, un header.php podría ser:
<?php
defined('ABSPATH') or die('No no no');
?><html>
<head>
<title>Title of the page</title>
<?php
get_template_part('parts/styles');
?>
</head>
<header>
<p>This is the header</p>
</header>El fichero incluido entonces estará en el fichero parts/styles.php que podría ser algo parecido a:
<?php
defined('ABSPATH') or die('No no no');
?><style>
#wpadminbar {
position: initial !important;
}
header {
width: 100%;
border: 2px solid black;
background-color: #808080;
}
</style>Dentro de un fichero se puede volver a incluir así sucesivamente otros ficheros. Lo siguiente interesante a usar es la parametrización para que los ficheros de plantillas puedan recibir información. La función get_template_part() recibe un tercer parámetro.
Por ejemplo, si queremos pasarle el color de fondo de la cabecera podríamos hacer:
<?php
defined('ABSPATH') or die('No no no');
?><html>
<head>
<title>Title of the page</title>
<?php
get_template_part('parts/styles', null, ['the_background_color' => '#808080']);
?>
</head>
<header>
<p>This is the header</p>
</header>Para recibir este parámetro entonces podríamos hacer:
<?php
defined('ABSPATH') or die('No no no');
?><style>
#wpadminbar {
position: initial !important;
}
header {
width: 100%;
border: 2px solid black;
background-color: <?= $args['the_background_color'] ?>;
}
</style>Terminando y unas consideraciones
Para terminar sólo me queda remitirte a la documentación oficial que es muy extensa y está muy bien:
https://developer.wordpress.org/themes/
https://developer.wordpress.org/reference/functions/get_template_part/
Y decir que usar la función get_template_part() es totalmente necesaria si queremos luego hacer temas hijos de nuestro tema. Si usamos en cambio el include de PHP no podremos. Esta función get_template_part() en los temas hijos hará un fallback al tema padre en búsqueda de los ficheros si no los encuentra.
