Divi 4.1: Usa Divi dentro de Gutenberg

Divi 4.1: Usa Divi dentro de Gutenberg

Hoy en Elegant Themes han sacado una de esas novedades de Divi que nos dan subidón!

Desde hoy, con Divi 4.1 podrás usar Divi dentro del editor de bloques de WordPress: Gutenberg.

Esto significa que no necesitas decidir entre Divi o Gutenberg cuándo vayas a crearun post o una entrada en tu blog, sino que puede mezclar y combinar los dos para crear artículos cojonud… en tu web 😉

¿Quién soy y cómo te puedo ayudar?

Por si es la primera vez que legas a mi blog, me presento. Mi nombre es Gonzalo de la Campa y me dedico a ayudar a emprendedores a generar ingresos en Internet. En esta web tienes cursos a los que ya se han apuntado más de 2.000 alumnos.

>> Aquí tienes mi curso de Divi actualizado a la última versión y conmigo de soporte para ayudarte.

Además tienes recursos gratis en el menú y cantidad de tutoriales en mi Canal de YouTube al que te recomiendo que te suscribas.

¿Qué es Gutenberg?

Gutenberg es el nombre en clave para el editor basado en bloques que se introdujo recientemente en WordPress 5.0. 

Este nuevo editor reemplazó al editor clásico basado en TinyMCE que ha sido un elemento básico de WordPress durante muchos años. 

El año pasado presentaron el soporte inicial para Gutenberg, que permitió a los usuarios de Divi alternar entre Gutenberg y Divi Builder al crear páginas. Hoy van un paso más allá al permitir que los usuarios de Divi combinen módulos Divi y bloques Gutenberg en la misma página.

Uniendo a dos constructores

Divi es el tema de WordPress más instalado del mundo y tiene muchas ventajas significativas sobre Gutenberg. Muchos usuarios de Divi nunca usan Gutenberg . 

Dicho esto, Gutenberg no debería ser visto como el competidor de Divi. ¡Ambos constructores pueden trabajar juntos! 

El bloque de diseño Divi

Utiliza el Divi Builder en cualquier lugar dentro de Gutenberg

El bloque Divi Layout es un bloque Gutenberg que funciona como una versión mini del Divi Builder. 

Puedes usarlo en cualquier lugar dentro de una página construida con Gutenberg para agregar módulos Divi o crear diseños Divi. 

Cuando agregas un Bloque de diseño Divi, puedes usarlo para cargar un diseño predefinido o un elemento de biblioteca que hayas guardado previamente. 

Una vez que se agrega un diseño Divi a la página, puedes modificarlo utilizando la interfaz Divi Builder y hacer maravillas.

Usando el bloque de diseño Divi

Cuando agregues bloques en Gutenberg, verás que hay un nuevo bloque Divi Layout disponible en la lista. 

Este bloque se puede agregar en cualquier lugar de tu página y dentro de él puedes construir lo que quieras con Divi Builder. 

Puedes usarlo para construir diseños complejos grandes o puedes agregarlo para agregar módulos individuales que no existen en la biblioteca de bloques de Gutenber.

Esto es una pasada. Es como tener todos los módulos de Divi en Gutenberg.

Esto permite que los dos constructores se usen a la vez. Ya no debes elegir entre usar Divi o Gutenberg. ¡Puedes usarlos a ambos!

Carga diseños de la biblioteca o crea nuevos diseños desde cero

Una vez que agregasun bloque Divi Layout a la página, puedes elegir cargar un diseño prefabricado o crear un diseño completamente nuevo desde cero. 

Si eliges cargar un diseño de la biblioteca, lo verás con la ventana emergente Divi Library y podrás usar los cientos de diseños de Elegant Themes o los que tú hayas guardado. 

Si eliges crear un nuevo diseño, Divi Builder se abrirá en una ventana emergente modal donde podrás usar Visual Builder y todas sus funciones para crear su diseño. 

Una vez que haya terminado de editar su diseño, aparecerá en Gutenberg.

Usa el bloque de Divi tantas veces como quieras en una entrada con Gutenberg

Puedes agregar tantos bloques Divi Layout como desees a tu página. 

Esto te permite mezclar y combinar Divi Modules con Gutenberg Blocks para crear casi cualquier cosa. 

El bloque Divi Layout admite todas las funciones básicas del bloque. 

Puedes crear bloques Divi Layout reutilizables y los bloques actuales se pueden mover, editar, duplicar y eliminar fácilmente.

Edición en vivo sin ventanas emergentes o actualizaciones del navegador

El bloque Divi Layout va más allá de cargar diseños estáticos desde la biblioteca. 

Todos los bloques de diseño de Divi son diseños independientes que se pueden construir y modificar de forma independiente, sin tener que acceder a la Biblioteca Divi. 

La edición de bloques Divi Layout se realiza sobre la marcha utilizando una superposición de Visual Builder. Puedes utilizar todo el poder del Visual Builder sin tener que navegar lejos de Gutenberg o actualizar la página.

>> VALORA Y COMPARTE ESTE ARTÍCULO:
[Total: 1 Media: 5]
Divi 4.0: Todo lo que debes saber de Divi Theme Builder

Divi 4.0: Todo lo que debes saber de Divi Theme Builder

Consejo inicial

Cada vez que salga una nueva actualización, ya sea de Divi como es en este caso, sea de WordPress o sea una actualización de cualquier plugin, mi consejo es que no te emociones y quieras actualizar el mismo día que la lanzan porque es muy habitual que al lanzarla la comunidad les reporte errores o incidencias y si esperas una o dos semanas y actualizas ya te garantizarás que han resuelto muchas de esas incidencias y te evitarás posibles conflictos o incompatibilidades.

Si quieres ser de los primeros y no aguantas la emoción de ver la nueva versión, en este caso de Divi 4.0 con su maravilloso Theme Builder mi consejo es que lo hagas siempre en alguna web de pruebas que tengas para trastear pero nunca en una web en producción o en páginas web que te den de comer.

Y en todos los casos haciendo siempre copia de seguridad por si acaso.

Vídeotutorial del Theme Builder en español

Te dejo un vídeo en abierto de mi Canal de YouTube al que me encantaría que te suscribas, para que conozcas el Theme Builder a fondo.

Si quieres además plantillas para el Theme Builder, Divi para descargar, etc., apúntate a mi Curso de Divi dónde aprenderás pasito a pasito esto y muchas más cosas conmigo de soporte para ayudarte.

Y aquí tienes también un videotutorial de Divi 4 y el Theme Builder en inglés si quieres:

Los Divilovers estamos emocionados

Una vez dicho esto… me toca venirme arriba!!!

El Theme Builder te va a permitir editar con Divi, de forma sencilla partes de la web que antes eran fijas y que no podían editarse de forma visual y sencilla, la única manera era tocando código.

Es decir, este tipo de mejoras te van a dar mucha más libertad para maquetar la cabecera de tu web, el pie de página, las páginas de producto si tienes una tienda online, páginas de categorías, etc. Esto abre un mundo de posibilidades maravilloso.

Vamos a verlo con detalle…

Por cierto… si quieres comprar Divi aquí tienes el mayor decuento que existe ahora: Comprar Divi con el 20% de descuento.

Acceder al Divi Theme Builder

Puedes acceder al Divi Theme Builder en el backend dentro de tu panel de WordPress en la categoría Divi > Theme Builder.

Personaliza la cabecera, footer… con Divi Theme Builder

Podrás editar con Divi muchas plantillas o páginas de forma masiva. Es decir, que todas las páginas del blog tengan un diseño, que todos los productos de tu WooCommerce tengan un diseño, el que tu quieras…

Ya no hay que ir uno por uno, pero vamos a ver en qué páginas vamos a poder crear estos diseños para que se apliquen o bien en toda la página web o bien solo en unas partes:

