un tema hijo le permite cambiar pequeños aspectos de la apariencia de su sitio, pero aún así preservar el aspecto y la funcionalidad de su tema. Para entender cómo funcionan los temas secundarios, primero es importante entender la relación entre los temas padre e hijo.

¿qué es un tema Padre? #¿ Qué es un tema para padres?

un tema principal es un tema completo que incluye todos los archivos de plantilla de WordPress necesarios y activos para que el tema funcione., Todos los temas, excepto los temas secundarios, se consideran temas principales.

Top

¿Qué es un Niño Tema? #¿ Qué es un tema infantil?

como se indica en la descripción general, un tema secundario hereda el aspecto del tema principal y todas sus funciones, pero se puede usar para realizar modificaciones en cualquier parte del tema. De esta manera, las personalizaciones se mantienen separadas de los archivos del tema principal. El uso de un tema secundario le permite actualizar el tema principal sin afectar las personalizaciones que ha realizado en su sitio.,

temas secundarios:

• haga que sus modificaciones sean portátiles y replicables;
• mantenga la personalización separada de las funciones del tema principal;
• permita que los temas principales se actualicen sin destruir sus modificaciones;
• le permita aprovechar el esfuerzo y las pruebas puestas en el tema principal;
• ahorre tiempo de desarrollo ya que no está recreando la rueda; y
• Son una gran manera de comenzar a aprender sobre el desarrollo del tema.,

Top

Cómo Crear un Child Theme #Cómo Crear un Tema Infantil

Crear una carpeta de temas hijo #1. Crear una carpeta de tema secundario

primero, cree una nueva carpeta en su directorio de temas, ubicada en wp-content/themes.

El directorio necesita un nombre., Es una buena práctica dar a un tema hijo el mismo nombre que el padre, pero con -child añadido al final. Por ejemplo, si usted estuviera haciendo un tema infantil de twentyfifteen, entonces el directorio sería el nombre twentyfifteen-child.

Top

crear una hoja de estilos: style.css # 2. Crear una hoja de estilos: style.css

a continuación, deberá crear un archivo de hoja de estilos llamado style.css, que contendrá todas las reglas y declaraciones CSS que controlan el aspecto de su tema., Su hoja de estilos debe contener el siguiente comentario de encabezado requerido en la parte superior del archivo. Esto le dice a WordPress información básica sobre el tema, incluido el hecho de que es un tema hijo con un padre en particular.

Expand full source codeCollapse full source code

Se requiere la siguiente información:

• Theme Name – needs to be unique to your theme
• Template – the name of the parent theme directory. El tema principal en nuestro ejemplo es el tema Twenty Fifteen, por lo que la plantilla será twentyfifteen., Es posible que esté trabajando con un tema diferente, así que ajuste en consecuencia.

agregue la información restante según corresponda. El único archivo de tema secundario requerido es style.css, pero funciones.php es necesario para encolar estilos correctamente (abajo).

Top

hoja de estilos Enqueue #3. Enqueue stylesheet

el paso final es enqueue las hojas de estilo de los temas padre e hijo, si es necesario.

la forma ideal de encolar hojas de estilo es que el tema padre cargue ambos (el padre y el hijo), pero no todos los temas hacen esto. Por lo tanto, debe examinar el código del tema principal para ver lo que hace y para obtener el nombre de identificador que utiliza el tema principal. El identificador es el primer parámetro de wp_enqueue_style().,

hay algunas cosas a tener en cuenta:

• El tema hijo se carga antes del tema padre.
• Todo está conectado a una acción con una prioridad (el valor predeterminado es 10), pero las que tienen la misma prioridad se ejecutan en el orden en que se cargaron.
• para cada identificador, solo la primera llamada a wp_enqueue_style() es relevante (otras ignoradas).
• el parámetro de dependencia de wp_enqueue_style() afecta el orden de carga.
• sin un número de versión, los visitantes del sitio obtendrán lo que su navegador haya almacenado en caché, en lugar de la nueva versión.,
• El uso de una función para obtener la versión del tema devolverá la versión del tema activo (hijo si hay un hijo).
• Las funciones llamadas get_stylesheet * buscan primero un tema hijo y luego el padre.

