Vamos a ver en este post una característica de gran utilidad de que dispone la plantilla Divi. Concretamente vamos a ver cómo podemos reutilizar diseños realizados con el Divi builder, en otras páginas del mismo sitio web.

Vamos a ver como podemos guardar diseños. Es decir, módulos, filas, secciones y/o páginas completas en la biblioteca Divi y posteriormente reutilizarlos en otras páginas de la misma web.

DESCUENTOS PLANTILLA DIVI

 

Si no conoces aún muy bien el funcionamiento del Divi Builder, te dejo este post para que profundices un poco en su funcionamiento básico: Divi Builder

 

En este post NO vamos a ver como se exporta un diseño de página realizado con el constructor de Divi y se importa en otro sitio web realizado con Divi, ya que este proceso ya lo tienes en este post: Exportar diseños a otros sitios web con Divi

En este post vamos a ver como utilizar la biblioteca Divi, para diseños realizados en unas páginas reutilizarlos en otras, pero siempre dentro del mismo sitio web.

 

 

 

 

1.- Cómo añadir un módulo, fila, sección y página a la biblioteca Divi con el Divi builder

 

Vamos a ver en este apartado como podemos añadir un módulo, una fila, una sección y una página completa a la biblioteca Divi con las dos versiones del divi builder de que dispone la plantilla Divi.

 

 

 

1.1.- Añadir elementos a la biblioteca divi con el constructor visual

 

Vamos a ver como añadir elementos (módulos, filas, secciones y páginas) a la biblioteca cuando estamos usando el constructor visual de la plantilla Divi.

 

i.- Añadir módulo a la biblioteca Divi con el constructor visual: pon el ratón sobre el módulo que quieres guardar en la biblioteca y haz clic sobre el icono formado por una flecha que apunta hacia abajo y está dentro de un círculo.

 

guardar módulo divi en la biblioteca para reutilizarlo

Guardar un módulo en la biblioteca Divi con el constructor visual

 

Ahora pon un nombre al módulo que se guardará en la biblioteca rellenando el campo “Layout Name”, y haz clic en “Guardar en Biblioteca”.

Nota: no marques la opción “Guardar como global”. Más adelante verás un apartado que explica en que consiste esta opción (VER APARTADO 3.-)

Nota: no es necesario crear una categoría. Esto sirve por si vas a guardar muchos módulos y quieres tenerlos clasificados por categorías. Si no es tu caso no hace falta que crees categorías.

 

nombrar el módulo que se va a guardar en la biblioteca divi

Poner nombre al módulo y guardarlo en la biblioteca divi

 

ii.- Añadir una fila a la biblioteca Divi con el constructor visual:

Para añadir una fila a la biblioteca Divi pon el ratón sobre una fila y haz clic en el mismo icono que comentamos en el apartado anterior (Añadir módulo a la biblioteca Divi con el constructor visual).

A continuación, procede igual que comentábamos en el apartado anterior, estableciendo un nombre para la fila guardada en la biblioteca y guardando.

 

¿Aún no sabes como importar diseños profesionales y gratuitos con la plantilla Divi? Mira este post: Importar diseños profesionales gratis con Divi

 

iii.- Añadir una sección a la biblioteca Divi con el constructor visual:

Para añadir una sección procederemos de igual manera que en los casos anteriores. En primer lugar, podremos el ratón sobre la sección y después haremos clic en el icono con la flecha apuntando hacia abajo e inscrita en un círculo.

A continuación, podremos un nombre a la sección y la guardaremos en la biblioteca.

 

iv.- Añadir una página completa a la biblioteca Divi con el constructor visual:

Para añadir el diseño completo de una página a la biblioteca de la plantilla Divi haremos clic en el botón circular con tres puntos que aparece en la parte inferior de la pantalla.

A continuación, verás cómo se despliegan varias opciones. Haz clic en el icono en forma de flecha apuntando hacia abajo e inscrita dentro de un círculo.

A continuación, procederemos como en los casos anteriores, poniendo nombre al diseño de páginas y guardándolo en la biblioteca.

 

 

1.2.- Añadir elementos a la biblioteca divi con el constructor tipo backend

 

Ahora vamos a ver como añadir páginas, secciones, filas y módulos a la biblioteca Divi, pero usando el page builder no visual, también llamado tipo backend.

 

 

i.- Añadir un módulo a la biblioteca divi con el page builder tipo backend

Para añadir un módulo a la biblioteca divi haremos clic en icono formado por tres rayas horizontales (ajustes del módulo) del módulo que queramos guardar.

