Preselecciones de Divi: La función que mejora su productividad

Actualizado el 12/07/2021 | Publicado el 23/10/2020 | 8 comentarios

Divi Presets es una característica disponible en el Divi Builder. No muchos usuarios lo conocen, pero puede mejorar su productividad al crear sus sitios. ¿Lo conoces? ¿Lo utilizas?

Lo explico todo en este artículo tutorial y también en vídeo 🎥!

Anuncio: este artículo contiene enlaces de afiliación que reconocerá fácilmente. Los enlaces clásicos están en púrpura y los enlaces patrocinados están en rosa.

1 - Divi Presets, ¿qué es 👀 ?

Si eres diseñador gráfico o web y utilizas PhotoShop, Sketch o Affinity Designer, probablemente conozcas formas de mejorar tu productividad, especialmente con la funcionalidad de los elementos sincronizados. Esto permite, por ejemplo, crear un diseño gráfico con un estilo que se puede modificar en 1 clic y que repercute en todos los elementos a los que se ha asignado el estilo.

El constructor visual Divi también ofrece esta característica, llamada Divi Presets. Esta es una "función oculta" porque no es visible a primera vista... Hay que saber qué es y qué hace.

Así que para responder a la pregunta: Divi Presets le permite guardar el estilo de un módulo como un estilo preestablecido para su uso posterior. Esto le permite ahorrar un tiempo precioso a la hora de diseñar su maqueta. Si hay que cambiar el estilo, basta con editarlo y el cambio se aplicará a todo el sitio.

Descubra las explicaciones detalladas en el artículo oficial de ElegantThemes

2 - Ejemplo de uso en los módulos de "resumen"

Para entender mejor cómo funcionan los presets de Divi, tomemos el ejemplo de un módulo de resumen.

Appliquer les styles
Aplicar los estilos a otros módulos del mismo tipo.

Como puede ver en la imagen superior, el objetivo es aplicar los estilos del primer módulo de resumen, a la izquierda, a los otros 3 módulos de resumen, a la derecha. Para este ejemplo, se trata simplemente de añadir una sombra y esquinas redondeadas.

Esto es lo que tienes que hacer:

Enregistrer un style en tant que Divi Preset
Guardar un estilo como preset de Divi
  1. Edite el módulo de resumen que contiene los estilos a guardar. Haga clic en el icono de la rueda dentada de este módulo. En la parte superior verás "Preset: Default". Haga clic en él para abrir una ventana emergente.
  2. Haga clic en "Crear un nuevo preajuste a partir de los estilos actuales". Esto significa que creará un nuevopreajuste a partir de los estilos actuales.
  3. Dale un nombre a tu estilo para que puedas recordarlo la próxima vez que lo uses.
  4. Guarde sus acciones hasta que se cierren todas las ventanas emergentes (3 veces).
Enregistrer un style en tant que Divi Preset
Aplicar un preset de Divi a un módulo similar

Así podrás llamar a este preajuste siempre que lo necesites:

  1. Abrir la configuración del módulo a modificar (icono del engranaje)
  2. Haga clic en "Preset: Default".
  3. Seleccione el estilo a aplicar, para mi ejemplo es blurb-style-1.
  4. Confirme los cambios.
  5. En 3 clics, los otros módulos de resumen han recuperado los estilos definidos en el preset Divi en cuestión.
Les styles ont été appliqués
Se han aplicado los estilos predefinidos

3 - Preselecciones de Divi disponibles en todos los módulos ✅.

Te he mostrado un ejemplo con el módulo Resumen pero, en realidad, los Presets de Divi están disponibles para cualquier módulo.

Tomemos otro ejemplo con el módulo de botonesel enfoque es el mismo:

Divi Preset fonctionne aussi sur les boutons
Guardar los estilos de un módulo de botones
  1. Edite el módulo Button que contiene los estilos a guardar. Haga clic en el icono de la rueda dentada y, a continuación, en "Preset : Default".
  2. Haga clic en "Crear un nuevo preajuste a partir de los estilos actuales" para crear un nuevo preajuste.
  3. Dale un nombre a tu estilo para que puedas recordarlo la próxima vez que lo uses.
  4. Guarde los cambios.
appliquer le style aux boutons
Cambiar el estilo de un botón en 1 clic
  1. Abra la configuración del módulo de botones que va a modificar (icono de rueda dentada) y haga clic en "Preset: Default".
  2. Seleccione el estilo a aplicar, para mi ejemplo es botón-estilo-naranja.
  3. Confirme los cambios.

Ya está, su nuevo botón ha sido estilizado en 1 clic y corresponde exactamente a su carta gráfica. Te has ahorrado muchos minutos de configuración.

Modifier un Divi Preset
Los presets de Divi se pueden modificar
  1. Edite la configuración del módulo de botones y haga clic en "Preset".
  2. Seleccione el preajuste que desea modificar haciendo clic en el icono del lápiz.
  3. Haga los cambios necesarios, por ejemplo: cambie el color del botón.
  4. Guarde los cambios.

