A lo largo de los años, WordPress ha pasado de ser un simple sistema de blogs a una plataforma CMS fácil de usar y se ha vuelto omnipresente en la web. Gracias a su popularidad, muchos profesionales se han especializado en proporcionar temas de WordPress como plantillas para sitios web. Estas ya incluyen casi todas las funcionalidades de un sitio web y son muy parecidas a como debe ser el producto final, pero no idénticas. Normalmente hay que realizar ajustes en el código para adaptar el sitio al diseño corporativo, o se debe cambiar la estructura. Pero ¿qué pasa con los cambios cuando se actualiza el tema? Para esto sirven los temas hijo en WordPress.
Si quieres evitar que tus cambios se sobrescriban al actualizar, debes usar un tema hijo de Wordpress. Los child themes de WordPressson, como su nombre indica, los hijos de un tema padre. Estos están ligados al tema padre de manera que heredan su apariencia y funciones. Si haces ajustes individuales en el tema hijo de WordPress, estos se sobrescriben automáticamente en las instrucciones del tema padre. Por lo tanto, los cambios no tienen ningún efecto sobre el tema principal. Si el tema padre se actualiza, los cambios en el tema hijo de WordPress permanecen en su lugar.
Durante los principales ajustes o actualizaciones, pueden aparecer mensajes de error en el sitio web. Para no molestar a los usuarios, debes activar el modo de mantenimiento de WordPress.
Un child theme de WordPresspuede tener diferentes componentes. En este sentido, los cambios y los archivos donde estos se realizan son decisivos. Sin embargo, para quelos temas hijo de WordPress funcionen correctamente, hay ciertos archivos que debes crear para cada uno de ellos:
¿Por qué el child theme de WordPressnecesita estos tres archivos?
Como ya hemos mencionado, un tema hijo de WordPress necesita tres archivos para funcionar. Los archivos tienen las siguientes funciones:
Si solo vas a hacer cambios menores en el tema, hay soluciones más sencillas como Simple Custom CSS Plugin o el personalizador integrado directamente en WordPress a partir de la versión 4.7.
Usar un tema hijo de WordPress tiene muchas ventajas. Sin embargo, también tiene algunos inconvenientes, por lo que debes sopesar si vale la pena crear un tema extra solo para implementar pequeños cambios en el CSS:
| Ventajas | Inconvenientes |
|---|---|
| Los cambios no se sobrescriben cuando se actualiza el tema principal. | La actualización de la plantilla original solo corrige las vulnerabilidades de seguridad en los archivos de plantilla que se encuentran en la carpeta de temas principales. Para los archivos de plantilla en la carpeta de temas hijo de WordPress, estas lagunas permanecen. |
| Un tema hijo de WordPress ofrece más libertad en comparación con las posibilidades del backend de WordPress. Por ejemplo, se puede adaptar el diseño y la estructura del sitio web o ampliar el tema con ciertas funciones. | Puede haber una pérdida de rendimiento, porque el navegador carga dos hojas de estilo simultáneamente. |
| Los ajustes extensos de CSS se mantienen claros en comparación con el personalizador de WordPress en el style.css. | |
| Los temas hijo de WordPress son ideales para principiantes que quieran conocer mejor WordPress. Si se produce un error, siempre se puede volver al tema padre. | |
| Los temas hijo de WordPress permiten acelerar el trabajo de desarrollo. |
Después de explicar las funciones, aquí te contamos cómo crear un tema hijo funcional en WordPress:
Usando un cliente FTP, como FileZilla, conéctate a tu servidor y navega dentro de la instalación de WordPress hasta la siguiente carpeta:
tu ruta hacia la instalación de wordpress/wp-content/themes/Allí creas una carpeta para el tema hijo de WordPress. Conviene usar el nombre del tema padre añadiendo “-child” al final.
Crea un archivo style.css y añade la siguiente información en el área del encabezado usando un editor de texto:
/*
Nombre del tema: [Nombre del tema padre] Child
URI del tema: [http://example.de/parent-theme/]
Descripción: [Nombre del tema padre] Tema hijo
Autor: [Tu nombre]
URI del autor: [El URL de tu sitio web]
Plantilla: [Nombre de la carpeta del tema padre]
Versión: 1.0.0
Dominio de texto: [Nombre del tema padre] -child
*/Sustituye los marcadores de posición entre corchetes con tus especificaciones. No tienes que introducir todos los elementos; solo es obligatorio añadir los siguientes dos datos para que los temas hijo de WordPress funcionen:
Cuando el archivo esté listo, usa el cliente FTP para subirlo a la carpeta del tema hijo de WordPress.
En el mejor de los casos, el tema padre ya contiene la instrucción de cargar la hoja de estilo del tema hijo de WordPress. Pero no todas las plantillas de diseño hacen esto. Por lo tanto, es importante echar un vistazo a las funciones del tema padre. Se aplica uno de los tres escenarios siguientes:
Si se produce el segundo caso, function.php tiene este aspecto:
<!--?php</codesnippet-->
add_action( 'wp_enqueue_scripts', 'my_theme_enqueue_styles' );
function my_theme_enqueue_styles() {
wp_enqueue_style( 'child-style', get_stylesheet_uri(),
array( 'Nombre de la hoja de estilo del tema padre'),
wp_get_theme()-> get('Version') // Solo funciona si el elemento version también se especifica en el área del encabezado de la hoja de estilo
);
}
?>Si el tema hijo de WordPress debe cargar ambas hojas de estilo a través de function.php, el código tiene este aspecto:
<!--?php</codesnippet-->
function child_theme_styles() {
wp_enqueue_style( 'Nombre de la hoja de estilo del tema padre', get_template_directory_uri() . '/style.css');
wp_enqueue_style( 'child-theme-css', get_stylesheet_directory_uri() .'/style.css' , array('Handle 'Nombre de la hoja de estilo del tema padre'));
}
add_action( 'wp_enqueue_scripts', 'child_theme_styles' );
?>Introduce function.php en el archivo style.css en la carpeta del child theme en WordPress.
Opcionalmente, también puedes colocar un archivo de imagen con el nombre de archivo screenshot.png en la carpeta de temas hijos de WordPress. WordPress muestra esta imagen en el fondo del tema, para que puedas asignar mejor la plantilla.
Después de crear el tema hijo de WordPress, actívalo como cualquier otro tema en el backend de WordPress. Para hacerlo, simplemente entra en el backend y selecciona el tema hijo en Diseño > Temas.
Si ya has hecho ajustes en el tema padre a través del personalizador de WordPress, estos cambios se perderán al activar el tema hijo de WordPress. Con el plugin Customizer Export/Import, puedes exportar los ajustes del personalizador y, luego, importarlos de nuevo.
Ahora el tema hijo de WordPress está completamente listo para su uso. Si quieres realizar cambios en otros archivos de plantillas, copia el archivo del tema principal y guárdalo en la carpeta del tema secundario. La ruta debe corresponder exactamente con la ruta del tema principal. El archivo del tema principal es automáticamente sobrescrito por el archivo de la carpeta de temas hijo de WordPress.
Con el alojamiento WordPress de IONOS, tendrás una plataforma de alojamiento especialmente optimizada para WordPress que te facilitará la creación de tu propio sitio web en WordPress.
Uno de los puntos fuertes de WordPress como gestor de contenidos es la separación entre diseño y programación, la cual permite a los usuarios ajustar la visualización de los contenidos en los llamados temas sin tener que intervenir en el software en sí mismo. Visita nuestra guía si quieres saber más sobre la función de los temas de WordPress, sobre sus componentes y su estructura.
Quizás has oído hablar del framework de WordPress Genesis, el tema base de la compañía americana de servicios web StudioPress. Y es que no solo este está de moda, contándose entre las soluciones más demandadas en cuestión de diseño, sino que los temas hijo de este framework también disfrutan de una cantidad remarcable de descargas. Desentrañamos los secretos de la popularidad de Genesis Framework...
¿Deseas crear tu propia página web pero apenas tienes conocimientos de programación? Con un sistema de gestión de contenidos puedes crear una página web privada o profesional sin por ello requerir conocimientos de HTML. Esta introducción sobre cómo usar WordPress pretende aclarar paso a paso la creación de una web propia. Desde la instalación y el establecimiento de los ajustes en WordPress,...
Integrar Google Analytics en WordPress te ayudará a obtener información útil sobre los visitantes de tu página web. De este modo, podrás estimar mejor tu audiencia y optimizar tus medidas de marketing. Aquí te mostramos cómo integrar Google Analytics en WordPress y lo que debes tener en cuenta para respetar la protección de datos.
¿Gestionas un sitio web de WordPress? Entonces es posible que ya estés familiarizado con la inclusión de scripts u hojas de estilo a tu proyecto. En esta guía paso a paso, te mostraremos cómo editar un header en WordPress, qué debes tener en cuenta y cómo encontrarás el enfoque que más te conviene.
Si quieres diseñar o personalizar tu propio sitio web conforme a tus necesidades, también puedes trabajar directamente sobre el código de WordPress. Descubre qué herramientas puedes utilizar para editar, adaptar y guardar CSS en WordPress. Nuestras instrucciones son fáciles de entender y te permitirán realizar los cambios sin ayuda externa.
Ofrece un servicio fiable y de alto rendimiento a tus clientes con un pack hosting de IONOS.
Ver planes