A continuación, haremos clic en el botón que aparece en la parte inferior “Guardar y añadir a la biblioteca”.

Aparecerá una ventana emergente. Escribiremos el nombre que queremos poner a este diseño de módulo en la biblioteca rellenando el campo “Nombre de planilla o plantilla”.

Nota: no marques la opción “Guardar como global”. Más adelante verás un apartado que explica en que consiste esta opción (VER APARTADO 3.-)

Nota: no es necesario crear una categoría. Esto sirve por si vas a guardar muchos módulos y quieres tenerlos clasificados por categorías. Si no es tu caso no hace falta que crees categorías.

 

guardar módulo para utilizarlo en otra página

Proceso para añadir un módulo a la biblioteca de Divi usando el page builder tipo Backend

 

 

ii.- Añadir una fila a la biblioteca divi con el page builder tipo backend de Divi

Para añadir una fila procederemos de la misma manera que en el apartado anterior. Haremos clic en el icono de ajustes de la fila (icono de tres rayas horizontales), a continuación, haremos clic en el botón “Guardar y añadir a la biblioteca” y en la siguiente ventana emergente pondremos nombre al diseño y haremos clic en “Guardar y añadir a la biblioteca”.

 

iii.- Añadir sección a la biblioteca divi con el divi builder tipo backend

Para añadir una sección procederemos exactamente igual que en los apartados anteriores, solo que ahora haremos clic en ajustes de la sección (icono de tres rayas horizontales) para comenzar el proceso.

 

iv.- Añadir un diseño completo de página a la biblioteca divi con el builder tipo backend

Para añadir un diseño completo de página a la biblioteca haremos clic en el botón “guardar en biblioteca” que aparece en la parte superior del constructor.

A continuación, pondremos un nombre al diseño y haremos clic en el botón “guardar”.

 

Guardar diseño de página con Divi

Guardar diseño completo para vover a utilizarlo en otra página de la web hecha con Divi

 

 

2.- Cómo incluir un módulo, fila, sección o diseño completo guardado en la biblioteca

 

Vamos a ver ahora como podemos recuperar e insertar en una página los elementos que antes hemos aprendido a guardar en la biblioteca del Divi builder.

 

 

2.1.- Cómo incluir en una página un módulo guardado en la biblioteca del Divi Builder

 

Para incluir un módulo que tenemos previamente guardado en la biblioteca haremos clic en:

 

i.- Insertar módulo con el constructor tipo backend: en caso de usar el divi builder tipo backend haremos clic en el botón “+ Insertar módulos (s)”.

Nota: Para que te aparezca esta opción tienes que haber insertado previamente en la fila el número y distribución de columnas

 

ii.- Insertar módulo con el constructor visual: en caso de estar utilizando el constructor visual, haremos clic en el icono “+” para añadir un módulo.

 

insertar un módulo en una página con divi reutilizándolo

Insertar un módulo de Divi previamente guardado en la biblioteca

 

A continuación, en cualquiera de los dos casos anteriores haremos clic en el botón: “Añadir desde biblioteca” en la ventana emergente.

Se mostrarán los diferentes módulos que hayamos guardado en la biblioteca y haremos clic en el que queramos insertar.

 

 

2.2.- Insertar fila guardada en la biblioteca divi en una página

 

Para proceder a insertar una fila que previamente hayamos guardado en la biblioteca de divi realizaremos las siguientes acciones:

 

i.-  Insertar fila con el constructor tipo backend: en caso de usar el divi builder tipo backend haremos clic en el enlace “+ Añadir fila” que aparece en la parte inferior de cada sección.

 

ii.- Insertar fila con el constructor visual: en caso de estar utilizando el constructor visual, haremos clic en el icono “+” con círculo de color verde para añadir una nueva fila.

 

insertar fila guardada en la biblioteca con el divi builder

Insertar fila de divi guardada previamente en la biblioteca

 

En ambos casos, haremos clic en el botón “Añadir desde biblioteca” que aparece en la parte superior de la ventana emergente.

A continuación, se mostrarán las filas guardadas en la biblioteca. Haremos clic en la fila que queramos insertar.

 

Aprende a crear diferentes separadores entre secciones con el constructor Divi: divisores de secciones con Divi

 

 

2.3.- Insertar sección previamente guardada en la biblioteca Divi

 

Vamos a ver ahora como podemos incluir una sección del constructor Divi previamente guardada en la biblioteca en una página.

Para incluir una sección seguiremos el siguiente procedimiento:

i.- Insertar sección con el constructor tipo backend: para insertar una sección desde la biblioteca haz clic en el enlace “Añadir desde biblioteca” que aparece junto a los enlaces para añadir secciones.

 