En toda la web

De manera predeterminada, hay un elemento de plantilla único denominado DEFAULT WEBSITE TEMPLATE (Plantilla de sitio web predeterminada), que no se puede eliminar, pero se puede modificar. 

Esta es la plantilla de tema estándar, y si no se edita:

Las tres áreas usarán los estilos Divi estándar. Es decir, si no añades una cabecera (header) o pie de página (footer) seguira aparecioendo la cabecera de siempre que tengas configurada en el Personalizador del Tema.

Si se editas el área de encabezado de la plantilla de sitio web predeterminada:

El encabezado del tema se reemplaza en toda la web con el contenido personalizado del Divi Theme Builder que hayas diseñado. Lo mismo ocurre con las áreas de cuerpo y pie de página.

Áreas globales

La plantilla predeterminada del sitio web consta de tres áreas: encabezado global, cuerpo global y pie de página global.

Para comenzar el proceso de crear una cabecera, footer…, haz clic en una de las áreas vacías respectivas.

Si quieres agregar una cabecera a medida con Divi, haz clic en el área “Agregar encabezado global” y luego selecciona la opción “Crear encabezado global”.

Al igual que cuando diseñas una página en Divi, elije cómo deseas comenzar a construir el diseño. Por ejemplo, puedes iniciar el diseño con un diseño prefabricado o un diseño de encabezado que haya diseñado previamente seleccionando la opción “Elegir un diseño prefabricado”. Sin embargo, si deseas crear el encabezado desde cero, selecciona “Construir desde cero”.

Una vez que hayas seleccionado crear el diseño desde cero, verás el Editor de diseño de Divi. Aquí es donde usarás Divi Builder para diseñar tu diseño de encabezado tal como diseñarías una página o publicación normal con Divi Builder.

Ten en cuenta que lo que veas en este editor de diseño de plantilla será lo que se muestre en el encabezado de su página. 

Y si este es un encabezado global, se mostrará en todo su sitio de forma predeterminada, reemplazando el encabezado Divi estándar.

Una vez que hayas terminado de diseñar tu encabezado, asegurate de guardar el diseño antes de salir del editor de diseño de plantilla.

Ahora deberías ver un encabezado global verde que llena el espacio del encabezado global de la plantilla predeterminada del sitio web. El color verde es para recordarle que es global.

Tu web ahora tendrá un nuevo encabezado global que reemplaza el encabezado Divi estándar.

Diseña páginas masivamente

En la mayoría de los casos, no querrás diseñar un área de cuerpo global porque esto cambiaría el diseño de todas las páginas a la vez y serían iguales con lo que no tiene sentido. Esto solo es interesante en algunos casos dónde el contenido sea dinámico.

Ahora lo explico con más detalle…

Puede crear una nueva plantilla con un área de cuerpo de plantilla personalizada para todos las publicaciones de tu blog, eso si tendría sentido. Nunca en las páginas.

De esa manera, no tienes que preocuparte por el diseño de cada nueva publicación o cada nuevo post. Solo necesitas agregar nuevo contenido dinámico.

Por ejemplo, creas una parte superior donde aparezca el título con un formato, colores… y luego en cada post verás ese diseño de forma automática pero cada artículo con su propio contenido.

¿Cómo creamos un diseño para todos los post?

Crear un cuerpo global”: Body Global Body.

Luego lo diseñas como quieras.

Es importante:

Incluir el módulo de contenido de publicación (Post Content) siempre que diseñes el área del body o cuerpo de la plantilla que se aplicará en todos los post para que luego el contenido que se muestre en cada uno sea dinámico y no en todos el mismo. 

El módulo Post Content muestra el contenido simulado para facilitarnos la ver como quedará el estilo de todas las publicaciones o artículos que creemos en el blog.

Si no estás utilizando Divi Builder en una página, el módulo de contenido de publicación mostrará el contenido dentro del editor WYSIWYG de una página o publicación en el back-end.

Aquí puedes ver un ejemplo de cómo aparecería ese contenido en el área Global Body de la plantilla.

Si decides usar Divi Builder para editar una página o publicación. El área disponible para el contenido de Divi Builder estará contenida dentro del área designada del módulo de contenido de publicación en el cuerpo de la plantilla.

Es por eso que en la mayoría de los casos no deberías tener un área de cuerpo global para tu web a menos que tengas una razón específica. 

Es posible que la creación de un cuerpo global imponga limitaciones innecesarias a tu capacidad para diseñar el contenido de la página en Divi. Así que cuidado con crear Bodys o cuerpos como plantilla para que se aplique en toda la web.

Si decides utilizar un área de cuerpo global para la plantilla predeterminada de su sitio web, es recomendable que te asegures de que el módulo de contenido de su publicación abarque todo el ancho del diseño para que no te limite de ninguna manera al espaciar al diseñar páginas con Divi Builder .

Divi Theme Builder nos permite reemplazar el pie de página estándar de Divi (y la barra de pie de página) con un nuevo pie de página personalizado que puedes diseñar completamente desde cero utilizando Divi Builder.

Para crear un pie de página global para nuestra web, simplemente haz clic en el área “Agregar pie de página global” y selecciona “Crear pie de página global”.

Luego usa tu creatividad con Divi Builder para diseñar el pie de página dentro del Editor de diseño de plantillas. No olvides guardar el diseño.

NOTA: También puedes agregar uno de los diseños prefabricados de Elegant Themes al editor de plantillas de pie de página para ahorrar tiempo y usar cantidad de pies de página que ya tienen diseñados. Puedes hacer esto haciendo clic en el icono Agregar desde la biblioteca más en el menú de configuración en la parte inferior del editor.

Una vez que tengas un encabezado global, (cuerpo) y pie de página…, una página de muestra se vería así.

Cuidado con esto: Cuerpo global no es necesario

Como dije anteriormente, el Cuerpo Global no es necesario. Puedes eliminar fácilmente el Cuerpo global haciendo clic en el icono de la papelera.

Sin el Cuerpo global, tienes control total sobre el diseño de tu web utilizando Divi Builder.

Plantillas personalizadas

La plantilla de sitio web predeterminada controla la plantilla predeterminada para todo el sitio. 

Sin embargo, las plantillas personalizadas nos permiten anular la plantilla predeterminada y usasr la que nosotros diseñemos.

En otras palabras, las plantillas personalizadas nos permiten crear plantillas para páginas o publicaciones que no quieras que usen la plantilla predeterminada.

Agregar una nueva plantilla

Para crear una nueva plantilla, simplemente haz clic en el cuadro “Agregar nueva plantilla” con el ícono gris más.

Esto abrirá un popup que nos enseña todas las páginas en las que podemos diseñar nuestra plantilla a medida. 

Diseñar páginas a medida con Divi que antes solo podían personalizarse tocando código

Usar vs. Excluir

Fijate que en la parte de arriba del popup puedes elegir entre qué páginas quieres que se aplique el diseño que vas a hacer o en qué páginas quieres que NO se aplique.

También podrías combinarlo, que se aplique en xxx páginas pero no en xxx.

Por ejemplo, puedes elegir usarlo en todos los post, pero también puedes excluir un post o artículo específico.

NOTA: Si una selección de inclusión entra en conflicto con una selección de exclusión, la selección de exclusión siempre anula la inclusión. Por ejemplo, si eliges “Incluir en la página de inicio” y “Excluir de la página de inicio”, esta plantilla se excluirá de la página de inicio.

Elije de cualquier plantilla de tema.

También verás que hay plantillas para cada página, publicación y / o archivo. Incluso puedes crear plantillas para las páginas y productos de WooCommerce si tienes instalado WooCommerce en tu web.

Cómo hacer para que los diseños se apliquen en todas las páginas o solo en algunas

