Apoya mi contenido:

Crear un tema WordPress desde cero

Introducción

Crear un tema personalizado de WordPress desde cero te permite tener control total sobre diseño, funcionalidad y rendimiento. Ya no dependerás de temas existentes que a veces cargan con código innecesario o limitaciones visuales.

¿Tema clásico o tema de bloques (Block Theme)?

Tema clásico: usa archivos PHP (`header.php`, `footer.php`, `single.php`, etc.), ideal si necesitas lógica personalizada en backend.
Tema de bloques / FSE: más moderno, permite editar visualmente partes del sitio, usar `theme.json`, plantillas HTML, etc.

Requisitos previos

Instancia de WordPress funcionando, idealmente en entorno local para pruebas.
Conocimientos básicos de HTML, CSS, PHP, y algo de JavaScript.
Editor de código (VSCode, Sublime, etc.).
Capacidad de FTP o acceso a los archivos del servidor si lo haces en servidor real.

Pasos para crear un tema clásico

Crear carpeta del tema dentro de wp-content/themes/, por ejemplo mi-tema-personal.

Crear style.css con los metadatos del tema. Ejemplo:

/*
Theme Name: Mi Tema Personal
Author: Tu Nombre
Description: Tema personalizado hecho desde cero
Version: 1.0
License: GNU General Public License v2 or later
*/

Crear index.php como plantilla principal. Debe incluir algo como:

<?php get_header(); ?>
<div class="content-area">
  <main>
    <?php
    if ( have_posts() ) {
      while ( have_posts() ) {
        the_post();
        the_title('<h2>','</h2>');
        the_content();
      }
    } else {
      echo '<p>No hay contenido.</p>';
    }
    ?>
  </main>
</div>
<?php get_footer(); ?>

Crear header.php y footer.php para separar estructura general (doctype, , menú, cierre de body/html). Por ejemplo, en header.php incluir:

<!DOCTYPE html>
<html >
<head>
  <meta charset="">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title><?php wp_title('|', true, 'right'); ?><?php bloginfo('name'); ?></title>
  <?php wp_head(); ?>
</head>
<body >
<header>
  <nav>
    <?php wp_nav_menu( array('theme_location' => 'menu-principal') ); ?>
  </nav>
</header>

Crear functions.php para funcionalidades:

<?php
function mtp_setup_theme() {
  add_theme_support( 'title-tag' );
  add_theme_support( 'post-thumbnails' );
  register_nav_menus( array(
    'menu-principal' => 'Menú Principal'
  ) );
}
add_action( 'after_setup_theme', 'mtp_setup_theme' );

function mtp_scripts_styles() {
  wp_enqueue_style( 'style-main', get_stylesheet_uri() );
}
add_action( 'wp_enqueue_scripts', 'mtp_scripts_styles' );
?>

Agregar más plantillas: single.php para mostrar posts individuales, page.php para páginas estáticas, archive.php, 404.php, etc.
Diseño responsivo y CSS: usar Flexbox, Grid, media queries para móviles, tabletas, etc. Probar en distintos dispositivos.
Pruebas y optimización: validar HTML/CSS, probar la velocidad de carga, compatibilidad cross-browser, agregar captura screenshot.png, preparar para producción.

Buenas prácticas

Separar lógica en header.php, footer.php, otros componentes parciales con get_template_part().
No usar estilos en línea, evitar código duplicado.
Seguir convenciones de WordPress (uso de hooks, filtros, funciones del core).
Seguridad: sanitizar entradas, usar esc_html(), wp_nonce_field(), etc.
Internacionalización: permitir que el tema se traduzca (uso de __(), _e(), load_theme_textdomain()).
Accesibilidad: texto legible, contraste adecuado, estructura semántica, navegación por teclado.

Conclusión

Crear un tema desde cero puede tomar tiempo, especialmente al principio, pero los beneficios en control, rendimiento y personalización lo valen. Con los pasos anteriores tendrás una base sólida para construir temas más avanzados o adaptarte según tus necesidades.