ii.- Insertar sección con el constructor visual: si estás usando el constructor visual, haz clic en el icono “+” en círculo azul. A continuación, haz clic en la pestaña superior que te aparece en la ventana emergente con el texto: “Añadir desde biblioteca”.

 

insertar una sección guardada en la biblioteca de divi

Añadir una sección desde la biblioteca de Divi

 

En ambos casos ahora solo te quedará seleccionar la sección que quieras insertar. La podrás insertar en la página haciendo clic sobre ella.

 

Fuentes de texto de la plantilla Divi (biblioteca de fuentes): Divi fonts / fuentes divi

 

 

2.4.- Insertar una página completa guardada en la biblioteca de Divi

 

Vamos a ver ahora como insertar una página completa que haya sido previamente guardada en la biblioteca de Divi

 

i.- Insertar página con el constructor tipo backend: si estamos usando el constructor tipo backend haremos clic en el botón “Cargar diseño” que aparece en la parte superior del page builder.

 

ii.- Insertar página con el constructor visual: si estamos usando el page builder visual, haremos clic en primer lugar en el icono en forma de círculo con tres puntos que aparece en la parte inferior para desplegar las opciones.

A continuación, haremos clic en el icono en forma de círculo con un signo “+” en su interior.

 

Insertar diseño completo de una página con Divi en otra página

Insertar página completa crada con Divi

 

En ambos casos, en la ventana emergente haremos clic en la pestaña: “Your saved Layouts” (tus diseños guardados). A continuación, solo quedará hacer clic sobre el diseño de página que queramos incluir en la página actual.

 

 

3.- Marcar elementos como globales al guardar en la biblioteca

 

Cuando procedemos a guardar un módulo, fila, sección o página completa en la biblioteca Divi tenemos la opción de guardar el elemento como “global”.

 

Y ¿qué quiere decir que se guarda un elemento como global?

Lo que quiere decir, es que el elemento que incluiremos en una página procedente de la biblioteca no será una copia del mismo, sino que será el mismo elemento en sí.

 

Te lo explico más detenidamente:

i.- Si no marco la opción global: si NO marcamos la opción “global” cuando guardamos un elemento (módulo, fila, sección o página) en la biblioteca, al insertar dicho elemento en una página, lo que insertaremos será una copia del mismo. Es decir, si inserto el elemento en 5 páginas y modifico uno de ellos, no se modificará en los 4 restantes.

 

ii.- Si marco la opción global: si marcamos la opción “global” cuando guardamos un elemento en la biblioteca, al insertar ese elemento en una página, lo que insertamos es el elemento en sí y NO una copia. Es decir, si inserto el elemento en 5 páginas y modifico el elemento de una de ellas, se modificará de igual manera de manera automática en las 4 páginas restantes.

 

 

4.- Gestión de la biblioteca del Divi Builder

 

Para la gestión de los elementos añadidos a la biblioteca iremos a: “Divi > Biblioteca de Divi”.

Aquí nos aparecerán todos los elementos que hemos añadido a la biblioteca. En la columna “Tipo” nos indica que tipo de elemento es:

  • layout: página
  • Section: Sección
  • Row: fila
  • Module: módulo

 

Podemos editar cualquier elemento, haciendo clic en la opción “Editar” que se muestra al poner el ratón sobre el elemento en cuestión.

Al editar un elemento podremos modificarlo y volver a guardarlo.

 

gestión de diseños guardados en la biblioteca de divi

Editar diseños guardados en la biblioteca de divi

 

 

Compártelo ya!!

ACCEDE A TODOS MIS CURSOS POR SOLO 10€/MES

1.- CURSO WORDPRESS (44 Clases)
2.- CURSO DIVI (33 Clases)
3.- CURSO BLOOM + MAILCHIMP (7 Clases)
4.- CURSO SEO (19 Clases)
5.- CURSO BLOG WORDPRESS (32 Clases)
6.- CURSO WOOCOMMERCE (39 Clases)
7.- CURSO FLATSOME WORDPRESS (36 Clases)
8.- CURSO COLORES WEB (9 Clases)
9.- CURSO ANALYTICS (10 Clases)
10.- CURSO GESTIÓN IMÁGENES WEB (15 Clases)
11.- CURSO SEO PARA TIENDAS ONLINE (12 Clases)
12.- ETC. ETC.
*** ADEMÁS TIENES MI SOPORTE VÍA EMAIL***

IR A LOS CURSOS

Vé a tu buzón de correo y confirma la suscripción. Si no encuentras el correo de confirmación mira en la carpeta de SPAM.