Las plantillas se pueden asignar en un nivel macro y / o micro nivel. Por ejemplo, puedes asignar la plantilla a todas las páginas de tu web (nivel macro), o puedes elegir asignar la plantilla a una publicación específica (nivel micro). ¡O ambos! Incluso puedes seleccionar múltiples tareas, lo que nos da un control completo sobre dónde nos gustaría asignar la plantilla.

¿Qué pasa si seleccionamos cosas incongruentes que generan conflicto?

Si asignamos una plantilla a una página que ya está asignada a otra plantilla, la plantilla recién guardada tendrá prioridad y se eliminará la asignación anterior de la otra plantilla. Aparecerá un mensaje de advertencia que te notificará esto antes de guardar la plantilla.

Renombrar plantillas personalizadas

Una vez que se hayan seleccionado todas las tareas, verás un nuevo nombre de plantilla. Al pasar el cursor sobre el área del título de la tarjeta de plantilla, aparece una información sobre herramientas que muestra la lista de todo lo que la plantilla se utiliza o se excluye. Para cambiar el nombre de la plantilla, puedes hacer clic en el nombre de la plantilla para editar el título.

Advertencia de plantilla sin asignar

Si no seleccionas una plantilla, verás un texto de advertencia en lugar del nombre de la plantilla que dice “Sin asignar”.

Áreas de plantillas personalizadas para cualquier página

Al igual que la plantilla predeterminada (o plantilla Global que se aplica a TODAS las páginas), una plantilla personalizada (que se aplica a las páginas QUE TU DECIDAS) también tendrá las siguientes áreas: Encabezado, Cuerpo y Pie de página.

Si la plantilla predeterminada del sitio web tiene diseños de plantilla globales agregados a cualquiera de las tres áreas, esos diseños globales se agregarán automáticamente a la nueva plantilla. Así conservarás los diseños que hayas creado en las nuevas páginas que vayas a maquetar.

Cómo manejar elementos globales en nuevas plantillas

Puedes usar las opciones del área de Plantilla para eliminar el diseño y crear uno nuevo desde cero o deshabilitar global y ajustar el diseño para las necesidades específicas del diseño.

Por ejemplo, si tienes un encabezado global en la plantilla predeterminada del sitio web, tu nueva plantilla heredará ese encabezado global. 

Puedes elegir hacer uno de los siguientes:

  1. Puedes usar el encabezado global en tu nueva plantilla. Así por ejemplo si vas a crear una plantilla para los post o productos también tendrán la cabecera o footer que hayas diseñado.
  2. Puedes desactivar Global para poder modificar el diseño de la plantilla personalizada y diseñar una cabecera o footer distintos en los post o productos que vayas a diseñar.
  3. Puedes eliminar el encabezado global y crear el encabezado personalizado desde cero para la plantilla o agregar uno desde la biblioteca.
  4. También puedes dejar el área de Encabezado personalizado vacía que heredará el encabezado del tema Divi estándar.

Agregar una plantilla desde la biblioteca

Para agregar un diseño al área de la plantilla desde la biblioteca, haz clic en el área de la plantilla y selecciona Agregar desde la biblioteca. 

Aparecerá la ventana emergente agregar desde la biblioteca donde puedes elegir cualquier diseño de página prefabricado, guardado o existente. 

Una vez que el diseño se ha agregado al área de la plantilla, puedes seleccionar el icono de la tuerca para editar el diseño utilizando Divi Builder en el Editor de diseño de plantilla.

Arrastrar y soltar plantillas “Áreas”

Las áreas de plantilla se pueden arrastrar y soltar a otras áreas de contenido de plantilla. 

Esta es una manera rápida y fácil de duplicar y colocar un área de plantilla en una acción de arrastrar y soltar. 

Es como duplicar en lugar de cortar y pegar.

Opciones de visibilidad del área de plantilla: Ocultar / Mostrar áreas de encabezado, cuerpo y pie de página.

Además de poder personalizar cada área de una plantilla, también puedes alternar la visibilidad de un área para mostrarla u ocultarla en el Front End haciendo clic en el icono “ojo” al lado de cada área. 

Por ejemplo, podrías ocultar el Área de encabezado y el Área de pie de página de su página 404.

NOTA: Ocultar un área de plantilla no devuelve el área al valor predeterminado, sino que oculta completamente el área en la parte frontal.

Configuraciones de plantillas personalizadas

Menú de configuración de plantilla

Al pasar el cursor sobre una plantilla dentro del generador de temas, aparecerá un menú de configuración de plantilla en la parte superior izquierda del cuadro de plantilla. 

Este menú es muy similar a los menús que ve al pasar el ratón sobre una sección, fila o módulo dentro del Divi Builder.

El menú incluye iconos para las siguientes funciones:

  • Configuración de plantilla: aquí es donde puedes administrar las asignaciones de plantilla
  • Duplicar plantilla: esto duplicará la plantilla para iniciar otra plantilla personalizada. Duplicar una plantilla desencadena exactamente lo mismo que hacer clic en la tarjeta Agregar nueva plantilla. La diferencia es que después de definir la configuración de la plantilla, la plantilla generada usa el mismo Área de encabezado, Área del cuerpo y Área de pie de página que la plantilla duplicada.
  • Eliminar plantilla: esto eliminará la plantilla por completo. Cualquier página, publicación o archivo al que se le haya asignado la plantilla eliminada volverá a la plantilla predeterminada del sitio web y / o al diseño estándar del tema Divi para esa página (si no se crea una plantilla predeterminada).
  • Exportar plantilla: puedes hacer clic en el icono de exportar plantilla para exportar un archivo .json de esa plantilla específica. Una vez que haga clic en el icono de plantilla de exportación, ingrese un nombre para el archivo de exportación y haga clic en el botón “Exportar plantilla de Divi Theme Builder”.
  • Más opciones de configuración: el icono de más configuraciones abre una lista conveniente de todas las configuraciones de plantillas disponibles, todo en un solo lugar.

Crear un encabezado personalizado (no global)

La creación de un encabezado personalizado implicará el mismo proceso que la creación de un encabezado global. 

Dado que el encabezado es donde tendrás que incluir su menú principal para su sitio web, es importante comprender cómo usar el Módulo de menú al crear la cabecera

Construyendo un cuerpo personalizado

Construir un área de cuerpo personalizado para tu plantilla puede ser una excelente manera de agregar diseño y / o contenido al cuerpo de muchas páginas o publicaciones a la vez. Recuerda que esto es útil para post o productos pero no para páginas, normalmente.

Y si usas contenido dinámico , realmente puedes optimizar el diseño y la funcionalidad de las publicaciones de blog o productos de WooCommerce.

Crear un pie de página personalizado

La creación de un pie de página personalizado implica el mismo proceso que la creación de un pie de página global. 

Es importante recordar que cualquier pie de página personalizado agregado a una plantilla anulará completamente el pie de página estándar de Divi, incluida la barra de pie de página inferior.

Guardar cambios con el generador de temas

Guardar y cancelar diseños de plantillas

Cuando termines de crear tu plantilla, es importante que guardes los cambios en la Configuración de la plantilla. 

Para hacer esto, debes hacer clic en el botón Guardar en la parte inferior derecha de la página. Si deseas cancelar los cambios realizados en el diseño, simplemente haz clic en el icono X en la esquina superior derecha.

Nota: Si haces clic en el icono X durante un flujo de creación (sin guardar), el diseño de la plantilla no se creará ni guardará.

Guardar cambios de Theme Builder

Al igual que con las Opciones de tema Divi, debes guardar sus cambios en Theme Builder para que esos cambios surtan efecto. 

Si actualizas la página o cierras la ventana, los cambios se cancelarán / perderán.

Uso de contenido dinámico dentro del generador de temas

