Con il modulo Divi Slider il template Divi Elegant Themes de WordPress podemos incluir en nuestra web un slider con fotografía y texto principal para enlazarlo a un artículo de nuestra web. Vamos a ver cómo podemos modificar la altura del slider para que se ajuste al diseño de nuestra web sin necesidad de tocar nada de hojas de estilo. Todos los cambios que vamos a implementar se realizarán directamente sobre la configuración del módulo en el Divi contructor che faciliterà il lavoro di web design. No será necesario tocar la hoja de estilos de Divi, ya que añadiremos nuestras personalizaciones desde el constructor de nuestro Divi Slider CSS.

Slider Divi: Antes y despues de modificar la altura

Este es un ejemplo de un slider antes y después de realizar las modificaciones para que veáis lo que se quiere conseguir con este tutorial.

Divi Slider 00 1024x210 Modificar altura del slider Divi

Prima e dopo il ridimensionamento il cursore al Divi

Questo era il disegno originale. Con un'altezza di 468px. Il cambiamento che andremo a fare è di renderlo più sottile, 300px.

Divi Slider 01 1024x481 Modificar altura del slider Divi

Slider risultato finale Divi

Para ello habrá que realizar los siguientes ajustes de altura,relleno e ancho de la descripción de cada slide.

Divi Slider 02 1024x481 Modificar altura del slider Divi

cursore parametri

impostazioni Divi Sezione

in builder divi tenemos una sección principal en morado, y el módulo de Divi Slider en gris con ancho completo de la página. El ancho completo lo conseguimos obligando a que el margen y el espacio (margin y padding) sean cero. Si lo dejamos en blanco Divi dejará un hueco entre los elementos. En este caso, entre el borde de la página y nuestro slider.

Divi Slider 03 1024x194 Modificar altura del slider Divi

Modulo spessore pieno Slider Divi

Una vez dentro de nuestro Divi Slider, dentro de la configuración de la sección, en ajustes de estilos de CSS personalizzato, indicamos que la altura del elemento principal sea 300px.

Divi Slider 04 Modificar altura del slider Divi

CSS personalizzato Slider

Impostazioni modulo slider divi

Dentro del módulo de Divi slider, en impostazioni avanzate di progettazione, Abbiamo istituito un padding superiore 40px.

Divi Slider 05 Modificar altura del slider Divi

Impostazioni avanzate di design Divi Slider

Divi Slider CSS

Poi impostazioni di stile CSS personalizzato, vamos a ajustar las CSS sin tener que escribir en la hoja de estilos. Para ello indicamos que la altura sea 300px para el elemento principale.

Divi Slider 06 Modificar altura del slider Divi

Divi Slider CSS

Facciamo lo stesso per il Descrizione diapositive e Titolo diapositive.

Divi Slider 07 Modificar altura del slider Divi

Misura saracinesca scorrevole Divi

Nella scheda impostazioni generali, Configurare ciascuna delle slitte. Idealmente si avrebbe solo una diapositiva, configurarlo, e poi clonarlo con tutte le impostazioni di configurazione.

Divi Slider 08 Modificar altura del slider Divi

diapositive Divi Slider

All'interno di ogni diapositiva, andremo alle impostazioni CSS personalizzato e mettere un'altezza di 300px a:

  • elemento principale
  • Titolo diapositive
  • Descrizione contenitore scorrevole
  • Descrizione diapositive
  • slide image
Divi Slider 09 Modificar altura del slider Divi

Far scorrere Impostazioni Slider Divi

Conclusiones

Con queste modifiche, abbiamo fondato la nostra cursore per il miglior design della nostra web in forma senza l'aggiunta di stili personalizzati al nostro Tema Divi Bambino.

Recordaros, que este tutorial solo lo podéis seguir si disponéis de la plantilla Divi de Elegant Themes, y que en la mayoría de las ocasiones, si os suscribís en su web obtendréis un cupón descuento de entre 10% y 20% según la licencia que compréis.

RGuardar

salvare

Si te ha parecido interesante este artículo y crees que Divi puede ayudarte con tu proyecto Web y estás pensando en comprarlo, te pido que lo hagas pinchando en la siguiente imagen. Estoy afiliado a ElegantThemes y me llevaría una pequeña comisión si llegas a comprarlo. De esta manera me ayudas a mantener el blog y a escribir más artículos como este.

Si además, te haces suscriptor de ElegantThemes, podrás comprarlo con hasta un 20% en algunos casos.

AfiliadosDivi Modificar altura del slider Divi

salvare

Dime qué te ha parecido el artículo...

rating on Modificar altura del slider Divirating on Modificar altura del slider Divirating on Modificar altura del slider Divirating on Modificar altura del slider Divirating on Modificar altura del slider Divi (1 votos, promedio: 5,00 de 5)
loading Modificar altura del slider DiviCargando…
Pubblicità

Utilizzo dei cookie

Questo sito utilizza i cookies per voi di avere la migliore esperienza utente. Se si continua a navigare state dando il vostro consenso all'accettazione dei biscotti e accettazione della nostra sopra Politica biscotti, Fare clic sul link per maggiori informazioni.

Bene
Avviso di biscotti

Veo que te gusta mi Blog...

Si te ha parecido interesante este artículo, no esperes a suscribirte a mi blog. Cuando vuelva a escribir otro seguro que te interesará y no desearás no haberte enterado. Puedes suscribirte con total tranquilidad de que no recibirás spam. Lo odio igual que tu. Solo quiero que aprendas cosas nuevas y te sientas agusto con mis artículos. ¡Gracias!

Grazie per la sottoscrizione!

Pin It on Pinterest

Condividi questo

Quota

Condividi questo articolo con i tuoi amici!