la forma recomendada de consultar las hojas de estilo es agregar una acción wp_enqueue_scripts y usar wp_enqueue_style() en el tema hijo functions.php.
Si no tiene uno, cree un functions.php en el directorio del tema hijo., La primera línea del tema de su hijo functions.phpserá una etiqueta PHP de apertura (<?php), después de lo cual puede escribir el código PHP de acuerdo con lo que hace su tema padre.

si el tema padre carga ambas hojas de estilo, el tema hijo no necesita hacer nada.

si el tema padre carga su estilo usando una función que comienza con get_template, como get_template_directory()y get_template_directory_uri(), el tema hijo necesita cargar solo los estilos hijos, usando el identificador del Padre en el parámetro de dependencia.,

si el tema padre carga su estilo usando una función que comienza con get_stylesheet, como get_stylesheet_directory() y get_stylesheet_directory_uri(), el tema hijo necesita cargar hojas de estilo padre e hijo. Asegúrese de usar el mismo nombre de identificador que el padre para los estilos padre.

Expand full source codeCollapse código fuente completo

Top

Install child theme #4. Instalar tema hijo

Instalar el tema hijo como instalar cualquier otro tema., Puede copiar la carpeta al sitio mediante FTP, o crear un archivo zip de la carpeta del tema secundario, eligiendo la opción para mantener la estructura de carpetas, y haga clic en apariencia > temas > Agregar nuevo para cargar el archivo zip.

Top

activar el tema Infantil # 5. Activar tema infantil

Su tema infantil ahora está listo para la activación. Inicie sesión en la pantalla de administración de su sitio y vaya a la pantalla de administración > apariencia > temas., Debería ver el tema de su hijo en la lista y listo para la activación. (Si su instalación de WordPress está habilitada para múltiples sitios, entonces es posible que deba cambiar a la pantalla de administración de red para habilitar el tema (dentro de la pestaña de la pantalla temas de administración de red). A continuación, puede volver a la pantalla de administración de WordPress específica de su sitio para activar su tema hijo.)

Top

Agregar archivos de plantilla # Agregar archivos de plantilla

aparte del archivo functions.php (como se señaló anteriormente), CUALQUIER archivo que agregue a su tema hijo sobrescribirá el mismo archivo en el tema principal.

en la mayoría de los casos, es mejor crear una copia de los archivos de plantilla que desea cambiar desde el tema principal y, a continuación, realizar las modificaciones en los archivos copiados, dejando los archivos principales Sin cambios., Por ejemplo, si desea cambiar el código del tema principal del header.php archivo, se copia el archivo a la carpeta del tema hijo y personalizar allí.

también puede incluir archivos en el tema infantil que no están incluidos en el tema principal., Por ejemplo, es posible que desee crear una plantilla más específica de la que se encuentra en su tema principal, como una plantilla para una página específica o un archivo de categoría (por ejemplo, page-3.php cargaría para una página con el ID de 3).

consulte la página de jerarquía de plantillas para obtener más información sobre cómo WordPress determina qué plantilla usar.

Top

usando funciones.php # usando funciones.php

a diferencia de style.css, el functions.php de un tema hijo no anula su contraparte del Padre. En su lugar, se carga además de las funciones del Padre.,php. (Específicamente, se carga justo antes del archivo del Padre.)

de esa manera, el functions.php de un tema hijo proporciona un método inteligente y sin problemas para modificar la funcionalidad de un tema padre. Digamos que desea agregar una función PHP a su tema. La forma más rápida sería abrir su archivo functions.php y poner la función allí. Pero eso no es inteligente: la próxima vez que se actualice su tema, su función desaparecerá., Pero hay una forma alternativa que es la forma inteligente: puede crear un tema hijo, agregar un archivo functions.php y agregar su función a ese archivo. La función hará exactamente el mismo trabajo desde allí también, con la ventaja de que no se verá afectada por futuras actualizaciones del tema padre. No copie el contenido completo de las funciones.php del tema padre en funciones.php en el tema hijo.

la estructura de functions.php es simple: una etiqueta PHP de apertura en la parte superior, y debajo de ella, sus bits de PHP. En él puedes poner tantas o tan pocas funciones como desees., El siguiente ejemplo muestra un archivo elementary functions.php que hace una cosa simple: agrega un enlace de favicon al elemento head de las páginas HTML.