El contenido dinámico (es decir, Título, Imagen destacada, Contenido de publicación, etc.) se puede incluir en los diseños de Plantilla global o personalizada. Esta es una herramienta poderosa que te permite optimizar el diseño y la funcionalidad del sitio web, especialmente para publicaciones de blog y / o productos de WooCommerce.

Creación de una plantilla para las entradas (post) del blog en toda la web

Las entradas de blog son un gran ejemplo de dónde se necesita una plantilla personalizada con contenido dinámico. 

Esto nos permitirá diseñar una plantilla de entradas del blog que se aplicará a todas los artículos del blog en toda la web utilizando Divi Builder y contenido dinámico. 

Una vez hecho esto, todo lo que necesitas hacer es actualizar el contenido de las entradas futuras. ¡El nuevo contenido de la publicación heredará el diseño de la plantilla personalizada!

Aquí puedes ver un ejemplo rápido de cómo hacer esto:

Primero, crea una nueva plantilla y asigna la plantilla a Todas las publicaciones . Luego agregua un cuerpo personalizado a la plantilla.

Con el Editor de diseño de plantilla, diseña todo el diseño con Divi Builder combinado con los módulos y opciones de contenido dinámico integrados de Divi.

Por ejemplo, puedes usar el Módulo de título de la publicación para mostrar el título de la publicación de forma dinámica.

O utiliza un módulo de texto que extraiga la fecha del artículo.

Lo más importante, debes incluir el módulo Publicar contenido al crear cualquier diseño de cuerpo personalizado para tu plantilla. 

El módulo Publicar contenido incluye el área para el contenido de la página o publicación que se mostrará dentro del Área del cuerpo de la plantilla.

Aquí puedes ver una ilustración de un diseño completo para una plantilla de publicación de blog que usa contenido dinámico:

Una vez que se crea la plantilla, puedes crear fácilmente una nueva publicación de blog utilizando el editor de publicaciones predeterminado de WordPress y hacer que esa entrada herede el diseño de la plantilla de publicación de blog que se creó utilizando Divi Theme Builder.

También puedes usar Divi Builder en publicaciones de blog con esta plantilla personalizada. 

Funcionará de la misma manera. Lo que construyas con Divi Builder para tu artículo se mostrará dentro del área designada por el Módulo de contenido de publicaciones en el diseño de la plantilla.

Crea una plantilla de producto (de WooCommerce) que se aplique a TODOS los productos automáticamente

El contenido dinámico no solo se aplica a las plantillas de los artículos o entradas del blog. También puede usar los módulos integrados de Divi WooCommerce (o Woo) para crear una plantilla de página de producto personalizada en toda la web.

Para hacer esto, simplemente crea una nueva plantilla y asigne la plantilla a “Todos los productos”. Luego agrega un cuerpo personalizado a la plantilla y haz clic para construir el diseño del cuerpo usando el editor de plantillas.

Luego usa Divi Builder y los Módulos Woo para diseñar la plantilla de la página del Producto.

Ahora, cada vez que crees un nuevo producto en el backend utilizando el editor de página estándar del producto, el producto heredará automáticamente el diseño de la plantilla de cuerpo asignada.

Opciones de portabilidad para plantillas de Theme Builder

Exportar e importar plantillas

Con las opciones de portabilidad del generador de temas, puedes exportar todas o algunas de las plantillas de tema en un archivo. Estos archivos de exportación incluirán todos los diseños de biblioteca asociados con cada plantilla y todos los datos de asignación de plantillas.

Para acceder a la opción de Portabilidad de Theme Builder, haz clic en el icono de portabilidad a la derecha de la barra morada en la parte superior de la interfaz de Theme Builder.

Aparecerá el popup de portabilidad con la pestaña de exportación abierta por defecto. 

Asigna un nombre al archivo de exportación, actualice la opción de exportación (si es necesario) y haz clic para exportar el archivo. 

Si dejas la opción de exportación para exportar todas las plantillas, todas las plantillas de tema se exportarán en el archivo.

Si anulas la selección de la opción “Exportar todas las plantillas”, verás una lista de opciones que incluye una plantilla específica que puede elegir incluir en el archivo de exportación.

Para importar un archivo json de plantilla de generador de temas a tu web, deberás seleccionar la pestaña de importación. Selecciona el archivo que deseas importar, actualiza las opciones de anulación (si es necesario) y haz clic para importar el archivo.

IMPORTANTE: la importación importa todo, incluso las plantillas asignadas a páginas y publicaciones que no existen en la instalación actual de WP. 

Todos los conflictos se resuelven permitiendo que las plantillas importadas anulen las plantillas existentes en el sitio web. 

Esto significa que la plantilla predeterminada se anula y todas las asignaciones de página o publicación de las plantillas importadas tienen prioridad. 

Por ejemplo, si importas una plantilla asignada a la página 404, eliminará la página 404 de la plantilla actual asignada a la página 404.

Importar y exportar paquetes de creadores de temas completos

Las exportaciones de Theme Builder son lo que llamamos “Paquetes de Theme Builder”. Piensa en ellos como paquetes de diseño Divi, excepto por la estructura general de tu web en lugar de diseños de página individuales. 

Los paquetes de Theme Builder eliminan la necesidad de temas hijo en muchos casos y nos permiten crear plantillas de tema preconstruidas que se pueden usar en cualquier sitio web.

Conclusión

Poder usar el Constructor de Divi en lugares donde ante no se podía como la cabecera, el footer, las páginas de producto de WooCommerce, etc. nos abre un mundo de posibilidades maravilloso.

Divi es el Tema de WordPress más instalado del mundo por algo, y con actualizaciones como esta demuestra que cada vez es mejor, más rápido, más ligero y más versatil. Una auténtica pasada.

Si quieres aprender Divi a fondo conmigo de soporte para ayudarte entra en mi Curso de Divi y podrás descargar Divi gratis para usarlo de por vida en todas las web que desees.

Y si quieres comprar tu propia licencia de Divi entra en este enlace y tendrás el mayor descuento que existe: Comprar Divi con el mayor descuento

>> VALORA Y COMPARTE ESTE ARTÍCULO:
[Total: 7 Media: 5]
Elimina los códigos cortos de cualquier tema o plugin en 1 minuto

Elimina los códigos cortos de cualquier tema o plugin en 1 minuto

¿Los shortcodes o códigos cortos son buenos o malos?

Los códigos cortos o shortcodes son como los impuestos que pagamos, parecen malos pero gracias a ellos tenemos sanidad, educación, carreteras, etc.

Esto es lo mismo, gracias a estos shortcodes puedes tener funcionalidades brutales en tu WordPress que te permiten realizar cantidad de cosas de forma sencilla.

¿Cómo afectan los códigos cortos al posicionamiento, velocidad…?

Es importante que sepas que los códigos cortos o shortcodes son invisibles para Google con lo que ni te perjudican ni te benefician a nivel de SEO porque Google lo que ve es el html que genere ese shortcode.

Aunque mucha gente crea que los temas o plugins que usan códigos cortos son perjudiciales o penalizan el posicionamiento, esto es un mito, un error.

De hecho Divi es el Tema más instalado del mundo en WordPress y los usa, Contact Form igual, etc.

Yo mismo tengo webs con cientos de palabras clave en 1º página y posiciono a mis clientes en menos de 1 mes usando siempre el tema Divi, que es una maravilla para posicionar en Google.

Es una pena que haya gente que se decante por otros temas de WordPress solo por los códigos cortos que es algo que, como veremos, podemos resolver en 1 minuto si algún día dejamos de usar el tema Divi, o cualquier tema o plugin.

Es decir, usa el tema que te guste más ya sea Divi, Avada, Generate Press, Astra o el que te de la gana, pero no por los códigos cortos.

Elegir un tema o plugin porque use o no códigos cortos sería como comprar un coche porque te gusta el color de la tapicería.