Ahora todos los botones de su sitio que utilizaron este Divi Preset acaban de ser modificados. Para eso está esta función... No sólo aplicas un estilo rápidamente, sino que puedes aplicar los cambios a todo el sitio y ahorrar mucho tiempo.

👉 Nota: hay muchas formas de mejorar tu productividad con Divi. Por ejemplo, descubra cómo importar/exportar un diseño Divi o cómo importar/exportar una plantilla desde el Theme Builder.

4 - No confundir "Divi Presets" y "Extend Styles

Puede que te preguntes, con razón, si esta función de Divi Presets es redundante con la función "Extend Styles".

De hecho, estas dos características son similares, pero hay algunas sutilezas que las diferencian:

Divi Presets vs. Étendre les style
Divi Presets vs. Extend Styles
  1. Al pasar el ratón por encima de un módulo, aparecen opciones: haga clic en "Otros parámetros del módulo" (icono con 3 puntos pequeños).
  2. Haga clic en Extender Estilos
  3. Elija hasta dónde quiere extender estas personalizaciones: a través de la página, a través de la sección, a través de la fila o a través de la columna.
  4. Confirme su elección haciendo clic en Ampliar.
  5. Este es el resultado: todos los módulos de resumen han recuperado todos los estilos del módulo inicial, incluido el color.
  6. Al usar los Presets de Divi, sólo se copiaron los estilos generales.

Pero sobre todo, lo que hay que recordar aquí es que es imposible extender los estilos a todo el sitio con la función "Extender estilos". Además, no podrá utilizarlos en una nueva página y no podrá realizar modificaciones en modo "sincronizado".

¿Sabías que puedes probar Divi gratis? Ir a esta página y haz clic en "PRUEBA GRATUITA

5 - No confundir con la función "Elemento global".

Lo mismo ocurre con la función de elemento global. Puede parecer una característica de Divi Presets porque cambiar un elemento global también afecta a todo el sitio.

Un elemento global es un módulo, línea o sección que se ha guardado en la biblioteca de Divi y que se puede utilizar siempre que se necesite. Sin embargo, si registra un botón como elemento global y cambia el enlace (URL) del botón, ese enlace también se cambiará en todas las páginas del sitio que utilicen ese botón global. Puede que esto no sea lo que quieres. En este caso, los Presets de Divi son imprescindibles.

Para entender mejor esto funcionalidad del elemento global, lea este tutorial detallado.

6 - Videotutorial de presets de Divi 🎬

Para una explicación más vívida de esta característica de Divi Presets, vea el resumen de este artículo en este video explicativo:

O vea la presentación de Nich Roach:

7 - Algunos recursos adicionales 🤩

¿Qué opina de esta característica? Me gustaría saber (en los comentarios) si lo usas y si encuentras que realmente te ahorra tiempo.

Mientras tanto, aquí hay algunos recursos adicionales:

Para saber más sobre cómo utilizar los presets de Divi, vea este vídeo que le muestra cómo se pueden utilizar estos presets para sus textos y fuentes :

Divi Preset Productivite
Divi Presets Gain De Temps
Divi Presets to be more productive

1.237 palabras

5

A ti también te debería gustar:

Formation Divi PDF : un guide pas à pas

Formación en Divi PDF: una guía paso a paso

¿Qué podría ser mejor que un entrenamiento de Divi PDF para dominar este tema de WordPress, su Constructor Visual y su Constructor de Temas? Es como tener un entrenador en tu casa... ¡Compruébalo!

8 Commentaires

  1. Nathalie Sophie

    Merci beaucoup et 👏🏻 pour la vidéo, c’est encore mieux pour la compréhension 🙂
    Je vais très certainement m’en servir car c’est bien pratique !
    Bonne soirée

  2. Lycia Diaz

    Merci Nathalie 😉

  3. Vero Rakotoarisoa

    Elle est top ta vidéo ! ✨ Bravo et merci pour toutes ces astuces que tu partages. J’avais bidouillé dans cette fonction, mais je n’avais pas tout saisi. Maintenant c’est sûr que je vais m’en servir ! 😃

  4. Lycia Diaz

    Merci Vero ! À bientôt 😜

  5. trottinette electrique

    Un bon article + une bonne vidéo pour nous expliquer le sujet, que demander de plus ? Merci, c’est top, clair et précis 🙂

  6. Lycia Diaz

    Merci « Trotti » 😉

  7. romain

    Bonjour,

    Quelqu’un rencontre-t-il ce problème? J’utilise des couleurs globales dans mes presets de modules. Jusque là tout va bien sauf que, les modules avec preset intégré à une page perdent leur couleur à l’ouverture cette page ou à son affichage de façon aléatoire. Je suis obligé d’aller sur le module et de faire « re-initialiser module style » pour qu’il reprenne sa couleur.
    Et même en repassant les couleurs globales en normales, ça le refait.

    Merci

  8. Lycia Diaz

    Ah c’est bizarre

Soumettre un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Je souhaite recevoir les news du blog Astuces Divi !

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.

Pínchalo en Pinterest

Acciones
Comparte esto