if ( ! function_exists( 'theme_special_nav' ) ) { function theme_special_nav() { // Do something. }}

para obtener más información sobre qué incluir en el archivo functions.php del tema de su hijo, lea la página funciones del tema.

Top

referenciar o incluir otros archivos # referenciar o incluir otros archivos

Cuando necesite incluir archivos que residan dentro de la estructura de directorios de su tema hijo, necesitará usar get_stylesheet_directory(). Dado que style.css está en la raíz del subdirectorio del tema hijo, get_stylesheet_directory () apunta al directorio del tema hijo (no al directorio del tema padre)., Para hacer referencia al directorio del tema principal, usarías get_template_directory() en su lugar.

a continuación se muestra un ejemplo que ilustra cómo usar get_stylesheet_directory() cuando se hace referencia a un archivo almacenado en el directorio del tema hijo:

<?php require_once( get_stylesheet_directory(). '/my_included_file.php' ); ?>

mientras tanto, este ejemplo utiliza get_stylesheet_directory_uri() para mostrar una imagen que se almacena div>carpeta en el directorio del tema secundario.,

<img src="https://developer.wordpress.org/themes/advanced-topics/child-themes/<?php echo get_stylesheet_directory_uri(); ?>/images/my_picture.png" alt="" />

Top

Enqueueing Styles and Scripts # Enqueueing Styles and Scripts

Los Scripts y estilos deben ser enqueizados con su propia función, y luego deben estar envueltos en una acción. Para obtener más información, lea la página sobre incluir CSS y JavaScript.

WordPress no cargará automáticamente la hoja de estilos para el tema de su hijo en el front-end. A continuación se muestra un ejemplo de uso del gancho de acción wp_enqueue_scripts() para llamar a una función que enuede la hoja de estilos del tema hijo.,

Top

Consideraciones Especiales #Consideraciones Especiales

Top

Post Formatos de #Post Formatos

Un tema niño hereda post formatos definidos por el tema principal. Pero al crear temas secundarios, tenga en cuenta que el uso de add_theme_support('post-formats') anulará los formatos definidos por el tema principal, no los agregará.,

Top

RTL Support #RTL Support

para admitir idiomas RTL, agregue un archivo rtl.css a su tema hijo, que contenga:

/*Theme Name: Twenty Fifteen ChildTemplate: twentyfifteen*/

incluso si el tema padre no tiene un , se recomienda agregar el archivo rtl.css a su tema hijo. WordPress cargará automáticamente el archivo rtl.css solo si is_rtl() es true.,

Top

Internationalization # Internationalization

Los temas secundarios se pueden preparar para su traducción a otros idiomas utilizando la API de internacionalización de WordPress. Hay consideraciones especiales con respecto a la internacionalización de los temas secundarios.

para internacionalizar un tema hijo siga estos pasos:
1. Añadir un directorio de idiomas.

• Por ejemplo: twentyfifteen-child/languages/

2. Añadir archivos de idioma.,

• sus nombres de archivo tienen que ser he_IL.po&he_IL.mo(dependiendo de su idioma), a diferencia de los archivos de complemento que son domain-he_IL.xx.

3. Cargue un textdomain

• Use load_child_theme_textdomain () en functions.php durante la acción after_setup_theme.
• El dominio de texto definido en load_child_theme_textdomain() debe ser usado para traducir todas las cadenas en el tema hijo.

4. Use las funciones GetText para agregar soporte i18n para sus cadenas.,

ejemplo: textdomain #ejemplo: textdomain

en este punto, las cadenas en el tema hijo están listas para ser traducidas. Para asegurarse de que se internacionalizan correctamente para la traducción, cada cadena debe tener eltwentyfifteenchild textdomain.

Top

Ejemplo: gettext funciones #Ejemplo: gettext funciones

este es un ejemplo de eco de la frase «el Código es Poesía»:

<?phpesc_html_e( 'Code is Poetry', 'twentyfifteenchild' );?>

El dominio de texto definido en el load_child_theme_textdomain() debe ser utilizado para traducir todas las cadenas en el tema infantil., En el caso de que se haya incluido un archivo de plantilla del Padre them, el dominio de texto debe cambiarse del definido en el tema padre al definido por el tema hijo.