¿Cómo eliminar shortcodes de Divi, Avada, Contact Form o cualquier tema o plugin?

Hay muchas maneras de eliminar estos códigos cortos, igual que hay muchas maneras de barrer una casa (escoba, aspiradora…) pero hoy te enseñaré la más sencilla de todas.

Si lo que quieres borrar son los códigos cortos de Divi porque vas a cambiar de tema debes saber antes que si en el nuevo tema instalas el plugin Divi Builder no necesitas borrar los códigos cortos y conservarás todos tus diseños en el nuevo tema que uses. En este tutorial de Divi tienes más información.

Instala el plugin Shortcode Cleaner

Si te vale con ocultar los códigos cortos pero quieres conservarlos en la base de datos de WordPress porque algún día puedes querer volver a utilizar esas funcionalidades que te han aportado, entonces te vale con la versión gratuita del plugin Shortcode Cleaner.

Si quieres borrar los códigos cortos también de la base de datos de WordPress, entonces tienes que comprar la versión pro del plugin. Pero no te preocupes que no llega ni a 20 euros. Es decir te va a ahorrar mucho trabajo por muy poco coste.

Mira aquí todo lo que t permitesste plugin y todas las diferencias entre la versión gratuita y la pro:

Shortcode Cleaner te permite

  • Ahorrar tiempo quitando del contenido los códigos cortos rotos.
  • Cambiar entre temas y complementos sin preocuparte.
  • Limpiar tu contenido automáticamente sin un clic, solo actívalo.

Funciones de Shortcode Cleaner Lite (gratis)

  • Limpiar el contenido del sitio frontend.
  • Limpiar publicaciones, páginas, tipos de publicaciones personalizadas [contenido, extracto, título, metaboxs].
  • Limpiar los widgets de las barras laterales [título, contenido], enlaces de menú, opciones de configuración.
  • Limpiar cualquier contenido dentro de códigos cortos rotos.
  • Limpiar los códigos cortos rotos normales y anidados.
  • Informes de panel de control más limpios.
  • Compruebar dónde se encuentran los códigos cortos rotos.
  • Control de la configuración del limpiador.
  • Shortcode Cleaner es un desarrollador amigable.

Características de Shortcode Cleaner Pro (de pago)

  • Limpia el contenido de administración del editor de fondo.
  • Limpia el contenido en una base de datos.
  • Limpia los códigos cortos rotos que quedan del generador de páginas (Visual Composer, Divi … etc.).
  • Muessra el estado de códigos cortos rotos en la barra de administración.
  • Obliga a los códigos cortos activos a romperse [inactivos].
  • Limpia un número ilimitado de publicaciones, páginas [en lugar de solo 100 en la versión lite].
  • Agregua nuevos filtros de contenido del sitio frontend personalizados.
  • Utiliza los filtros de contenido de administración WP de backend predeterminados.
  • Agregua nuevos filtros de contenido de administración de back-end personalizados.
  • Más opciones de control para desarrolladores.
  • Actualizaciones de por vida y soporte con compras únicas.

Elimina los shortcodes en 1 minuto

RECUERDA HACER SIEMPRE COPIA DE SEGURIDAD ANTES DE BORRAR NADA. No vaya a ser qe pierdas cosas que no quieres perder.

Si te vale con e plugin gratuito y con ocultar los códigos cortos (recuerda que no afectan al seo) entonces instala Shortccode Cleaner Lite y a correr. ¿Dije en un minuto? en 1 segundo ya los has eliminado jeje Además no hace falta que configures nada, con activarlo te vale.

Si quieres borrarlos definitivamente, simplementee compra el plugin Shortcode Cleaner y ve a SETINGS > GENERAL y activa enable cleaner on the backend o sigue esos sencillos pasos del vídeo dónde lo verás muy claro:

>> VALORA Y COMPARTE ESTE ARTÍCULO:
[Total: 0 Media: 0]
Nuevas opciones de altura y anchura de Divi

Nuevas opciones de altura y anchura de Divi

Ya sabes que en Elegant Themes actualizan Divi con frecuencia y van mejorando muchas funcionalidades.

No en vano el tema Divi es el tema de WordPress más instalado del mundo.

Con las nuevas opciones de tamaño arrastrables de Divi, literalmente puedes controlar el ancho, el ancho máximo, la altura mínima, la altura máxima y la altura máxima de cada elemento dentro del propio constructor. Esto te da la libertad para editar para cualquier dispositivo (responsive) de forma sencilla.

Todo esto suena bien, pero ¿cómo se traduce esto en una web? Eso es exactamente de lo que vamos a hablar en este post. Comenzaremos explicando primero la diferencia entre todas las propiedades de altura y anchura disponibles dentro de la configuración de Divi y luego las usaremos en diferentes escenarios para hacer que nuestros diseños de página se comporten exactamente de la manera que queremos.

¡Vamos a ello!

Entendiendo la diferencia entre las distintas propiedades

Antes de utilizar el ancho y el ancho máximo en nuestros procesos de diseño diarios, es importante entender lo que hacen. Esto es lo que la explicación teórica es:

Ancho:  el ancho real de un elemento de diseño. Si esto es 100%, es tan ancho como el contenedor lo permite. El ancho generalmente se expresa usando %. Cuanto menor sea el porcentaje para el ancho, más estrecho será el elemento de diseño.

Ancho  máximo: el ancho máximo tiene poder sobre el ancho. Si el ancho de un módulo se establece en 100%, se adherirá a ese valor siempre y cuando se mantenga por debajo del valor de ancho máximo. Una vez que se alcanza el valor de ancho máximo, no lo excederá.

Pero, ¿cómo se traduce eso en diseño responsive? Para ayudar a explicar la diferencia, vamos a crear una comparación visual habilitando el Visual Builder en una página completamente nueva. Agregaremos una sección con una fila de una columna. Luego, insertamos un módulo de texto con algo de contenido, un color de fondo y un relleno personalizado.

diseño de respuesta

Cambiando el ancho

Cuando cambia el ancho del módulo de texto al 80%, verá que el módulo de texto se reduce de tamaño. También se muestra la posibilidad de alinear el módulo como desee.

diseño de respuesta

Cambiando el ancho máximo

Cuando cambia el ancho máximo, el valor asignado solo comenzará a aplicarse desde el momento en que el ancho real exceda el valor del ancho máximo. Vamos a demostrar que realmente rápido:

No excedido

diseño de respuesta

Excedido

diseño de respuesta

Además del ancho y el ancho máximo, también podrás encontrar la altura mínima, la altura y la altura máxima en la configuración de tamaño de cada elemento. Esto es lo que teóricamente puedes entender de estos términos:

Altura  mínima: la altura mínima que desea asignar a un elemento. Si este valor es mayor que la entrada de altura, la entrada de altura mínima dominará.

Altura:  esto define la altura real que desea asignar al elemento.

Altura máxima:  este valor se convierte en la nueva altura una vez que la altura supera el valor asignado a la altura.

Cambiando la altura mínima

Si cambias la altura mínima de un elemento, ese valor se convierte en la norma. Al probarlo, verás automáticamente la altura del cambio del módulo de texto en tiempo real.

diseño de respuesta

Cambiando la altura

Si estás combinando una altura mínima y una altura, deberás asegurarte de que la altura sea mayor que la altura mínima. Si no, la altura será ignorada. En los dos GIF a continuación, podrás ver la diferencia en tiempo real.

No supera

diseño de respuesta

Supera

diseño de respuesta

Cambiando la altura máxima

La altura máxima se hace cargo si supera la altura mínima, pero es más pequeña que la altura. Si, por ejemplo, asignara un valor más alto a la altura mínima que a la altura máxima, la altura mínima dominaría.

Cambiar el ancho máximo para las filas

