Divi: El poder de la característica “Global” de los módulos de Divi
A estas alturas seguro que ya has explorado Divi y probablemente te estarás preguntando por la “Biblioteca Divi” y cómo sacarle partido.
En pocas palabras, verás que se trata de un nuevo espacio para que guardes módulos individuales, Filas, Secciones o incluso diseños completos que hayas construido utilizando el Divi Builder.
Una vez que un artículo ha sido guardado en la biblioteca, se puede acceder rápidamente a él desde el mismo Constructor. Estos elementos de la biblioteca son como herramientas en tu nuevo kit de herramientas de diseño web, y se pueden utilizar cuando creas nuevas páginas de tu sitio web, o al crear nuevos sitios web para tus clientes.
Oportunidad única de ahorro en plantillas WordPress y Divi Builder en Blackfriday:
Si ya estás suscrito a Elegant Themes, ahora puedes renovar por mucho menos dinero y para siempre:
¡¡Renueva tu suscripción por la mejor oferta vista en Elegant Themes y para siempre!!
Pues puede ser tuya a un precio de escándalo solo si te das prisa. Si te interesa dame tu email y te envío todos los detalles al instante.
Al comenzar a construir y ampliar tu biblioteca con estos elementos prefabricados / personalizados, te darás cuenta que te ahorrarás innumerables horas de tiempo de desarrollo.
Pero eso es sólo el principio, porque los desarrolladores de Divi han añadido algo aún más especial a la Biblioteca Divi, los Ítems Globales, y ahí es donde esta historia realmente comienza. Cuando un elemento se hace “Global” dentro de la biblioteca, cualquier cambio que se haga en él se verá reflejado a través de todas las páginas en las que se haya añadido.
En pocas palabras: cada vez que actualices este elemento “global”, los cambios se aplicarán automáticamente a cada instancia del módulo global!!
Así que si aplicas un módulo repetido o sección en tu sitio, lo ideal es que sea global y ya verás la magia actuar en segundos.
En este ejemplo, esta colocado un Módulo de Formulario de contacto en la parte inferior de cada página en el sitio web, con el objetivo de convertir a los visitantes en clientes potenciales independientemente de la página en la que están.
Si alguna vez quieres hacer un cambio en esa área de su página web, sólo tiene que actualizar el módulo global una vez, en lugar de tener que actualizar un módulo estándar en docenas de lugares diferentes.
Si un día decides cambiar el esquema de color de tu sitio web, este módulo global se puede actualizar una vez y el nuevo estilo se verá reflejado en todas las páginas en las que ha sido añadido.
Es fácil ver cómo el uso de esta nueva característica te puede ahorrar un montón de tiempo!
Si buscas un hosting web de excelente calidad, no te pierdas las ofertas de SiteGround, un proveedor Premium recomendado por WordPress y que te costará muy poco dinero.
Cómo guardar un ítem Global en La Biblioteca Divi
Al crear o editar un nuevo módulo, fila o sección dentro del Divi Builder, verás un nuevo botón de “Guardar” en la parte inferior de la ventana de configuración llamado “Save & Añadir a la biblioteca”, justo alado del botón habitual de “Guardar y Salir”.
Al hacer clic en el botón “Guardar y Salir”, la configuración de los módulos se guardan en la página actual y la ventana emergente se cierra. Al hacer clic en “Guardar y Añadir a la biblioteca”, el módulo se guarda en tu página, pero también se agrega a su Biblioteca Divi.
Cualquier módulo que se agrega a la Biblioteca Divi se puede convertir en un artículo “Global” seleccionando la opción “Hacer esto un elemento global” al guardar.
Una vez que un elemento se ha guardado como un “Elemento Global”, el módulo asume una nueva apariencia verde dentro del constructor, es por esto que es fácil identificar qué módulos en tu página son globales y cuáles no.
Pues puede ser tuya a un precio de escándalo solo si te das prisa. Si te interesa dame tu email y te envío todos los detalles al instante.
Cómo administrar los Artículos Globales de la Biblioteca
Una vez que un tema global ha sido agregado a la biblioteca, se puede modificar mediante la edición del módulo dentro del Divi Builder, o editando el tema desde dentro de la Biblioteca Divi.
Todos los elementos de la biblioteca se pueden gestionar desde la página Divi> Biblioteca Divi en el panel de WordPress. Se puede realizar un filtrado por tipo: Módulo, Fila, Sección y Diseño, así como por característica: Global / No Global.
Para editar puede hacer clic en el botón “editar” junto a cualquier ítem global. Como ya mencionamos anteriormente cualquier cambio que se realice será proyectado en todas las páginas que lo utilicen como elemento global.
También se pueden editar los elementos globales desde dentro del constructor de páginas como si fuera un módulo estándar.
Si buscas un hosting web de excelente calidad, no te pierdas las ofertas de SiteGround, un proveedor Premium recomendado por WordPress y que te costará muy poco dinero.
Cómo adicionar artículos globales en tu página
Una vez que un tema global se ha guardado en la biblioteca, se puede añadir a cualquier nueva página desde el Constructor de Divi, haciendo clic en el botón “Añadir Desde Biblioteca”.
Aplicación de elementos globales
Hay muchas aplicaciones diferentes para el uso de elementos global en tu página. Cualquier elemento que se repite en diferentes páginas se puede convertir en un elemento global para hacerlos infinitamente más fáciles de manejar.
Centraliza tus barras laterales
¿Quieres añadir un diseño de doble barra lateral para todo tu sitio? Transforma los dos módulos de la barra lateral en un módulo global. Si alguna vez te decides a cambiar el formato de la barra lateral o el área de widget sólo hazlo una vez y con un clic puedes ajustarlo en cada página en tu sitio donde lo hayas colocado!
Sincronizar tus módulos de llamada a la acción
No todas las páginas de tu sitio web contendrán un módulo de llamada a la acción aunque es bastante común tener este tipo de módulos en varias páginas para asegurar que tu visitante siempre tenga un camino claro hacia la conversión.
Si este es el caso, ¿por qué no utilizar un solo módulo de llamada a la acción? Si un día decides que quieres que tu botón sea un poco más grande, sólo tienes que ajustar el tamaño de la fuente dentro del módulo global y automáticamente tendrás esa actualización en todo tu sitio web y al instante!
Pues puede ser tuya a un precio de escándalo solo si te das prisa. Si te interesa dame tu email y te envío todos los detalles al instante.
Menú de Navegación personalizado
¿Has utilizado un módulo de menú de ancho completo para crear un menú de navegación personalizado para todo tu sitio web? Si un día decides cambiar el esquema de color de tu sitio web, sería increíblemente lento tener que ajustar el color de fondo de tu menú en cada página en tu sitio. Los módulos globales te salvarán el día.
Ahora las secciones enteras pueden ser globales
El concepto de “Global” no sólo se aplica a los módulos individuales, también puede usarse en secciones enteras. Usando una sección global, combinada con las filas y módulos dentro de ella, puedes construir y gestionar áreas enteras de tu sitio web más fácilmente que nunca.
Por ejemplo, podrías utilizar el Divi Builder para crear tu propio pie de página (footer) personalizado para ser utilizado en la parte inferior de todas las páginas de tu sitio. Si deseas más control sobre tu pie de página, esta nueva sección global podría reemplazar por completo el menú de pie de página y pie de página estándar.
Transforma el diseño en un conjunto de secciones globales y luego añádelas a la parte inferior de todas las páginas de tu sitio. Si alguna vez desea editar el pie de página personalizado de tu página web, sólo tienes que actualizar la sección global y todo su sitio web se actualizará!
Utilizando de esta manera el Constructor Divi tendrás un control completo sobre el diseño de pie de página. Ahora eres libre de crear algo totalmente diferente al pie de página estándar de Divi, que es sólo una de las muchas maneras en que las secciones globales se pueden utilizar para tomar el control total sobre el diseño de tu sitio web.
Los módulos globales se pueden combinar con una “sincronización selectiva”
Los módulos globales se ponen aún más interesantes cuando se combinan con una sincronización selectiva. Al guardar un nuevo módulo a la Biblioteca Divi, puedes seleccionar el tipo de opción con la que te gustaría guardarlo. Puede optar por guardar alguna o todas tus configuraciones generales, o puedes optar por guardar la configuración de diseño avanzado o CSS personalizado.
Así que, ¿qué significa esto exactamente? Digamos que creas un nuevo módulo de ancho completo deslizante y lo guardas en la biblioteca como un módulo global. Al guardarlo, elige sincronización selectiva sólo del CSS personalizado y la configuraciones avanzada de diseño.
En este caso, los ajustes generales (que incluyen el contenido de tu control deslizante: título, texto e imágenes) no se hacen globales. Al agregar una nueva instancia de este control deslizante global a una nueva página, sólo la configuración dentro del CSS personalizado y la Configuración de Diseño Avanzado serán compartidos entre cada instancia del módulo global.
Se puede identificar que los ajustes están siendo compartidos por un módulo global por el color de su pestaña en la ventana de configuración. En el siguiente ejemplo, sólo las pestañas de Ajustes de diseño avanzado y CSS personalizado son de color verde. La ficha de configuración global no se está sincronizado y por lo tanto sigue siendo gris.
Ahora puedes agregar el control deslizante de ancho completo a la parte superior de varias de tus páginas en todo tu sitio web y con todo su estilo personalizado dentro de la configuración de diseño y su configuración avanzada CSS. Si un día deseas ajustar el tamaño de tu texto de cabecera, o cambiar el color de los botones deslizantes, es suficiente con hacerlo una vez y todas las instancias del módulo global se actualizarán!. También puedes crear un conjunto verdaderamente único de deslizadores usando CSS personalizado.
Al mismo tiempo, los ajustes generales para cada uno de estos módulos globales sigue siendo único. Cada control deslizante en la parte superior de cada página tiene su propio texto único y las imágenes, pero los estilos para cada uno se han unificado utilizando un módulo global con sincronización selectiva.
Esta combinación abre algunas oportunidades increíbles. La misma técnica se puede aplicar a casi cualquier módulo en tu sitio web. Si alguna vez deseas cambiar el diseño y la sensación general de todo tu sitio, sólo tienes que ajustar los estilos de unos cuantos módulos globales, en lugar de tener que editar cientos de módulos estándar repartidos en varias páginas.
Sólo hemos arañado la superficie!
En este post solo están explicadas algunas ideas básicas sobre cómo utilizar los elementos globales de la librería de Divi.
Hay mucho más que se puede hacer con esta nueva funcionalidad, y cuanto más utilices y visites la Biblioteca Divi descubrirás mas de una forma creativa de usar este kit de diseño web.
Divi es sin duda toda una joya de plantilla que nunca me canso de explorar.
¡No te olvides de compartir con nosotros cualquier descubrimiento que hagas con esta funcionalidad!
Pues puede ser tuya a un precio de escándalo solo si te das prisa. Si te interesa dame tu email y te envío todos los detalles al instante.
Si buscas un hosting web de excelente calidad, no te pierdas las ofertas de SiteGround, un proveedor Premium recomendado por WordPress y que te costará muy poco dinero.
Hola
Estoy comenzando con DIVI y me gustaría saber si es posible crear con DIVI una alternativa al plugin ultimos articulos publicados.
Gracias
Hola Pascual!
Te cuento que sí, es posible. Si usas el Theme Builder e importas un diseño predefinido para tus post o publicaciones verás que en el layout suelen colocar un módulo con esta función:
Hola amiga tengo un problema, utilizo la versión de DIVI 4.9.4 y no se si es que no encuentro la configuración para hacer que una sección no sea global, o que solo se edite en una pagina y no en el resto.
Hola Allan!
Te cuento que, una vez que creas el módulo con la característica global, no puedes dar marcha atrás… la idea de esta característica es usar un módulo que pondrás en varios lugares en toda tu web, como un footer por ejemplo o alguna publicidad que si quieres modificar sin tener que ir página por página lo harás dentro de la librería Divi y la modificación cambiará automáticamente en toda la web. Espero haberte ayudado… Mucha Suerte!!
Hola Allan,
Sí es posible. Si pones el curso sobre el icono con 3 puntitos de la sección (es el último, a la derecha del icono de la papelera) se despliega un submenú donde encontrarás la opción “Desactivar global” que hace que esa sección deje de ser global solo en esa página.
Espero que te sirva de ayuda.
Un saludo
Es una excelente ventaja que Elegant Themes actualice y mejore la plantilla con tanto mimo! en dos años lo que no era posible ahora si se puede hacer :)… Gracias por tu aporte Mario!
Hola Suswana,
Se puede exportar la biblioteca que hemos creado con modulos globales o no a otro prouyecto?
Gracias, cada vez visito mas esta página para resolver mis problemas, nuevamente gracias
Hola Adolfo!
Claro que si se puede, puedes exportar la biblioteca completa o los ítems de la biblioteca que estén seleccionados antes de que le des al botón de exportar… Mucha Suerte!!
estimados en la nueva version de divi 2.0.13 como se crea un global
Hola Mauro!
Siento mucho comentarte que la característica global de los módulos de Divi se a implementado a partir de la actualización 2.4…
Buenas tardes susana mi nombre es juan manuel estoy nuevo en la parte de divi recien estoy probandolo y me encanta te tengo unas preguntas como estoy medio novato como puedo hacer yo una entrada o pagina para registrar un usuario con clave y tambien que inicie sesion y que se abra una pagina que se vean sus datos es para una web de cursos online de antemano gracias por la ayuda prestada
Hola Juan Manuel!
Para lo que necesitas puedes usar varios plugins, por ejemplo para que se suscriban puedes instalar el plugin Bloom de Elegant Themes que es parte del paquete que adquieres. También puedes usar un plugin que se llama “User Access Manager” con el que puedes administrar el acceso de tus visitantes a tus publicaciones, páginas y archivos. Para eso tienes que crear un grupo de usuarios, agrupar a los usuarios registrados y establecer derechos para este grupo. A partir de ese momento las publicaciones y páginas sólo son accesibles y pueden escribirse para y por los miembros del grupo especificado. Este complemento es útil si necesitas un área de miembros o una sección privada en tu blog o quieres que otras personas puedan escribir en tu blog pero no en todas partes. Espero haberte ayudado! Mucha Suerte!!
Hola! Súper interesante el artículo, la verdad es que son una gozada los módulos de DIVI, y los globales más. Ahorran mucho trabajo.
Una pregunta, si haces un módulo global, y después quieres que deje de serlo, ¿es posible?
Un saludo!!
Hola Guatsna!
Muchas gracias, me alegra que te guste el post y sobre todo que te guste Divi!!
Sobre tu pregunta, por ahora te cuento que no es posible que un módulo deje de ser global… por qué quieres que deje de serlo? me encantaría que me lo cuentes…
Buenas tardes Susana. Gracias por compartir con los demás tus conocimientos.
¿Sabes si existe la posibilidad de incluir un módulo del contructor Divi (Bar Counter) dentro de otro módulo (Tabs)?
He probado a incluirlo escribiendo el shortcode del Bar Counter en el área de texto del contenido de una de las pestañas.
Y parecía que funcionaba. Pero cuando he vuelto a editar la página después de haberla guardado, el constructor de Divi me ha sacado el Bar Counter fuera del módulo Tabs y ha borrado el contenido de todas las pestañas.
¿Hay solución para esto?
Muchas gracias.
Efrén.
Hola Efrén!
Por ahora creo que no es posible… pero si eso cambia serás el primero al que se lo diga!!
Mucha Suerte!!
Hola Susana ¿Cómo estás? Me encantó tu post, tanto que compré el divi para utilizarlo pero quería saber si había alguna forma de hacer formularios para registrar personas en mi página anclando este registro a una base de datos. Ya tengo un hosting y querría saber si se puede, gracias de antemano.
Hola Pedro!
Si quieres crear una base de datos de usuarios de tu blog, por ejemplo para vender un producto (usando woocommerce) o para recibir una newsletter (usando Mail Chimp), debes pedir a tus usuarios que creen una cuenta en tu web. Para acceder a esa cuenta, ellos podrán hacerlo a través de la URL que se les envía automáticamente por mail (con usuario y contraseña) al crear la cuenta.
La manera de integrar Divi, para acceder a la cuenta, es a través del uso del “módulo loguin”, que puedes colocar en cualquier parte de tu web.
Otra forma de registrar personas en tu web puede ser usando un plugin como Participants Database y la integración con Divi es igual que los casos anteriores, con el módulo loguin. Espero haberte ayudado! Mucha Suerte!!
Hola Susana!
Necesito que las imagenes que se muestran en la galeria sean cuadradas y no rectangulares ¿sabes como lo puedo hacer? les he escrito a soporte de Elegant Themes y nada. Muchas gracias y felicitaciones por el portal que me ha ayudado muchisimo, un saludo.
Hola Andrés!
Disculpa por no contestar antes… todavía tienes el problema que me comentas? si es así, me pasas un link para que vea el problema y te sugiera alguna solución? gracias!
Hola Susana, enhorabuena por tu página, muy útil. Tengo una web con el theme Divi para productos afiliados, quiero poner las imágenes de productos con el mismo tamaño, he probado con el plugin regenerate thumbails, pero continúa igual, intento recortar desde medios-editar imagen, pero no me deja. Me aconsejas descargarlas y retocarlas con photoshop u otra herramienta similar? La descarga de las imágenes a mi web la hice de forma masiva con un plugin que las descarga desde amazon a mi web.
Saludos y gracias.
Hola Alberto!
Muchas gracias por tus palabras! has probado en borrar tu cache? a veces por no hacer ese simple paso nos complicamos la existencia pensando que los cambios no se han aplicado… si una vez borrado el caché sigue saliendo igual entonces si te recomiendo pasar tus imágenes por un procesador de imágenes como Photoshop… Mucha suerte!!
Hola Susana, en primer lugar felicitarte por tus artículos, son verdaderamente útiles. Yo estoy comenzando a usar Divi y tengo un problema: desde los móviles android, en el icono del menú en vez de aparecer las tres rayas horizontales, aparece una “a”. Sólo me ocurre en android, ¿cómo podría solucionarlo?
Muchas gracias de antemano por la respuesta y enhorabuena de nuevo
Hola Fran!
Muchas gracias! sobre tu consulta, tienes la posibilidad de cambiar el ícono siguiendo estos dos pasos:
1. Añade el siguiente código a tu “Custom CSS” en theme Options del ePanel:
@media only screen and (max-width: 980px) {
.et_header_style_centered .mobile_menu_bar {
background: #fff;
height: 30px;}}
2. Luego abre el archivo “functions.php” encuentra y cambia el código en negritas por el texto que quieras que aparezca en vez de la “a” por ejemplo “Menu” o “Index”:
Así podrás estandarizar tu menú en todos los dispositivos ;)… no te olvides de comentarme si funciona bien mi sugerencia vale? Mucha suerte!!
Muchas gracias Susana! Al final era un problema de inexperiencia: al toquetear el código para cambiar el pie de página y quitar la firma de wordpress, se me cambió eso también por algún motivo.
Ahora tengo otro problema (no salgo de uno y me meto en otro jeje) y es que cuando entras en móvil, en el menú pone “seleccionar página” y me gustaría poner “seleccione página e idioma” ya que tengo la página también en inglés.
Y ya aprovecho de tu amabilidad y te planteo un problema. Tengo la página en inglés y español con el plugin wpml, pero e formulario de contacto de la página en inglés, no me funciona, no me llegan los mails, ¿qué podría ser? (en español funciona perfectamente)
Mil millones de gracias de nuevo!!
Hola Fran!
No hay de que! me alegra que hayas resuelto el problema 😉
Sobre tu menú… tengo varios clientes que tuvieron el mismo problema de formulario usando el plugin wpml… es verdad que te soluciona la vida cuando se trata de traducir sin esfuerzo jejeje… pero a la larga ese “atajo” acarrea problemas técnicos como el del formulario de contacto… Lo ideal es crear tu web en el idioma base (www.tusitio.com) y luego instalar un nuevo wordpress en una subcarpeta de la página base con el duplicado de la web en el otro idioma (www.tusitio.com/eng). Al ser ambas páginas independientes los formularios no se cruzan y el cambio de idioma no perjudica la conexión con la base de datos. Solo colocas unos botones adicionales con las banderitas de los idiomas y esos botones abren la web de la subcarpeta… Mucha Suerte!!