{"id":76167,"date":"2024-08-21T09:19:34","date_gmt":"2024-08-21T07:19:34","guid":{"rendered":"https:\/\/kinsta.com\/es\/?p=76167&#038;preview=true&#038;preview_id=76167"},"modified":"2024-08-22T15:09:47","modified_gmt":"2024-08-22T13:09:47","slug":"conceptos-basicos-temas-wordpress","status":"publish","type":"post","link":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/","title":{"rendered":"Conceptos b\u00e1sicos que hay que entender en el desarrollo de temas para WordPress"},"content":{"rendered":"<p>Los temas de WordPress desempe\u00f1an un papel crucial a la hora de dar forma a la apariencia y funcionalidad de tu sitio web. Definen c\u00f3mo se muestra tu contenido y ofrecen varias opciones de dise\u00f1o para crear un sitio \u00fanico. A lo largo de los a\u00f1os, los <a href=\"https:\/\/kinsta.com\/es\/blog\/que-es-un-tema-de-wordpress\/\">temas de WordPress<\/a> han evolucionado significativamente, empezando por lo que ahora llamamos \u00abtemas cl\u00e1sicos\u00bb<\/p>\n<p>Los temas cl\u00e1sicos fueron el est\u00e1ndar durante mucho tiempo, se basaban en <a href=\"https:\/\/kinsta.com\/es\/blog\/plantillas-de-entradas-wordpress\/\">plantillas PHP<\/a> y requer\u00edan algunos conocimientos de programaci\u00f3n para personalizarlos. Estos temas ofrec\u00edan una gran flexibilidad, pero pod\u00edan suponer un reto para los principiantes en el <a href=\"https:\/\/kinsta.com\/web-development\/\">desarrollo web<\/a>. Despu\u00e9s, el lanzamiento de <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-5-9\/\">WordPress 5.9<\/a> supuso un cambio significativo con la introducci\u00f3n de los \u00ab<a href=\"https:\/\/wordpress.org\/documentation\/article\/block-themes\/\" target=\"_blank\" rel=\"noopener noreferrer\">temas de bloques<\/a>\u00bb<\/p>\n<div><\/div><kinsta-auto-toc heading=\"Table of Contents\" exclude=\"last\" list-style=\"arrow\" selector=\"h2\" count-number=\"-1\"><\/kinsta-auto-toc>\n<h2>Temas cl\u00e1sicos de WordPress vs temas de bloques<\/h2>\n<p>Los <a href=\"https:\/\/kinsta.com\/es\/blog\/crear-tema-clasico-de-wordpress\/\">temas cl\u00e1sicos<\/a> son los temas tradicionales de WordPress. Definen el aspecto general de un sitio web utilizando archivos de plantilla escritos en PHP, <a href=\"https:\/\/kinsta.com\/es\/blog\/buenas-practicas-css\/\">CSS<\/a> para el estilo y <a href=\"https:\/\/kinsta.com\/es\/blog\/que-es-javascript\/\">JavaScript<\/a> para a\u00f1adir funcionalidad. Estos temas altamente personalizables han sido la columna vertebral de los sitios de WordPress durante muchos a\u00f1os.<\/p>\n<p>Los temas de bloques, por otro lado, son un nuevo tipo de temas de WordPress introducidos para soportar las capacidades de <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-edicion-sitio-completa\/\">edici\u00f3n completa del sitio<\/a> (FSE). A diferencia de los temas cl\u00e1sicos, utilizan bloques para construir todas las partes de un sitio web, incluidos encabezados, pies de p\u00e1gina y \u00e1reas de contenido. Esto permite una forma m\u00e1s visual e intuitiva de dise\u00f1ar y personalizar sitios web directamente dentro del editor de WordPress.<\/p>\n<p>Las diferencias clave entre los temas cl\u00e1sicos y los de bloques son:<\/p>\n<ol start=\"1\">\n<li><strong>Personalizaci\u00f3n<\/strong> \u2014 Los temas cl\u00e1sicos requieren PHP y algunos conocimientos de programaci\u00f3n, mientras que los temas de bloque utilizan un editor visual para facilitar la personalizaci\u00f3n.<\/li>\n<li><strong>Flexibilidad<\/strong> \u2014 Los temas cl\u00e1sicos ofrecen m\u00e1s flexibilidad a los <a href=\"https:\/\/kinsta.com\/es\/blog\/contratar-desarrollador-de-wordpress\/\">desarrolladores<\/a>, mientras que los temas de bloques se centran en la facilidad de uso y la accesibilidad.<\/li>\n<li><strong>Edici\u00f3n<\/strong> \u2014 Los temas cl\u00e1sicos se editan mediante archivos de tema y el <a href=\"https:\/\/kinsta.com\/es\/blog\/como-personalizar-tema-wordpress\/\">Personalizador de WordPress<\/a>. Los temas de bloques se pueden editar completamente a trav\u00e9s del <a href=\"https:\/\/wordpress.org\/documentation\/article\/wordpress-block-editor\/\" target=\"_blank\" rel=\"noopener noreferrer\">editor de bloques<\/a>.<\/li>\n<\/ol>\n<h3>Elegir qu\u00e9 tipo de tema desarrollar<\/h3>\n<p>Tu elecci\u00f3n entre temas cl\u00e1sicos y de bloques depende de tus necesidades y de tu nivel de conocimientos. Si eres un desarrollador que busca la m\u00e1xima flexibilidad, los temas cl\u00e1sicos pueden ser tu elecci\u00f3n. Sin embargo, si prefieres un enfoque m\u00e1s f\u00e1cil de usar y visual para construir tu sitio, los temas de bloques son una gran opci\u00f3n.<\/p>\n<p>Ambos tipos de temas tienen sus puntos fuertes y son adecuados para distintos tipos de usuarios y proyectos. Comprender las principales diferencias te ayudar\u00e1 a tomar una decisi\u00f3n informada sobre qu\u00e9 tema se adaptar\u00e1 mejor a las necesidades de tu sitio web.<\/p>\n<p>El objetivo de este art\u00edculo es ayudarte a comprender y dominar los conceptos b\u00e1sicos de los temas cl\u00e1sicos y de bloques, para que puedas crear y personalizar temas de WordPress con eficacia.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Crear un tema puede afectar a la apariencia de tu sitio. Siempre es preferible hacer una <a href=\"https:\/\/kinsta.com\/es\/blog\/caracteristicas-copias-de-seguridad-kinsta\/\">copia de seguridad de tu sitio<\/a> primero. Si utilizas un alojamiento como Kinsta, puedes crear un <a href=\"https:\/\/kinsta.com\/es\/docs\/alojamiento-wordpress\/entorno-staging\/\">entorno staging<\/a> en el que trabajar. Una vez que hayas terminado, puedes <a href=\"https:\/\/kinsta.com\/es\/docs\/alojamiento-wordpress\/entorno-staging\/#push-environment-to-live-or-staging\">enviar los cambios al sitio en producci\u00f3n<\/a>. Alternativamente, puedes <a href=\"https:\/\/kinsta.com\/es\/docs\/devkinsta\/integracion-devkinsta\/\">enviar tu sitio a DevKinsta<\/a> o utilizar <a href=\"https:\/\/kinsta.com\/es\/blog\/como-usar-sftp\/\">SFTP\/SSH<\/a> con tu cliente preferido para transferencias seguras de archivos.<\/p>\n<\/aside>\n\n<h2>Comprender la estructura de un tema<\/h2>\n<p>Comprender la estructura de un tema, ya sea cl\u00e1sico o de bloques, es clave para personalizar eficazmente tu sitio de WordPress.<\/p>\n<p>Antes de explorar la estructura de cada tema, debes saber que todos los temas de WordPress se almacenan en el directorio <code>wp-content\/themes<\/code> de tu instalaci\u00f3n de WordPress, y que cada tema reside en su propia carpeta.<\/p>\n<h3>Estructura de un tema cl\u00e1sico<\/h3>\n<p>Un tema cl\u00e1sico consta de varios archivos y directorios clave que crean la apariencia y funcionalidad del sitio. Los dos archivos principales son:<\/p>\n<ol start=\"1\">\n<li><code>style.css<\/code> \u2014 Es la hoja de estilos principal que define el estilo visual del tema. Incluye metadatos sobre el tema (como nombre, autor y versi\u00f3n) en la parte superior, seguidos de reglas CSS que dan estilo al tema.<\/li>\n<li><code>index.php<\/code> \u2014 Es el archivo de plantilla principal que se utiliza para mostrar el contenido de la p\u00e1gina de inicio. Act\u00faa como alternativa para otros archivos de plantilla que puedan faltar.<\/li>\n<\/ol>\n<p>Adem\u00e1s de \u00e9stos, otros archivos importantes permiten un dise\u00f1o modular y garantizan que las diferentes partes del sitio puedan personalizarse y mantenerse f\u00e1cilmente. Aunque son opcionales, estos archivos se consideran est\u00e1ndar:<\/p>\n<ul>\n<li><code>header.php<\/code> \u2014 Este archivo contiene la secci\u00f3n de cabecera del tema, que incluye el t\u00edtulo del sitio, el logotipo y el men\u00fa de navegaci\u00f3n. Se incluye en la parte superior de cada p\u00e1gina, garantizando una cabecera de p\u00e1gina coherente.<\/li>\n<li><code>footer.php<\/code> \u2014 Este archivo contiene la secci\u00f3n de pie de p\u00e1gina del tema, que a menudo incluye informaci\u00f3n sobre derechos de autor y navegaci\u00f3n a pie de p\u00e1gina. Se incluye en la parte inferior de cada p\u00e1gina, proporcionando un pie de p\u00e1gina coherente en todo el sitio.<\/li>\n<li><code>functions.php<\/code> \u2014 Este archivo se utiliza para a\u00f1adir funciones personalizadas al tema. Puede registrar men\u00fas, encolar estilos y scripts, y a\u00f1adir funciones de apoyo al tema como miniaturas de entradas y fondos personalizados. Esencialmente, act\u00faa como un centro de control para las personalizaciones y mejoras del tema.<\/li>\n<li><code>page.php<\/code> <code>single.php<\/code> <code>archive.php<\/code>, etc. \u2014 Estos archivos de plantilla definen la estructura de diferentes tipos de contenido, como p\u00e1ginas, entradas individuales y archivos.<\/li>\n<\/ul>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Puedes consultar este art\u00edculo detallado para obtener una gu\u00eda paso a paso sobre la <a href=\"https:\/\/kinsta.com\/es\/blog\/crear-tema-clasico-de-wordpress\/\">creaci\u00f3n de temas cl\u00e1sicos de WordPress<\/a>.<\/p>\n<\/aside>\n\n<h3>Estructura de un tema de bloques<\/h3>\n<p>Un tema de bloques se compone de varios archivos y directorios clave que est\u00e1n dise\u00f1ados espec\u00edficamente para trabajar con bloques y las funciones FSE. Los archivos y carpetas principales son:<\/p>\n<ol start=\"1\">\n<li><code>theme.json<\/code> \u2014 Este archivo es crucial para configurar los ajustes, estilos y personalizaciones del tema. Define estilos y ajustes globales para los bloques, proporcionando una forma centralizada de gestionar la apariencia y el comportamiento del tema. Sustituye a la necesidad de mucho c\u00f3digo PHP personalizado y permite configurar f\u00e1cilmente los colores, la tipograf\u00eda, el espaciado y mucho m\u00e1s.<\/li>\n<li><code>style.css<\/code> \u2014 Aunque la mayor parte del estilo se gestiona dentro de <code>theme.json<\/code>, de forma similar a los temas cl\u00e1sicos <code>style.css<\/code> se sigue utilizando para declarar los metadatos del tema, como el nombre del tema, el autor, la versi\u00f3n y la descripci\u00f3n.<\/li>\n<li><code>templates\/<\/code> \u2014 Este directorio contiene archivos HTML que definen el dise\u00f1o de las distintas partes del sitio. Estos archivos incluyen plantillas como index.html para la p\u00e1gina de inicio, <code>single.html<\/code> para entradas individuales, <code>page.html<\/code> para p\u00e1ginas, y m\u00e1s. Cada archivo se construye utilizando bloques.<\/li>\n<li><code>parts\/<\/code> \u2014 Este directorio contiene secciones reutilizables de las plantillas, como encabezados y pies de p\u00e1gina. Estas partes pueden incluirse en varias plantillas, garantizando la coherencia en todo el sitio.<\/li>\n<\/ol>\n<p>Aunque no son obligatorios, los <a href=\"https:\/\/kinsta.com\/es\/blog\/patrones-de-bloques-wordpress\/\">patrones<\/a> tambi\u00e9n son importantes a la hora de desarrollar temas avanzados. Los patrones son dise\u00f1os de bloques predefinidos que pueden insertarse en p\u00e1ginas y entradas, proporcionando una forma r\u00e1pida de crear dise\u00f1os complejos.<\/p>\n<p>Con los temas de bloques, puedes decidir no crear la estructura del tema manualmente. Puedes agilizar el proceso de configuraci\u00f3n utilizando el plugin <a href=\"https:\/\/wordpress.org\/plugins\/create-block-theme\/\" target=\"_blank\" rel=\"noopener noreferrer\">Crear Tema de Bloques<\/a>, que re\u00fane todos los archivos y detalles necesarios.<\/p>\n<figure style=\"width: 1001px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/08\/create-block-theme.png\" alt=\"Plugin Create block theme\" width=\"1001\" height=\"471\"><figcaption class=\"wp-caption-text\">Plugin Create block theme<\/figcaption><\/figure>\n<p>Una vez que hayas rellenado los detalles, se crear\u00e1 una nueva carpeta del tema en el directorio <code>wp-content\/themes<\/code>, y el nuevo tema aparecer\u00e1 en el \u00e1rea de <a href=\"https:\/\/kinsta.com\/es\/blog\/panel-control-administracion-wordpress\/\">administraci\u00f3n de WordPress<\/a>, en <strong>Apariencia<\/strong> &gt; <strong>Temas<\/strong>. Puedes a\u00f1adir m\u00e1s detalles del tema en la configuraci\u00f3n de la meta descripci\u00f3n de <code>style.css<\/code>.<\/p>\n<h2>Jerarqu\u00eda de plantillas del tema de WordPress<\/h2>\n<p>La jerarqu\u00eda de plantillas dicta qu\u00e9 archivo(s) de plantilla utiliza WordPress para mostrar los distintos tipos de contenido. Tanto los temas cl\u00e1sicos como los temas de bloque siguen una jerarqu\u00eda similar, pero difieren en los tipos de archivo que utilizan: los temas cl\u00e1sicos utilizan archivos <a href=\"https:\/\/kinsta.com\/es\/blog\/que-es-php\/\">PHP<\/a>, mientras que los temas de bloque utilizan archivos <a href=\"https:\/\/kinsta.com\/es\/blog\/que-es-el-html\/\">HTML<\/a>.<\/p>\n<p>La jerarqu\u00eda de plantillas sigue un orden espec\u00edfico para determinar qu\u00e9 archivo de plantilla utilizar. Si WordPress no puede encontrar un archivo de plantilla espec\u00edfico, pasar\u00e1 al siguiente en la jerarqu\u00eda.<\/p>\n<p>Por ejemplo, cuando WordPress necesita mostrar una \u00fanica entrada de blog, primero busca una plantilla espec\u00edfica para el tipo de entrada, como <code>single-{post-type}.php<\/code> o <code>single-{post-type}.html<\/code>. Si ese archivo no existe, buscar\u00e1 el gen\u00e9rico <code>single.php<\/code> o <code>single.html<\/code>. Si no encuentra ninguno de estos archivos, WordPress recurrir\u00e1 a la plantilla m\u00e1s gen\u00e9rica <code>index.php<\/code> o <code>index.html<\/code>.<\/p>\n<p>El mismo proceso se aplica a otros tipos de contenido. Para una p\u00e1gina est\u00e1tica, WordPress buscar\u00e1 primero cualquier plantilla personalizada asignada a esa p\u00e1gina. Si no encuentra ninguna, buscar\u00e1 una plantilla basada en el slug de la p\u00e1gina (por ejemplo, <code>page-about.php<\/code> o <code>page-about.html<\/code>) o en su ID (<code>page-42.php<\/code> o <code>page-42.html<\/code>). Si estas plantillas espec\u00edficas no est\u00e1n disponibles, WordPress utiliza las generales <code>page.php<\/code> o <code>page.html<\/code>. Si incluso \u00e9stas faltan, recurre a <code>index.php<\/code> o <code>index.html<\/code>.<\/p>\n<h2>Crear plantillas<\/h2>\n<p>Crear plantillas en WordPress te permite personalizar c\u00f3mo se muestran los distintos tipos de contenido en tu sitio web. Tanto si trabajas con temas cl\u00e1sicos como con temas de bloques, el proceso implica establecer los archivos necesarios y configurarlos seg\u00fan tus necesidades.<\/p>\n<p>Vamos a configurar una plantilla de p\u00e1gina para ambos tipos de temas.<\/p>\n<h3>Plantilla de p\u00e1gina para temas cl\u00e1sicos<\/h3>\n<p>En los temas cl\u00e1sicos, creas una plantilla de p\u00e1gina utilizando PHP. Aqu\u00ed tienes c\u00f3mo hacerlo:<\/p>\n<ol start=\"1\">\n<li><strong>Crea el archivo de plantilla<\/strong> \u2014 Utilizando un <a href=\"https:\/\/kinsta.com\/es\/blog\/mejores-editores-texto\/\">editor de texto<\/a>, crea un nuevo archivo PHP en el directorio de tu tema y ll\u00e1malo <code>page.php<\/code>.<\/li>\n<li><strong>A\u00f1ade c\u00f3digo de plantilla<\/strong> \u2014 Escribe el c\u00f3digo PHP necesario para definir la estructura y el contenido de la plantilla de p\u00e1gina. Esto suele incluir etiquetas de plantilla de WordPress para mostrar el contenido de la p\u00e1gina.<\/li>\n<li><strong>Incluye el encabezado y el pie de p\u00e1gina<\/strong> \u2014 Aseg\u00farate de que tu plantilla incluye el encabezado y el pie de p\u00e1gina a\u00f1adiendo las funciones <code>get_header()<\/code> y <code>get_footer()<\/code>. Esto mantiene el dise\u00f1o coherente con el resto de tu sitio.<\/li>\n<\/ol>\n<p>Aqu\u00ed tienes un ejemplo del aspecto que podr\u00eda tener <code>page.php<\/code>:<\/p>\n<pre><code class=\"language-php\">&lt;?php\nget_header(); ?&gt;\n\n&lt;main&gt;\n    &lt;h1&gt;&lt;?php the_title(); ?&gt;&lt;\/h1&gt;\n    &lt;div&gt;&lt;?php the_content(); ?&gt;&lt;\/div&gt;\n&lt;\/main&gt;\n\n&lt;?php get_footer(); ?&gt;<\/code><\/pre>\n<p>En este ejemplo, la plantilla incluye la cabecera, muestra el t\u00edtulo y el contenido de la p\u00e1gina y, a continuaci\u00f3n, incluye el pie de p\u00e1gina.<\/p>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Aseg\u00farate de que ya tienes declaradas las plantillas <code>header.php<\/code> y <code>footer.php<\/code>. Obt\u00e9n m\u00e1s informaci\u00f3n sobre c\u00f3mo funcionan <a href=\"https:\/\/kinsta.com\/es\/blog\/crear-tema-clasico-de-wordpress\/#step-4-create-the-header-file\">en esta gu\u00eda<\/a>.<\/p>\n<\/aside>\n\n<h3>Plantilla de p\u00e1gina de tema de bloques<\/h3>\n<p>En los temas de bloques, la creaci\u00f3n de una plantilla de p\u00e1gina puede hacerse a trav\u00e9s del Editor de Sitios de WordPress o creando un archivo <code>page.html<\/code> en el directorio de plantillas.<\/p>\n<p>Una vez creado este archivo, puedes dise\u00f1ar un dise\u00f1o navegando al editor del sitio (<strong>Apariencia<\/strong> &gt; <strong>Editor<\/strong> en tu panel de control de WordPress).<\/p>\n<p>Utiliza el editor de bloques para a\u00f1adir y organizar bloques para dise\u00f1ar el dise\u00f1o de tu p\u00e1gina. Puedes a\u00f1adir bloques para el t\u00edtulo de la p\u00e1gina, la imagen destacada y el contenido. Personaliza cada bloque seg\u00fan tus preferencias de dise\u00f1o.<\/p>\n<figure style=\"width: 1001px\" class=\"wp-caption alignnone\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/kinsta.com\/wp-content\/uploads\/2024\/08\/block-editor.png\" alt=\"Personaliza la plantilla de p\u00e1gina con el editor de bloques.\" width=\"1001\" height=\"471\"><figcaption class=\"wp-caption-text\">Personaliza la plantilla de p\u00e1gina con el editor de bloques.<\/figcaption><\/figure>\n<p>Cuando est\u00e9s satisfecho con el dise\u00f1o, guarda la plantilla. WordPress generar\u00e1 autom\u00e1ticamente el archivo HTML correspondiente en el directorio de tu tema.<\/p>\n<h2>Dise\u00f1o de Estilos para temas<\/h2>\n<p>Dar estilo a tu tema de WordPress es un paso crucial para definir la apariencia visual de tu sitio web. Tanto los temas cl\u00e1sicos como los temas en bloque ofrecen s\u00f3lidas formas de personalizar los estilos, pero lo enfocan de forma diferente.<\/p>\n<h3>Dise\u00f1o de estilos para temas cl\u00e1sicos<\/h3>\n<p>En los temas cl\u00e1sicos, el estilo se gestiona normalmente mediante CSS. A continuaci\u00f3n te explicamos c\u00f3mo puedes dar estilo a un tema cl\u00e1sico:<\/p>\n<p>La hoja de estilos principal de un tema cl\u00e1sico es el archivo <code>style.css<\/code>. Este archivo contiene todas las reglas CSS que definen el aspecto de tu tema. Tambi\u00e9n es donde declaras los metadatos del tema, como el nombre del tema, el autor, la versi\u00f3n y la descripci\u00f3n.<\/p>\n<p>Para asegurarte de que tu CSS se carga correctamente, tienes que encolar tu hoja de estilos en el archivo <code>functions.php<\/code> utilizando la funci\u00f3n <code>wp_enqueue_style()<\/code>.<\/p>\n<pre><code class=\"language-js\">function my_theme_enqueue_styles() {\n    wp_enqueue_style('my-theme-style', get_stylesheet_uri());\n}\nadd_action('wp_enqueue_scripts', 'my_theme_enqueue_styles');<\/code><\/pre>\n<p>Este paso es crucial para mantener los est\u00e1ndares adecuados de WordPress y garantizar que los estilos se aplican correctamente.<\/p>\n<p>Adem\u00e1s, puedes a\u00f1adir CSS personalizado directamente al archivo <code>style.css<\/code> o crear archivos CSS independientes para diferentes partes de tu tema. El CSS personalizado tambi\u00e9n puede incrustarse dentro de archivos de plantilla individuales utilizando la etiqueta <code>&lt;style&gt;<\/code>, aunque esta pr\u00e1ctica suele ser menos habitual y s\u00f3lo se recomienda para estilos espec\u00edficos y aislados.<\/p>\n<p>Para estilos m\u00e1s avanzados, puedes utilizar preprocesadores CSS como <a href=\"https:\/\/www.frontendmentor.io\/articles\/css-preprocessors-sass-or-less-which-to-choose-JOI20I1xNL#:~:text=Less%20provides%20flexibility%20for%20larger,Sass%2C%20Less%20encourages%20code%20organization.\" target=\"_blank\" rel=\"noopener noreferrer\">SASS o LESS<\/a>. Estas herramientas te permiten escribir un CSS m\u00e1s f\u00e1cil de mantener y modular, facilitando la gesti\u00f3n y ampliaci\u00f3n de los estilos de tu tema.<\/p>\n<h3>Estilizar temas de bloques<\/h3>\n<p>Los temas de bloques de estilo se gestionan principalmente a trav\u00e9s del archivo <code>theme.json<\/code> y del editor de bloques.<\/p>\n<p>El archivo <code>theme.json<\/code> es el lugar central para configurar los estilos y ajustes globales de tu tema. Este archivo te permite definir colores, tipograf\u00edas, espaciado y otros estilos en un formato JSON estructurado, proporcionando una forma centralizada de gestionar la apariencia y el comportamiento del tema. Los estilos globales definidos en <code>theme.json<\/code> se aplican a todo tu sitio, garantizando un aspecto y una sensaci\u00f3n coherente.<\/p>\n<p>Adem\u00e1s de <code>theme.json<\/code>, puedes utilizar el editor de bloques para aplicar estilos personalizados directamente a los bloques. El editor de bloques te permite ver los cambios en tiempo real y ajustar el dise\u00f1o visualmente sin necesidad de escribir c\u00f3digo manualmente. Esto hace que el proceso sea m\u00e1s accesible, especialmente para quienes prefieren una interfaz visual a la programaci\u00f3n.<\/p>\n<p>Aunque el archivo <code>theme.json<\/code> gestiona la mayor parte del estilo, puedes utilizar CSS para un control m\u00e1s granular. El CSS personalizado puede a\u00f1adirse al archivo <code>style.css<\/code> o directamente dentro de bloques individuales utilizando el editor de bloques.<\/p>\n<p>Un ejemplo de archivo <code>theme.json<\/code> podr\u00eda incluir ajustes para paletas de colores, tipograf\u00eda y estilos de bloque, facilitando la gesti\u00f3n y personalizaci\u00f3n del dise\u00f1o del tema.<\/p>\n<pre><code class=\"language-json\">{\n  \"version\": 2,\n  \"settings\": {\n    \"color\": {\n      \"palette\": [\n        {\n          \"name\": \"Primary\",\n          \"slug\": \"primary\",\n          \"color\": \"#0073aa\"\n        },\n        {\n          \"name\": \"Secondary\",\n          \"slug\": \"secondary\",\n          \"color\": \"#005177\"\n        }\n      ]\n    },\n    \"typography\": {\n      \"fontSizes\": [\n        {\n          \"name\": \"Small\",\n          \"slug\": \"small\",\n          \"size\": \"12px\"\n        },\n        {\n          \"name\": \"Normal\",\n          \"slug\": \"normal\",\n          \"size\": \"16px\"\n        }\n      ]\n    }\n  },\n  \"styles\": {\n    \"color\": {\n      \"background\": \"#ffffff\",\n      \"text\": \"#333333\"\n    },\n    \"typography\": {\n      \"fontFamily\": \"Arial, sans-serif\"\n    }\n  }\n}<\/code><\/pre>\n<aside role=\"note\" class=\"wp-block-kinsta-notice is-style-info\">\n            <h3>Info<\/h3>\n        <p>Puedes aprender m\u00e1s sobre el poder de <code>theme.json<\/code> en nuestra gu\u00eda sobre c\u00f3mo <a href=\"https:\/\/kinsta.com\/es\/blog\/theme-json\/\">personalizar tu tema de bloques de WordPress como un profesional<\/a>.<\/p>\n<\/aside>\n\n<h2>Personalizar temas<\/h2>\n<p>Personalizar los temas de WordPress te permite adaptar la apariencia y funcionalidad de tu sitio web para satisfacer necesidades y preferencias espec\u00edficas. Tanto los temas cl\u00e1sicos como los de bloques ofrecen varios m\u00e9todos de personalizaci\u00f3n, pero lo enfocan de forma diferente.<\/p>\n<h3>Personalizar temas cl\u00e1sicos<\/h3>\n<p>Los temas cl\u00e1sicos ofrecen varias formas de personalizar el aspecto de tu sitio:<\/p>\n<ol start=\"1\">\n<li><strong>Personalizador de Temas<\/strong> \u2014 El Personalizador de Temas de WordPress es una interfaz f\u00e1cil de usar que te permite hacer cambios en la apariencia de tu tema sin tocar ning\u00fan c\u00f3digo. Puedes acceder a \u00e9l a trav\u00e9s de <strong>Apariencia<\/strong> &gt; <strong>Personalizar<\/strong>. Ofrece opciones para modificar la identidad del sitio, los colores, los men\u00fas, los widgets y mucho m\u00e1s. Los cambios se pueden previsualizar en tiempo real antes de guardarlos.<\/li>\n<li><strong>CSS Personalizado<\/strong> \u2014 Para cambios de estilo m\u00e1s espec\u00edficos, puedes a\u00f1adir CSS personalizado directamente en el Personalizador de Temas, en la secci\u00f3n <a href=\"https:\/\/kinsta.com\/es\/blog\/css-wordpress\/\">CSS adicional<\/a>. Este m\u00e9todo es ideal para hacer peque\u00f1os retoques sin editar los archivos del tema.<\/li>\n<li><strong>Temas hijo<\/strong> \u2014 Si necesitas hacer modificaciones extensas, crear un <a href=\"https:\/\/kinsta.com\/es\/blog\/temas-child-wordpress\/\">tema hijo<\/a> es el m\u00e9todo recomendado. Un tema hijo hereda la funcionalidad del tema padre y te permite anular o a\u00f1adir nuevos estilos y caracter\u00edsticas. Esto garantiza que tus personalizaciones se conserven cuando se actualice el tema padre.<\/li>\n<li><strong>Archivos de tema<\/strong> \u2014 Los usuarios avanzados pueden editar directamente los archivos de tema, como <code>header.php<\/code>, <code>footer.php<\/code>, y <code>functions.php<\/code>, para realizar cambios m\u00e1s significativos. Sin embargo, este m\u00e9todo requiere un buen conocimiento de PHP y de la jerarqu\u00eda de plantillas de WordPress.<\/li>\n<li><strong>Plugins<\/strong> \u2014 Hay numerosos plugins disponibles que ampl\u00edan las capacidades de personalizaci\u00f3n de tu tema. Por ejemplo, los <a href=\"https:\/\/kinsta.com\/es\/blog\/constructores-pagina-wordpress\/\">plugins constructores de p\u00e1ginas<\/a> como <a href=\"https:\/\/kinsta.com\/es\/blog\/wordpress-elementor\/\">Elementor<\/a> te permiten crear dise\u00f1os complejos sin programar.<\/li>\n<\/ol>\n<h3>Personalizar temas de bloques<\/h3>\n<p>Con su \u00e9nfasis en FSE, los temas de bloques ofrecen un enfoque m\u00e1s visual y f\u00e1cil de usar para la personalizaci\u00f3n:<\/p>\n<ol start=\"1\">\n<li><strong>Editor del Sitio<\/strong> \u2014 El Editor del sitio de WordPress (<strong>Apariencia<\/strong> &gt; <strong>Editor<\/strong>) es la herramienta principal para personalizar los temas de bloques. Te permite modificar todos los aspectos de tu sitio, incluidos encabezados, pies de p\u00e1gina, plantillas y bloques individuales, utilizando una interfaz visual. Los cambios se aplican instant\u00e1neamente, por lo que es f\u00e1cil ver c\u00f3mo tus ajustes afectan al dise\u00f1o del sitio.<\/li>\n<li><strong>Estilos globales<\/strong> \u2014 Los temas de bloques utilizan el archivo <code>theme.json<\/code> para definir estilos globales. Puedes personalizar los colores, la tipograf\u00eda, el espaciado y mucho m\u00e1s de forma global, garantizando la coherencia en todo tu sitio. El Editor de Sitios tambi\u00e9n te permite ajustar estos par\u00e1metros visualmente.<\/li>\n<li><strong>Bloques y patrones reutilizables<\/strong> \u2014 Puedes crear bloques y patrones reutilizables para mantener la coherencia y agilizar el proceso de dise\u00f1o. Los bloques reutilizables se pueden guardar e insertar en cualquier entrada o p\u00e1gina, mientras que los patrones de bloques proporcionan dise\u00f1os predefinidos que se pueden personalizar para adaptarlos a tus necesidades.<\/li>\n<li><strong>Plantillas personalizadas<\/strong> \u2014 Con los temas de bloques, puedes crear plantillas personalizadas para diferentes tipos de contenido directamente dentro del Editor de Sitios. Esto te permite personalizar la disposici\u00f3n y el dise\u00f1o de p\u00e1ginas o tipos de entrada espec\u00edficos sin escribir ning\u00fan c\u00f3digo.<\/li>\n<li><strong>Plugins<\/strong> \u2014 Al igual que los temas cl\u00e1sicos, los temas de bloque tambi\u00e9n pueden ampliarse con plugins. Muchos plugins est\u00e1n dise\u00f1ados para mejorar las capacidades del editor de bloques, ofreciendo bloques, patrones y opciones de personalizaci\u00f3n adicionales.<\/li>\n<\/ol>\n<h2>Resumen<\/h2>\n<p>Personalizar los temas de WordPress te permite hacer que tu sitio sea \u00fanico y funcional. Los temas cl\u00e1sicos se basan en el Personalizador de Temas, CSS personalizado, temas hijo y ediciones directas de archivos para conseguir flexibilidad. Los temas de bloques utilizan el Editor de Sitios y <code>theme.json<\/code> para un enfoque m\u00e1s visual e intuitivo.<\/p>\n<p>Ambos m\u00e9todos ofrecen potentes herramientas para adaptar tu sitio a tus necesidades, tanto si prefieres la programaci\u00f3n como la personalizaci\u00f3n visual.<\/p>\n<p>Despu\u00e9s de crear un tema que se adapte a tus gustos, ya sea un tema cl\u00e1sico o de bloques, es importante alojar tu sitio en un alojamiento robusto para evitar problemas como <a href=\"https:\/\/kinsta.com\/es\/blog\/inactividad-del-sitio\/\">tiempos de inactividad<\/a>, <a href=\"https:\/\/kinsta.com\/es\/blog\/prevenir-ataques-ddos\/\">ataques DDoS<\/a> y otros. Aqu\u00ed es donde brillan los proveedores de alojamiento premium como Kinsta.<\/p>\n<p>Kinsta ofrece un potente <a href=\"https:\/\/kinsta.com\/es\/wordpress-hosting\/\">Alojamiento Administrado de WordPress<\/a>\u00a0con una arquitectura totalmente en contenedores, impulsado exclusivamente por <a href=\"https:\/\/kinsta.com\/es\/blog\/plataforma-en-la-nube-para-desarrolladores\/\">Google Cloud Platform<\/a> en la red de Nivel Premium de Google.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Los temas de WordPress desempe\u00f1an un papel crucial a la hora de dar forma a la apariencia y funcionalidad de tu sitio web. Definen c\u00f3mo se &#8230;<\/p>\n","protected":false},"author":287,"featured_media":76168,"comment_status":"open","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"_kinsta_gated_content":false,"_kinsta_gated_content_redirect":"","footnotes":""},"tags":[],"topic":[1345,1355],"class_list":["post-76167","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","topic-desarrollo-wordpress","topic-temas-wordpress"],"yoast_head":"<!-- This site is optimized with the Yoast SEO Premium plugin v24.6 (Yoast SEO v24.6) - https:\/\/yoast.com\/wordpress\/plugins\/seo\/ -->\n<title>Conceptos b\u00e1sicos en el desarrollo de temas para WordPress - Kinsta\u00ae<\/title>\n<meta name=\"description\" content=\"Descubre los conceptos esenciales del desarrollo de temas de WordPress, incluidos los temas cl\u00e1sicos y de bloques, la jerarqu\u00eda de plantillas y los tipos de entrada personalizados.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/\" \/>\n<meta property=\"og:locale\" content=\"es_ES\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"Conceptos b\u00e1sicos que hay que entender en el desarrollo de temas para WordPress\" \/>\n<meta property=\"og:description\" content=\"Descubre los conceptos esenciales del desarrollo de temas de WordPress, incluidos los temas cl\u00e1sicos y de bloques, la jerarqu\u00eda de plantillas y los tipos de entrada personalizados.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/\" \/>\n<meta property=\"og:site_name\" content=\"Kinsta\u00ae\" \/>\n<meta property=\"article:publisher\" content=\"https:\/\/www.facebook.com\/kinsta.es\/\" \/>\n<meta property=\"article:published_time\" content=\"2024-08-21T07:19:34+00:00\" \/>\n<meta property=\"article:modified_time\" content=\"2024-08-22T13:09:47+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png\" \/>\n\t<meta property=\"og:image:width\" content=\"1470\" \/>\n\t<meta property=\"og:image:height\" content=\"735\" \/>\n\t<meta property=\"og:image:type\" content=\"image\/png\" \/>\n<meta name=\"author\" content=\"Joel Olawanle\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:description\" content=\"Descubre los conceptos esenciales del desarrollo de temas de WordPress, incluidos los temas cl\u00e1sicos y de bloques, la jerarqu\u00eda de plantillas y los tipos de entrada personalizados.\" \/>\n<meta name=\"twitter:image\" content=\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development-1024x512.png\" \/>\n<meta name=\"twitter:creator\" content=\"@olawanle_joel\" \/>\n<meta name=\"twitter:site\" content=\"@Kinsta_ES\" \/>\n<meta name=\"twitter:label1\" content=\"Escrito por\" \/>\n\t<meta name=\"twitter:data1\" content=\"Joel Olawanle\" \/>\n\t<meta name=\"twitter:label2\" content=\"Tiempo de lectura\" \/>\n\t<meta name=\"twitter:data2\" content=\"17 minutos\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":\"Article\",\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#article\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/\"},\"author\":{\"name\":\"Joel Olawanle\",\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/person\/efa7de30245ca15be5ce1dcacff89c07\"},\"headline\":\"Conceptos b\u00e1sicos que hay que entender en el desarrollo de temas para WordPress\",\"datePublished\":\"2024-08-21T07:19:34+00:00\",\"dateModified\":\"2024-08-22T13:09:47+00:00\",\"mainEntityOfPage\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/\"},\"wordCount\":3278,\"commentCount\":0,\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/es\/#organization\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png\",\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"CommentAction\",\"name\":\"Comment\",\"target\":[\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#respond\"]}]},{\"@type\":\"WebPage\",\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/\",\"url\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/\",\"name\":\"Conceptos b\u00e1sicos en el desarrollo de temas para WordPress - Kinsta\u00ae\",\"isPartOf\":{\"@id\":\"https:\/\/kinsta.com\/es\/#website\"},\"primaryImageOfPage\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#primaryimage\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#primaryimage\"},\"thumbnailUrl\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png\",\"datePublished\":\"2024-08-21T07:19:34+00:00\",\"dateModified\":\"2024-08-22T13:09:47+00:00\",\"description\":\"Descubre los conceptos esenciales del desarrollo de temas de WordPress, incluidos los temas cl\u00e1sicos y de bloques, la jerarqu\u00eda de plantillas y los tipos de entrada personalizados.\",\"breadcrumb\":{\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#breadcrumb\"},\"inLanguage\":\"es\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/\"]}]},{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#primaryimage\",\"url\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png\",\"contentUrl\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png\",\"width\":1470,\"height\":735},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/kinsta.com\/es\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Temas WordPress\",\"item\":\"https:\/\/kinsta.com\/es\/secciones\/temas-wordpress\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"Conceptos b\u00e1sicos que hay que entender en el desarrollo de temas para WordPress\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/kinsta.com\/es\/#website\",\"url\":\"https:\/\/kinsta.com\/es\/\",\"name\":\"Kinsta\u00ae\",\"description\":\"Soluciones de alojamiento premium, r\u00e1pidas y seguras\",\"publisher\":{\"@id\":\"https:\/\/kinsta.com\/es\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/kinsta.com\/es\/?s={search_term_string}\"},\"query-input\":{\"@type\":\"PropertyValueSpecification\",\"valueRequired\":true,\"valueName\":\"search_term_string\"}}],\"inLanguage\":\"es\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/kinsta.com\/es\/#organization\",\"name\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/es\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2023\/12\/kinsta-logo.jpeg\",\"contentUrl\":\"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2023\/12\/kinsta-logo.jpeg\",\"width\":500,\"height\":500,\"caption\":\"Kinsta\"},\"image\":{\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/logo\/image\/\"},\"sameAs\":[\"https:\/\/www.facebook.com\/kinsta.es\/\",\"https:\/\/x.com\/Kinsta_ES\",\"https:\/\/www.instagram.com\/kinstahosting\/\",\"https:\/\/www.linkedin.com\/company\/kinsta\/\",\"https:\/\/www.pinterest.com\/kinstahosting\/\",\"https:\/\/www.youtube.com\/c\/Kinsta\"]},{\"@type\":\"Person\",\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/person\/efa7de30245ca15be5ce1dcacff89c07\",\"name\":\"Joel Olawanle\",\"image\":{\"@type\":\"ImageObject\",\"inLanguage\":\"es\",\"@id\":\"https:\/\/kinsta.com\/es\/#\/schema\/person\/image\/\",\"url\":\"https:\/\/secure.gravatar.com\/avatar\/051bf577ce2c837846a1db9eef184758?s=96&d=mm&r=g\",\"contentUrl\":\"https:\/\/secure.gravatar.com\/avatar\/051bf577ce2c837846a1db9eef184758?s=96&d=mm&r=g\",\"caption\":\"Joel Olawanle\"},\"description\":\"Joel is a Frontend developer working at Kinsta as a Technical Editor. He is a passionate teacher with love for open source and has written over 300 technical articles majorly around JavaScript and it's frameworks.\",\"sameAs\":[\"https:\/\/joelolawanle.com\/\",\"https:\/\/www.linkedin.com\/in\/olawanlejoel\/\",\"https:\/\/x.com\/olawanle_joel\",\"https:\/\/www.youtube.com\/@joelolawanle\"],\"gender\":\"male\",\"knowsAbout\":[\"JavaScript\",\"React\",\"Next.js\"],\"knowsLanguage\":[\"English\"],\"jobTitle\":\"Technical Editor\",\"worksFor\":\"Kinsta\",\"url\":\"https:\/\/kinsta.com\/es\/blog\/author\/joelolawanle\/\"}]}<\/script>\n<!-- \/ Yoast SEO Premium plugin. -->","yoast_head_json":{"title":"Conceptos b\u00e1sicos en el desarrollo de temas para WordPress - Kinsta\u00ae","description":"Descubre los conceptos esenciales del desarrollo de temas de WordPress, incluidos los temas cl\u00e1sicos y de bloques, la jerarqu\u00eda de plantillas y los tipos de entrada personalizados.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/","og_locale":"es_ES","og_type":"article","og_title":"Conceptos b\u00e1sicos que hay que entender en el desarrollo de temas para WordPress","og_description":"Descubre los conceptos esenciales del desarrollo de temas de WordPress, incluidos los temas cl\u00e1sicos y de bloques, la jerarqu\u00eda de plantillas y los tipos de entrada personalizados.","og_url":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/","og_site_name":"Kinsta\u00ae","article_publisher":"https:\/\/www.facebook.com\/kinsta.es\/","article_published_time":"2024-08-21T07:19:34+00:00","article_modified_time":"2024-08-22T13:09:47+00:00","og_image":[{"width":1470,"height":735,"url":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png","type":"image\/png"}],"author":"Joel Olawanle","twitter_card":"summary_large_image","twitter_description":"Descubre los conceptos esenciales del desarrollo de temas de WordPress, incluidos los temas cl\u00e1sicos y de bloques, la jerarqu\u00eda de plantillas y los tipos de entrada personalizados.","twitter_image":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development-1024x512.png","twitter_creator":"@olawanle_joel","twitter_site":"@Kinsta_ES","twitter_misc":{"Escrito por":"Joel Olawanle","Tiempo de lectura":"17 minutos"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":"Article","@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#article","isPartOf":{"@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/"},"author":{"name":"Joel Olawanle","@id":"https:\/\/kinsta.com\/es\/#\/schema\/person\/efa7de30245ca15be5ce1dcacff89c07"},"headline":"Conceptos b\u00e1sicos que hay que entender en el desarrollo de temas para WordPress","datePublished":"2024-08-21T07:19:34+00:00","dateModified":"2024-08-22T13:09:47+00:00","mainEntityOfPage":{"@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/"},"wordCount":3278,"commentCount":0,"publisher":{"@id":"https:\/\/kinsta.com\/es\/#organization"},"image":{"@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png","inLanguage":"es","potentialAction":[{"@type":"CommentAction","name":"Comment","target":["https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#respond"]}]},{"@type":"WebPage","@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/","url":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/","name":"Conceptos b\u00e1sicos en el desarrollo de temas para WordPress - Kinsta\u00ae","isPartOf":{"@id":"https:\/\/kinsta.com\/es\/#website"},"primaryImageOfPage":{"@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#primaryimage"},"image":{"@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#primaryimage"},"thumbnailUrl":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png","datePublished":"2024-08-21T07:19:34+00:00","dateModified":"2024-08-22T13:09:47+00:00","description":"Descubre los conceptos esenciales del desarrollo de temas de WordPress, incluidos los temas cl\u00e1sicos y de bloques, la jerarqu\u00eda de plantillas y los tipos de entrada personalizados.","breadcrumb":{"@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#breadcrumb"},"inLanguage":"es","potentialAction":[{"@type":"ReadAction","target":["https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/"]}]},{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#primaryimage","url":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png","contentUrl":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2024\/08\/core-concepts-to-understand-in-wordPress-theme-development.png","width":1470,"height":735},{"@type":"BreadcrumbList","@id":"https:\/\/kinsta.com\/es\/blog\/conceptos-basicos-temas-wordpress\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/kinsta.com\/es\/"},{"@type":"ListItem","position":2,"name":"Temas WordPress","item":"https:\/\/kinsta.com\/es\/secciones\/temas-wordpress\/"},{"@type":"ListItem","position":3,"name":"Conceptos b\u00e1sicos que hay que entender en el desarrollo de temas para WordPress"}]},{"@type":"WebSite","@id":"https:\/\/kinsta.com\/es\/#website","url":"https:\/\/kinsta.com\/es\/","name":"Kinsta\u00ae","description":"Soluciones de alojamiento premium, r\u00e1pidas y seguras","publisher":{"@id":"https:\/\/kinsta.com\/es\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/kinsta.com\/es\/?s={search_term_string}"},"query-input":{"@type":"PropertyValueSpecification","valueRequired":true,"valueName":"search_term_string"}}],"inLanguage":"es"},{"@type":"Organization","@id":"https:\/\/kinsta.com\/es\/#organization","name":"Kinsta","url":"https:\/\/kinsta.com\/es\/","logo":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/kinsta.com\/es\/#\/schema\/logo\/image\/","url":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2023\/12\/kinsta-logo.jpeg","contentUrl":"https:\/\/kinsta.com\/es\/wp-content\/uploads\/sites\/8\/2023\/12\/kinsta-logo.jpeg","width":500,"height":500,"caption":"Kinsta"},"image":{"@id":"https:\/\/kinsta.com\/es\/#\/schema\/logo\/image\/"},"sameAs":["https:\/\/www.facebook.com\/kinsta.es\/","https:\/\/x.com\/Kinsta_ES","https:\/\/www.instagram.com\/kinstahosting\/","https:\/\/www.linkedin.com\/company\/kinsta\/","https:\/\/www.pinterest.com\/kinstahosting\/","https:\/\/www.youtube.com\/c\/Kinsta"]},{"@type":"Person","@id":"https:\/\/kinsta.com\/es\/#\/schema\/person\/efa7de30245ca15be5ce1dcacff89c07","name":"Joel Olawanle","image":{"@type":"ImageObject","inLanguage":"es","@id":"https:\/\/kinsta.com\/es\/#\/schema\/person\/image\/","url":"https:\/\/secure.gravatar.com\/avatar\/051bf577ce2c837846a1db9eef184758?s=96&d=mm&r=g","contentUrl":"https:\/\/secure.gravatar.com\/avatar\/051bf577ce2c837846a1db9eef184758?s=96&d=mm&r=g","caption":"Joel Olawanle"},"description":"Joel is a Frontend developer working at Kinsta as a Technical Editor. He is a passionate teacher with love for open source and has written over 300 technical articles majorly around JavaScript and it's frameworks.","sameAs":["https:\/\/joelolawanle.com\/","https:\/\/www.linkedin.com\/in\/olawanlejoel\/","https:\/\/x.com\/olawanle_joel","https:\/\/www.youtube.com\/@joelolawanle"],"gender":"male","knowsAbout":["JavaScript","React","Next.js"],"knowsLanguage":["English"],"jobTitle":"Technical Editor","worksFor":"Kinsta","url":"https:\/\/kinsta.com\/es\/blog\/author\/joelolawanle\/"}]}},"acf":[],"_links":{"self":[{"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/posts\/76167","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/users\/287"}],"replies":[{"embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/comments?post=76167"}],"version-history":[{"count":7,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/posts\/76167\/revisions"}],"predecessor-version":[{"id":76199,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/posts\/76167\/revisions\/76199"}],"alternate":[{"embeddable":true,"hreflang":"en","title":"English","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/translations\/en"},{"embeddable":true,"hreflang":"it","title":"Italian","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/translations\/it"},{"embeddable":true,"hreflang":"pt","title":"Portuguese","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/translations\/pt"},{"embeddable":true,"hreflang":"fr","title":"French","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/translations\/fr"},{"embeddable":true,"hreflang":"de","title":"German","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/translations\/de"},{"embeddable":true,"hreflang":"ja","title":"Japanese","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/translations\/jp"},{"embeddable":true,"hreflang":"es","title":"Spanish","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/translations\/es"},{"embeddable":true,"hreflang":"nl","title":"Dutch","href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/translations\/nl"},{"href":"https:\/\/kinsta.com\/es\/wp-json\/kinsta\/v1\/posts\/76167\/tree"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/media\/76168"}],"wp:attachment":[{"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/media?parent=76167"}],"wp:term":[{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/tags?post=76167"},{"taxonomy":"topic","embeddable":true,"href":"https:\/\/kinsta.com\/es\/wp-json\/wp\/v2\/topic?post=76167"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}