Una de las mejores prácticas en diseño web es decidir sobre un ancho máximo particular para todo su sitio web. Esto ayuda a que todo se vea receptivo en diferentes tamaños de pantalla. También ayuda a los diseñadores a crear wireframes precisos.

Cambiando el ancho máximo global

Puede o no saber que puede establecer un cierto ancho máximo predeterminado para su contenido en el Personalizador de temas yendo a la Configuración general y continuando a la Configuración de diseño. Mantener el ancho máximo persistente ayuda a potenciar la capacidad de respuesta.

diseño de respuesta

Cambia el ancho máximo para una fila en particular

Con la nueva actualización de tamaño arrastrable, también tienes la oportunidad de definir individualmente un ancho máximo para filas. Esto es ideal para las excepciones donde tiene más sentido ir con un ancho máximo más alto.

diseño de respuesta

Dando módulos a la misma altura

Otra técnica que debes tener en cuenta se centra en dar la misma altura a elementos similares. Esto es estéticamente agradable a la vista y ayuda a los visitantes a buscar contenido fácilmente. Hay dos formas comunes de abordar esto:

Usando el igualador de columnas

El primer método es uno que ha estado con Divi durante mucho tiempo. Si deseas crear la misma altura para cada una de las columnas de su fila, puedes habilitar el Igualador de columnas en la configuración de tamaño de su fila. Si estás utilizando colores de fondo de columna, notarás rápidamente la diferencia.

diseño de respuesta

Asignar altura a cada módulo

Otra forma de abordarlo es asignando una altura predefinida a los módulos que estás agregando.

diseño de respuesta

Alinear contenido dentro de un módulo

Una vez que hayas asignado una altura a todos los módulos, también puedes jugar con la alineación del contenido. Para hacerlo, puedes usar un relleno personalizado para determinar manualmente el espacio en blanco en un módulo, o usar unas pocas líneas de código CSS para alinear automáticamente el contenido.

display: flex;
flex-wrap: wrap;
align-contentcenter;
diseño de respuesta

Eligiendo la altura o anchura del elemento de diseño y el desbordamiento de giro en desplazamiento

Otra cosa interesante que puede hacer con las nuevas opciones de tamaño arrastrables es convertir el desbordamiento en desplazamiento. Esto te ayudará fácilmente a ahorrar espacio en tus páginas y agregará interacción adicional. Hay dos pasos para esto; configura una altura para tu elemento y cambia el desbordamiento en la configuración de visibilidad. Comienza por cambiar la altura de tu módulo o elemento.

diseño de respuesta

Luego, ve a la configuración de visibilidad de tu elemento y cambia el desbordamiento vertical en desplazamiento.

diseño de respuesta

Creación de una sección de pantalla completa en todos los tamaños de pantalla

¡A la siguiente y última sugerencia! ¿Quieres crear una sección de pantalla completa? Abre la sección en tu página, ve a la configuración de tamaño y cambia la altura. Es importante que uses la unidad de ventana de altura para esto para asegurarte de que todo sigue respondiendo en todos los tamaños de pantalla.

  • Altura: 100vh
diseño de respuesta

¿Deseas alinear centralmente el contenido en tu sección de pantalla completa? Agregua también las siguientes líneas de código CSS personalizadas al elemento principal de tu sección:

display: flex;
flex-wrap: wrap;
align-contentcenter;
diseño de respuesta

Conclusiones

En esta publicación, he revisado las nuevas opciones de ancho y altura que vienen con la actualización de tamaño arrastrable de Divi. Te he mostrado cómo funcionan y cómo puedes usarlos para crear un diseño de página responsive para cualquier tipo de sitio web que estés creando. Si tienes alguna pregunta o sugerencia, ¡deja un comentario en la sección de comentarios!

Si quieres aprender más sobre Divi y conseguir más regalos de Divi, apúntate a mi Curso de Divi y te ayudaré de primera mano.

>> VALORA Y COMPARTE ESTE ARTÍCULO:
[Total: 1 Media: 5]
Nuevo Centro de Soporte de Divi: Resuelve casi cualquier problema de forma sencilla

Nuevo Centro de Soporte de Divi: Resuelve casi cualquier problema de forma sencilla

Quizá una de las cosas más importantes cuando vamos a diseñar una web es que si tenemos algún problema o nos atascamos con algo, podamos resolverlo de forma sencilla antes de que empiecen a aparecer los sudores.

Todos mis alumnos de mi Curso de Divi (donde enseño a diseñar una web en 1 semana) me tienen a mi y yo les ayudo encantado, pero ahora, además, dentro de Divi vas a tener soporte con Elegant Themes incorporado.

En Elegant Themes, son muy conscientes de esto y con esta nueva actualización han querido proporcionar el mejor apoyo posible. Pero seamos honestos, no es fácil.

Es especialmente difícil cuando se trata del tema de WordPress más instalado del mundo, con más de 500.000 clientes, que les hacen miles y miles de preguntas cada día. 

Según parece han estado trabajando duro para mejorar el sistema de soporte y la forma en que interactuan con todos los que diseñamos webs con el tema Divi. 

Con esta mejora tiene pinta de que encontrar ayuda a problemas e incidencias tipicas va a ser mucho más sencillo.

A parir de esta versión de Divi (que por supuesto tienes ya disponible para descargar en mi curso de Divi) verás una nueva pestaña llamada: Centro de soporte.

Te explico lo que va a permitir porque hay cosas realmente chulas.


Estado del sistema


Dentro del Centro de soporte de Divi, lo primero que notarás es la sección Estado del sistema. El estado del sistema nos muestra una visión general rápida de las estadísticas y la configuración de nuestro servidor, y nos informa si hay algo que pueda causar problemas de compatibilidad con Divi. Si todas las luces son verdes, está todo perfecto. Si algo está en rojo, probablemente deberías abordarlo. Si algo está en amarillo, podrías considerar hacer ajustes para mejorar. 

La configuración correcta de tu hosting soluciona la mayoria de los problemas más comunes que puedes encontrar con Divi.

Esto a del Estado del sistema te ahorrará mucho tiempo de estar hablando con tu hosting o buscando el por qué de las incidencias que tengas. Este es el primer paso para saber que tienes el hosting bien configurado y que no vas a tener problemas de configuración, etc.


Acceso remoto


Esta joyita dentro de Divi te va a permitir que de forma ultra sencilla el equipo de soporte de Elegant Themes entre en tu web y te solucione el problema (lógicamente si tienes tu propia licencia de Divi). 

Cuando necesites ayuda, puedes habilitar el conmutador de acceso remoto con un solo clic. 

Esto enviará un token seguro al personal de soporte de Elegant Themes que pueden usar para iniciar sesión en tu Panel de WordPress. 

Ya no se comparten contraseñas y no es necesario enviar el token a su equipo de soporte. Mientras el acceso remoto está habilitado, el equipo de soporte podrá iniciar sesión en tu web y ayudarte con cualquier problema. Incluso puedes habilitarlo de forma preventiva antes de chatear con el equipo de soporte para que puedan entrar de inmediato si es necesario.

De manera predeterminada, el personal de soporte de Elegant Themes tendrá acceso limitado a tu web pero puedes habilitarles el acceso de administrador completo si quieres. El acceso remoto se desactiva automáticamente después de 4 días, o cuando desactivas Divi. También puedes apagarlo manualmente después de que se haya resuelto un problema y, por supuesto, el acceso remoto solo puedes habilitarlo  , el propietario del sitio web, y no Elegant Themes ni nadie más.

El sistema de acceso remoto es maravilloso porque ahorra mucho tiempo durante el chat de soporte y ahorra la molestia de tener que pelearse con ciertos problemas complicados. Nos permite resolver problemas rápidamente, en lugar de perder horas o días buscando la solución en foros, etc.


Modo seguro


La siguiente característica del Centro de soporte es el Modo seguro

