Divi Tips n°104

Preselecciones Divi : La función que mejora su productividad

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

1.237 palabras

5

Divi Presets es una característica disponible en el Divi Builder. Pocos 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 🎥!

Aviso: 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 de páginas web y utilizas PhotoShop, Sketch o Affinity Designer, puede que conozcas formas de mejorar tu productividad, especialmente con la funcionalidad de los elementos sincronizados. Esto permite, por ejemplo, crear un diseño con un estilo que se puede modificar en 1 clic y que afecta a todos los elementos a los que se ha asignado el estilo.

El constructor visual Divi también ofrece esta característica, llamada Divi Presets. Se trata de 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 futuro. Esto le ahorra un tiempo valioso a la hora de diseñar los diseños. 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, vamos a tomar el ejemplo en un módulo de resumen.

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

Como puede ver en la imagen anterior, el objetivo es aplicar los estilos del primer módulo de resumen de la izquierda a los otros 3 módulos de resumen de 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 de rueda dentada)
  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 Preset Divi han sido cambiados. 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 de los 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. Mientras que al utilizar los Presets de Divi, sólo se copiaron los estilos generales.

Pero sobre todo, lo que es importante recordar aquí es que es imposible extender los estilos a todo el sitio con la funcionalidad "Extender estilos". Además, no puede utilizarlos en una nueva página y no puede realizar cambios en modo "sincronizado".

¿Sabías que puedes probar Divi gratis? Ir a esta página y haga 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 que es similar a los Presets de Divi porque el cambio de 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 esenciales.

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é te parece esta función? 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
obtenir divi bouton
quizz divi bouton
newsletter bouton
formation divi bouton
guide divi pdf bouton
bouton support divi

Puede que a ti también te guste:

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 *

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