Cómo crear un tema infantil Divi

Hay miles (¡así es, miles!) de temas de WordPress disponibles para que elijas al crear un sitio. Sin embargo, la mayoría de los diseñadores web consideran que, si bien los temas de WordPress son un buen punto de partida, quieren una mayor personalización, y crear un tema secundario es una excelente manera de hacerlo.

Los temas secundarios se basan en los temas principales y le permiten agregar o eliminar su propio código. Si realmente desea personalizar su sitio de WordPress, usar temas secundarios es la mejor manera de hacerlo y Divi es una de las mejores opciones.

La razón principal por la que los creativos crean un tema secundario Divi es para que cuando se actualice el tema principal, nada se rompa en su sitio. La creación de un tema secundario de Divi actúa esencialmente como una red de seguridad, ¡siempre ahí para atrapar su sitio antes de que se rompa! Pero me estoy adelantando, así que comencemos con lo básico.

En este artículo, cubriré:

• ¿Qué es Divi y cuáles son sus características?
• Cómo crear un tema infantil Divi (¡+ una descarga gratuita para niños!)
• Cómo probar si tu tema hijo Divi está funcionando

Vamos a sumergirnos.

¿Qué es Divi y cuáles son sus características?

Divi es un tema de WordPress de Elegant Themes que te permite construir tus páginas utilizando diferentes elementos estructurales desde cero. Esto significa que tienes control total sobre todo lo que hay en los sitios que estás creando gracias a su editor visual superior.

También viene con cientos de diseños prefabricados, por lo que si no tienes experiencia creando y personalizando temas, ¡no te preocupes! Ya seas un principiante que busca personalizar tu primer sitio o un desarrollador experimentado, Divi te brinda las herramientas para hacer realidad tus ideas.

Divi tiene dos interfaces de creación: el editor visual en el front-end de WordPress y el generador de back-end. En el editor visual, hace que la creación de sitios para clientes sea 10 veces más fácil, rápida y divertida porque puedes editar en la propia página y ver tus ediciones en vivo. En el back-end, estás editando la representación basada en bloques dentro de la publicación. Sin embargo, aún puedes agregar nuevos módulos y hacer básicamente todo como lo harías en el editor visual. También es fácil alternar entre los editores, según sus preferencias.

Divi también tiene tres elementos estructurales principales que puedes utilizar tal como están o personalizarlos según tus especificaciones exactas: secciones, filas y módulos.

Secciones: Estos son los bloques de construcción más grandes del constructor Divi. Puedes considerarlos como bloques apilables horizontales que pueden agrupar tu contenido en áreas visualmente distinguibles. Todo lo que construyes comienza con una sección.

Filas: Las filas son los distintos diseños de columnas que se pueden colocar dentro de las secciones. Tienen varias configuraciones a las que se puede acceder haciendo clic en el ícono de configuración en la parte superior izquierda de la fila y se pueden usar para aumentar en gran medida la variedad de diseños creados con Divi Builder, ya que crean la estructura en la que se alojan sus módulos.

Módulos: los módulos contienen diferentes elementos de contenido, como imágenes, contenido, controles deslizantes, galerías, formularios de contacto, CTA, blogs, formularios, testimonios, etc. Hay más de 40 módulos entre los que puede elegir y luego personalizar como desee.

Ahora que comprende un poco mejor Divi, profundicemos en cómo crear un tema hijo.

Cómo crear un tema infantil Divi

Antes de comenzar a personalizar cosas, querrás asegurarte de tener Divi instalado y activado. Hay dos maneras de hacer esto:

Opción 1: Utilice Flywheel + Divi para una instalación rápida y sencilla.

Opcion 2: El método manual (siga estos dos pasos)

Paso 1: Regístrate y descarga Divi aquí. Una vez que haya creado una cuenta e iniciado sesión, será redirigido al área de miembros, se dirigirá al lado izquierdo y encontrará la pestaña "Descargas". Busque Divi y haga clic en "Descargar". Esto envía una descarga de Divi en un archivo zip a su carpeta de Descargas.

Paso 2: es hora de iniciar sesión en su sitio de WordPress. Vaya a Apariencia > Temas. Haga clic en Agregar nuevo o Agregar nuevo tema en el lado derecho. Haga clic en el botón "Subir tema" en la parte superior izquierda. Elija el archivo y busque ese archivo zip Divi. Nota: guárdelo en un archivo zip (no lo descomprima). Haga clic en Instalar. Una vez finalizada la instalación, haga clic en "Activar" y estará instalado y activado en su sitio. ?

¡Ahora estás listo para crear un tema secundario Divi! Hay tres formas principales de crear un tema secundario Divi: descargar un tema secundario gratuito, usar un complemento o codificarlo manualmente.

Opción 1: descargar un archivo de tema infantil Divi gratuito

Una de las formas más rápidas (¡y fáciles!) de crear un tema infantil es descargar este tema infantil Divi gratuito. ¡Tiene todo lo necesario para comenzar, además de espacio para que lo personalices a tu gusto! Descarga tu tema infantil Divi gratuito a continuación.

Una vez descargado, instala Divi, actívalo y ¡listo! Es tan fácil como eso. Si prefieres una forma diferente de crear un tema secundario Divi, siempre puedes probar un complemento.

Opción 2: crear un tema infantil Divi utilizando un complemento

Hay varios complementos disponibles para ayudarlo a crear un tema secundario Divi. Estos son algunos de mis favoritos personales:

• Divinos niños
• Configurador de temas infantiles
• Creador de temas infantiles de Orbisius

Divinos niños

Divi Children es un complemento gratuito desarrollado específicamente para los usuarios de Divi. ¡Automáticamente hace el trabajo duro por ti, para que puedas concentrarte en el lado creativo! Cada tema infantil creado por Divi Children viene con un montón de funciones de personalización a través de WP Customizer. Aprenda cómo instalar este complemento aquí.

Configurador de temas infantiles

Este complemento fue diseñado para usuarios de WordPress que desean poder personalizar hojas de estilo de temas secundarios directamente. Con este complemento, puede identificar y anular fácilmente los atributos CSS exactos que desea personalizar y el analizador escanea el tema renderizado y configura automáticamente su tema hijo. Obtenga más información sobre este complemento y cómo instalarlo aquí.

Creador de temas infantiles de Orbisius

Este complemento le permite crear rápidamente temas secundarios a partir de cualquier tema que tenga instalado actualmente en su sitio. Con este complemento, puedes crear una cantidad ilimitada de temas secundarios a partir de tu tema principal, por lo que las opciones son infinitas. Cuenta con dos editores y puedes seleccionar fragmentos de un tema y pegarlos en otro. ¡Habla de personalización! Obtenga más información sobre cómo instalar este complemento aquí.

Finalmente, si un complemento no es para usted, ¡siempre existe la opción de crear un tema secundario Divi manualmente!

Opción 3: crear un tema infantil Divi manualmente

Si eres desarrollador de WordPress o simplemente te encantan los buenos desafíos, esta es una excelente manera de crear un tema secundario Divi.

Paso 1: crea el archivo style.CSS

Como probablemente sepa, el archivo style.css sirve para indicarle a WordPress los detalles de su tema hijo y puede usarse para agregar CSS personalizado. Para hacer esto, cree una carpeta en su computadora y asígnele un nombre (algo que le permita saber que es para un tema secundario Divi). Desde allí, cree un archivo en esa carpeta y asígnele el nombre style.css.

Nota: Asegúrese de tener una herramienta de edición de texto o código; de lo contrario, será difícil nombrar ese archivo.

Paso 2: agregue esto al archivo style.css:

 /*
 Nombre del tema: Tema Divi Child
 URI del tema: https://www.elegantthemes.com/gallery/divi/
 Descripción: Tema infantil para Divi
 Autor: Tu nombre
 URI del autor: https://getflywheel.com/
 Plantilla: Divi
 Versión: 1.0.0
*/

El nombre del tema, el URI del tema, la descripción, el autor, el URI del autor y la versión son todos editables. ¡Mantenga el nombre de la plantilla como está! Para una mayor personalización (y para asegurarse de que su tema secundario Divi funcione), agregue cualquier CSS personalizado aquí.

Paso 3: crea el archivo funciones.php

Cree otro archivo en la carpeta que ya creó y asígnele el nombre funciones.php

Luego, agregue este código a su nuevo archivo y agregue las funciones personalizadas que desee debajo de la última línea:

 <?php
función divi__child_theme_enqueue_styles() {
    wp_enqueue_style( 'estilo padre', get_template_directory_uri() . '/style.css' );
}
add_action('wp_enqueue_scripts', 'divi__child_theme_enqueue_styles');

Paso 4: crea una captura de pantalla

Este es un paso importante para que su sitio no tenga un espacio en blanco donde debería estar la imagen en la página de temas de WordPress, por lo que tomar una captura de pantalla rápida es un paso clave aquí. Una vez que hayas tomado la captura de pantalla, continúa y asegúrate de que las dimensiones sean 880x660 px, que sea .png o .jpeg (¡cualquiera de los dos funciona!) y que el nombre sea [captura de pantalla.png] o [captura de pantalla.jpeg]. Luego, agregará la imagen de su captura de pantalla a la carpeta principal.

Paso 5: comprime la carpeta y cárgala

Finalmente, comprima la carpeta en un tipo de archivo zip y cárguela en WordPress. Irás a Apariencia > Temas > Cargar y luego harás clic en Activar.

¡Voilá! Has creado con éxito un tema infantil Divi y estás listo para personalizarlo según tus deseos.

Cómo probar si su tema Divi Child está funcionando

Para probar si su tema hijo funciona correctamente, agregue algo de CSS en el archivo style.css de su tema hijo y guarde los cambios. Deberías ver esos cambios en el sitio en vivo y así sabrás que está funcionando.

Nota: Es posible que tengas que abrir tu página en un navegador privado en caso de que esté almacenada en caché.

Recuerde: ¡nunca debe realizar cambios en su sitio en vivo en caso de que rompa algo! Utilice Local, una aplicación de desarrollo local gratuita para que pueda dejar de depurar entornos locales y dedicar más tiempo a lanzar hermosos sitios de WordPress. Obtenga más información sobre Local aquí.

Conclusión

La personalización es una de las mejores partes de la creación de sitios usando WordPress y, si bien los temas son excelentes puntos de partida, es bueno tener temas secundarios, como Divi, a tu disposición.

Descargar gratis el tema infantil Divi

Una de las formas más rápidas (¡y fáciles!) de crear un tema infantil es descargar este tema infantil Divi gratuito. ¡Tiene todo lo necesario para que comiences, así como espacio para que lo personalices a tu gusto! Descarga tu tema infantil Divi gratuito a continuación.