Esto me encanta porque soluciona la pregunta que más recibo de mis alumnos. O mejor dicho, la manera de solucionar problemas que más suelo recomendarles porque soluciona el 90% de los problemas de incompatibilidades (con otros plugins, etc.)

La mayor parte de los problemas que las personas experimentan al usar Divi están relacionados con la compatibilidad, lo cual es natural considerando el ecosistema de código abierto de WordPress. Lo más habitual es que haya alguna incompatibilidad con algún plugin.

Habitualmente, la única forma de descubrir qué plugin causaba el problema era deshabilitar uno por uno hasta dar con el “culpable”. Sin embargo, esto lleva tiempo y podría causar probelmas en tu web (ya que muchas cosas que tengas instaladas dejarían de verse) con lo que causaría interrupciones a tus visitantes. 

Mucha gente a menudo no lo hace, por pereza o por no “estropear” la web desactivando los plugins. Y si no se hace esto de ir desactivándolos 1 a 1 es imposible averiguar cuál era el causante del problema. El modo seguro resuelve esto.

Aquí entra la joyita del modo seguro:

Cuando activas el Modo seguro, todos los plugins, el tema hijo (si usas) y todos los scripts personalizados se desactivan temporalmente. ¡Pero , sólo están deshabilitados para ti! 

Esto significa que tú o el personal de soporte podéis habilitar el Modo seguro con un solo clic, y sin causar ningún cambio en la web ni en la experiencia de tus visitantes. 

Mientras estás en Modo seguro, puedes investigar en tu web y en el Editor de Divi para ver si aún experimenta problemas. Si los problemas desaparecen, entonces sabrás que fueron causados ​​por un problema de compatibilidad de terceros (plugins, tema hijo…) Una vez confirmado esto, podemos continuar con el siguiente paso e intentar solucionarlo.

El modo seguro combinado con acceso remoto es una cosa maravillosa. Con dos clics, puedes permitir que el personal de soporte inicie sesión y llegue al fondo de los problemas sin afectar tu web.


Documentación y videos de ayuda


El Centro de soporte también incluye una sección de documentación que incluye algunos videos que te ayudarán a comenzar con Divi, así como enlaces rápidos a algunos de los artículos de documentación más populares. Para los nuevos usuarios, este es un gran lugar para comenzar a usar Divi. Muchas de las preguntas que me hacen habitualmente mis alumnos del Curso de Divi se pueden responder con un enlace a la página de documentación.


Registro de depuración


Finalmente, tenemos la sección Registro de depuración, que nos muestra un fácil acceso a todos los errores y advertencias que se han producido en la web. Esto te puede dar una idea de cuál podría ser la causa de cualquier problema en particular. 

A menudo era complicado encontrar los registros de depuración cuando nos lo solicitaban desde el soporte de Elegant Themes, lo que significaba que se perdia tiempo buscando el problema. El registro de depuración ahorra mucho tiempo de estar investigando.


Conclusión: Un mejor soporte con el que será más fácil y rápido solucionar cualquier problema


Cuando se combinan, todas estas características se resuelven la mayoría de las incidencias. Se acabaron los días en que se desperdiciaban las primeras horas de soporte al solicitar información del servidor, desactivar los plugins e instalar el complemento de soporte.

El Centro de soporte está disponible desde hoy para todos los usuarios con Licencia, así que si no la tienes, ya ves una razón más para tenerla. Ahorrar mucho tiempo solucionando cualquier problema de forma sencilla. Hay cosas que cuestan menos de lo que valen.


Si quieres aprender más sobre Divi…


Muy fácil… entra en mi Curso de Divi Online y tendrás acceso a 3 cursos en 1 y podrás descargar Divi gratis y usarlo en tu web de por vida (en el enlace anterior te explico todo con detalle):

  • Curso de Divi Express para hacer tu web en 1 semana
  • Curso de Divi a fondo
  • Curso de WordPress

Descuentos en las licencias de Divi


La única manera de poder tener acceso a este soporte, descargar todas las plantillas de Divi, tener actualizaciones incluidas, etc. es comprando una de sus dos licencias.

DEVELOPER: La más barata (licencia Developer) pagas 89 dólares (algo menos en euros) y puedes descargartelas todas dentro de la biblioteca de Divi. Podrás usar Divi en webs ilimitadas. Puedes pagar solo una vez y usarlo de por vida pero a partir del segundo año no tendrás derecho a las actualizaciones.

LIFETIME: O puedes pagar la licencia Lifetime y tener todo de por vida, Divi en webs ilimitadas, plantillas, actualizaciones, etc.

Aquí te dejo enlaces con descuentos:

DESCUENTO 20% LICENCIA DEVELOPER: PULSA AQUÍ

DESCUENTO 10% LICIENCIA LIFETIME: PULSA AQUÍ


>> VALORA Y COMPARTE ESTE ARTÍCULO:
[Total: 0 Media: 0]
Temas WordPress: Divi es el Mejor tema del Mundo (lo dicen los datos)

Temas WordPress: Divi es el Mejor tema del Mundo (lo dicen los datos)

NOTA: Hay muchas maneras de elegir el mejor tema de WordPress (facilidad de uso, flexibilidad, velocidad, seguridad…) hoy vamos a ver los temas TOP según el número de usuarios que lo usan en el mundo. Es decir que lo han elegido como el Mejor Tema de WordPress para diseñar su propia web.

Después de leer el artículo de mi amigo Fernando Tellado sobre el Top 10 de los temas de WordPress en España y en el Mundo he querido yo hablar sobre este tema que me parece muy importante para todos los que estén queriendo crear su propia página web y que están buscando el mejor tema de WordPress para tener la seguridad de que usan la mejor herramienta posible.

Temas WordPress: Divi es el Mejor del Mundo (lo dicen los datos)

Cada uno tendrá su opinión, como en todo en la vida. Pero hoy no vamos a hablar de opiniones sino de hechos, de datos, de elementos objetivos.

La frase el mejor tema de WordPress encierra 2 preguntas en si misma ¿El mejor tema para qué? ¿El mejor tema para quién?

  • La respuesta más habitual a la pregunta de “para qué” suele ser: “Busco el mejor tema de WordPress para diseñar una web de forma sencilla y que la web me genere ingresos”
  • La respuesta a la pregunta de “para quién” la vas a ver en este post. Para la aplastante mayoría Divi es el mejor tema de WordPress.

Si no me conoces me presento. Mi nombre es Gonzalo de la Campa y soy Diseñador Web en WordPress especializado en Divi y Profesor de WordPress con Cursos Online desde 2014 y ayudo a personas a emprender desde 0 en Emprendit, la única formación que incluye página web, Seo, Hosting y todo lo que se necesita para emprender en Internet.

El mejor tema de WordPress en el Mundo

Igual que gana la Bota de Oro en fútbol el futbolista que más goles marca, aquí la Bota de Oro se la lleva de calle Divi.

El único dato objetivo o al menos el más potente (no opinable) para decir cuál ha sido y es el Mejor Tema de WordPress es el número de usuarios que confían en ese tema para realizar su página web y pese a que en España (un país a veces muy acostumbrado a criticar jeje) hay algunos feroces críticos de Divi, vamos a ver cuáles son las cifras para el resto del mundo.

Temas WordPress: Los 20 mejores

Ranking mejor tema WordPress

 

Fuente: https://trends.builtwith.com/framework/wordpress-theme/traffic/Entire-Internet

Como podéis ver, el Tema Divi lidera la clasificación. En WordPress, Divi es el tema en el que más confían los usuarios de todo el mundo. Solo le sigue de cerca Twenty Seventeen porque es un tema gratuito que viene preinstalado con WordPress y ni siquiera así supera a Divi.

El siguiente ya ni siquiera le hace sombra. Avada tiene aproximadamente la mitad de usuarios y eso que es un tema que empezó mucho antes que Divi. Yo mismo usé Avada cuando empezaba y allá por 2014 me pasé a Divi y desde entonces no uso otro, así de claro.

En España algunos marketinianos son fan de Genesis o GeneratePress, pero como véis en el mundo los datos están muy lejos de que estos temas sean los más valorados por los usuarios. La respuesta es fácil. Temas como Genesis son más complicados y menos flexibles de utilizar y no democratizan tanto el conocimiento como lo hace Divi.

A mi me ha llegado mucha gente pidiendo que le cambie su tema a Divi, bien porque tuviesen Avada, Genesis u otros temas y porque veían que no podían hacer de forma sencilla muchas cosas que deberían serlo. Aquí os dejo un ejemplo de un cliente que me pidió que le cambiase su tema de WordPress de Genesis a Divi.

 

El mejor tema de WordPress en España

Como veréis qué sucede en otros países como Estados Unidos, Reino Unido o Francia, en España Divi es también el Tema de WordPress en el que más usuarios confían para crear su web. Yo llevo usándolo desde 2014, así que hablo con conocimiento de causa, he hecho cientos de webs en Divi y he enseñado a casi 1.000 alumnos a usar Divi con mi Curso de Divi en el que no solo se aprende Divi desde cero sino que los alumnos pueden descargar Divi gratis para usarlo en sus proyectos y además tienen mi soporte para ayudarles con lo que necesiten.

Divi desde que empezó en España tuvo algunos detractores que hicieron mucho ruido y a veces me ha llegado mucha gente confundida pensando algunas cosas de Divi que no son ciertas. Por eso hace tiempo hice este artículo de Los 7 falsos mitos de Divi que deberías conocer para analizar a fondo Divi y demostrar su gran velocidad de carga, lo magnífico que es para posicionamiento SEO, etc. Yo mismo posiciono en Google a mis clientes sus webs en un solo mes de trabajo con las páginas que les diseño en Divi con mi plan de SEO Ilimitado.

Como podéis ver en el gráfico y pese a lo que algunos podían desconocer Divi está muy por encima del resto. Le sigue Avada y otros temas populares como Genesis, GeneratePress, etc ni aparecen en la gráfica. Esto no es una opinión de si Divi es el mejor o no lo es, esto son datos reales de los usuarios que confian en Divi para diseñar su web.

 

Veamos ahora el Ranking de los mejores temas de WordPress en España… Divi, como siempre en la pole y sus perseguidores están muy muy lejos de Divi. 

Por cierto, ya que estamos hablando tanto de Divi, si quieres saber más sobre Divi aquí tienes un Mega Tutorial sobre Divi.

Fuente: https://trends.builtwith.com/framework/wordpress-theme/country/Spain

 

El mejor tema de WordPress en Estados Unidos

En Estados Unidos Divi sigue siendo el número 1 de los Temas de WordPress. Comparte podio con Twenty Seventeen que parte con ventaja al ser un tema gratuito que viene instalado al instalar WordPress. Es decir, ni con esas supera a Divi y si comparamos Divi con temas no preinstalados para jugar en igualdad de condiciones los siguientes bajan a la mitad, es decir, en Estados Unidos los usuarios confían en Divi como el mejor tema de WordPress.

 

El mejor tema de WordPress en Reino Unido (UK)

Psa lo mismo que en Estados Unidos y el resto del Mundo. Divi en el Reino Unido es el tema en el que más confían los usuarios. Y el siguiente Tema Premium vuelve a bajar a la mitad, en esta caso el que más se le acerca es Avada y ni Genesis ni GeneratePress ni muchos otros aparecen en el podio.

 

El mejor tema de WordPress en Francia

En nuestro país vecino sucede lo mismo que en Estados Unidos, el Reino Unido y el resto del Mundo. Divi está en la posición Nº1. Y por aquí tampoco aparece Genesis, ni Enfold, ni GeneratePress…

Temas WordPress Divi

Mejor Tema WordPress en Francia

 

Divi sigue creciendo a pasos agigantados

Pero es que además de todo esto que hemos visto, la tendencia apoya todavía más al Tema Divi como el mejor tema de WordPress para la mayoría de usuarios del mundo. Estas 2 gráficas te van a dejar helado:

Y mira ahora la tendencia de búsquedas de Divi comparado con otros temas de WordPress según Google Trends. Como verás las tendencias demuestran que Divi es el tema de WordPress que más interés despierta, solo seguido de Avada y ya muy de lejos otros como GeneratePress o Twenty Seventeen.

Fuente: https://trends.builtwith.com/framework/Divi

 

¿Cómo descargar Divi?

Imagino una vez sabiendo cuál es el mejor Tema de WordPress querrás usarlo en tu web, pues bien la única manera de poder descargar todas las plantillas de Divi de forma legal, es comprando una de sus dos licencias o apuntándote a algún Curso de Divi que incluya el tema Divi para descargar gratis para sus alumnos. De hecho yo en mi Pack de Todos los cursos además añado mi código de licencia a la web del alumno para que lo pueda actualizar de por vida de forma sencilla sin comprar la licencia. Ya que al ser mi cliente puede tenerlo de forma 100% legal.

Los que queráis comprar vuestra licencia de Divi debéis saber que hay 2 licencias (y aquí tienes descuentos):

 – 1 – DEVELOPER: La más barata (licencia Developer) pagas 89 dólares (algo menos en euros) y puedes descargarlas todas dentro de la biblioteca de Divi. Podrás usar Divi en webs ilimitadas. Puedes pagar solo una vez y usarlo de por vida pero a partir del segundo año no tendrás derecho a las actualizaciones.

 – 2 – LIFETIME: O puedes pagar la licencia Lifetime y tener todo de por vida, Divi en webs ilimitadas, plantillas, actualizaciones, etc.

Aquí te dejo enlaces con descuentos:

DESCUENTO 20% LICENCIA DEVELOPER: PULSA AQUÍ

DESCUENTO 10% LICIENCIA LIFETIME: PULSA AQUÍ

Espero que todo esto te haya gustado y si es así te agradecería que me ayudases compartiéndolo en tus redes sociales.
Si tienes alguna duda te espero en los comentarios.
¡Un fuerte abrazo!
>> VALORA Y COMPARTE ESTE ARTÍCULO:
[Total: 0 Media: 0]

Dime dónde te envío

tus regalos

Responsable de los datos: Gonzalo de la Campa Marinas
Finalidad de los datos: Enviarte información.
Almacenamiento de los datos: Base de datos alojada en Profesional Hosting (UE)
Derechos: En cualquier momento puedes limitar, recuperar y borrar tu información.

218813

¿Te vas sin tu regalo?

Mis secretos para crear una web de exito

+ trucos y recursos gratis para Divi

Responsable de los datos: Gonzalo de la Campa Marinas
Finalidad de los datos: Enviarte información.
Almacenamiento de los datos: Base de datos alojada en Profesional Hosting (UE)
Derechos: En cualquier momento puedes limitar, recuperar y borrar tu información.

Dime dónde te envío

el enlace al webinar

Responsable de los datos: Gonzalo de la Campa Marinas
Finalidad de los datos: Enviarte información.
Almacenamiento de los datos: Base de datos alojada en Mailchimp.
Derechos: En cualquier momento puedes limitar, recuperar y borrar tu información.

Dime dónde te envío

el enlace al webinar

Responsable de los datos: Gonzalo de la Campa Marinas
Finalidad de los datos: Enviarte información.
Almacenamiento de los datos: Base de datos alojada en Profesional Hosting (UE)
Derechos: En cualquier momento puedes limitar, recuperar y borrar tu información.

Abrir chat
1
¿Alguna duda? Soy Gonzalo, cuéntame y te ayudo encantado.
Powered by