Contrucción Pagina Inicio Web con DIVI  

Hola Fernando.

La imagen superior es un Banner que lo puedes crear con Divi

.- Editas la pagina y añades una nueva sección:

.- Edita la sección 

.- En la opción Fondo selecciona imagen y subes la imagen

.- Añade una fila de ancho completo:

.- Añade un modulo de texto:

.- Añade el texto que quieres mostrar

.- Añade una nueva fila para los botones

.- Añade un modulo boton:

.- Añade el texto del boton y el enlace

.- añade otro modulo para el segundo boton

.- Guarda y revisas, tendría que mostrase algo parecido a esto:

Revisa lo que te indico y luego vemos lo de las imagenes inferiores 

Nota: ten en cuenta que no vas a poder hacer exactamente lo mismo puedes intentar hacer algo similar.

Un saludo

@pepesoler

muchas gracias me pongo con ello y te voy diciendo, pero una pregunta, como te he comentado acabo de empezar con DIVI y por defecto ya vienen varias páginas creadas en el administrador de wordpress, ¿puedo empezar a hacer los cambios que me dices sobre la pagina de inicio que viene por defecto? o ¿es recomendable borrar las paginas que ya vienen creadas? 

Hola Fernado.

¿puedo empezar a hacer los cambios que me dices sobre la pagina de inicio que viene por defecto? o ¿es recomendable borrar las paginas que ya vienen creadas? 

Puedes empezar con una pagina que tienes ahora como inicio o empezar con uan pagina de cero incluso cargar alguna plantilla de las que tare por defecto.

Por ejemplo si quieres cambiar la plantilla que tiene la pagina de inicio:

.- Edita la pagina de inicio:

.- Pulsa en el icono " + "

.- Selecciona la plantilla que quieres utilizar, tienes algunas especiales para automóviles.

.- Pulsa en " Use this Layout "

Una vez cargada tendras la nueva plantilla.

Si quieres empezar una pagina desde cero con una plantilla, los pasos serian lso mismos.

.- Añades una nueva pagina

.- Selecciona " usar constructor divi "

.- Aquí tienes dos opciones o construir desde cero añadiendo los modulos que necesites o cargar una plantilla:

Tienes dos cursos de Divi en Webempresa University que podrías realizar para enter un poco como funciona este constructor:

-> https://www.webempresa.com/university/curso-divi-4-basico/

-> https://www.webempresa.com/university/curso-divi-4-avanzado/

Un saludo

@pepesoler

Hola Pepe,

tras unos días de en el que he estado trasteando un poco DIVI y también he realizado ya el curso básico, no soy capaz de darle altura que quiero al banner de inicio,

si te fijas queda muy corto, he creado una pagina de prueba inicio en la que estoy siguiendo tus pasos para hacer lo que me has indicado más arriba,

Hola Fernando.

En la pestaña Diseño despliegas Tamaño y en al opción Altura puedes configura el alto de esa imagen:

Un saludo

@pepesoler

Pepe, hago las modificaciones de tamaño con el constructor visual y me que algo así

pero luego guardo me voy a editar página, veo la vista previa y se ve así, encoge de tamaño....

he repetido el proceso varias veces y sale pequeño....

Hola Fernando, 

Puedes indicarnos cuál es la imagen de banner en el inicio que intentas añadirle la altura, actualmente no logro ver imagen en tu página principal, coméntanos si es la sección que te adjunto

Adicional a ello envíanos algunas capturas de las configuraciones que estás realizando de esta forma podemos ayudarte con mayor detalle

Un Saludo 

@karen

Hola,

sería la imagen del coche que se encuentra en la página Inicio prueba

Hola Fernando.

La pagina la tienes como borrador verdad ?

.- Publica la pagina y lo revisamos 😉 

Tienes que editar la sección que es donde tienes añadida la imagen como Background

Hay que mover la altura hasta adaptar el alto que quieras.

Una vez modificado tienes que pulsar en " Actualizar " paar guardar los cambios.

No crees que te resultara mas facil cargar una de las plantillas que trae por defecto Divi como te indique al principio y empezar a trabajar en la pagina con es plantilla ?

Si sigues como ahora tendras que ir añadiendo secciones luego y es mas facil ver alguna de las plantillas que se puedan acercar a lo que estas buscando, cargar la plantilla y realizar las modificaciones.

Un saludo

@pepesoler

Hola de nuevo,

ya la he publicado y he probado a hacer lo que me dices y funciona, lo que pasa es que cuando varío el tamaño de la imagen no lo puedo ver hasta que lo actualizo y le doy a vista previa, sin embargo en el constructor visual cuando vas modificando el tamaño vas viendo la imagen como cambia pero claro luego no se guardan los cambios...

entiendo que el constructor visual no sirve para cambiar de tamaño de imagen ¿correcto?

Sobre por qué estoy haciéndolo desde cero en vez de coger una plantilla de DIVI, es que no veo ninguna que se ajuste a lo que busco, lo digo más que nada por el menú de productos de coches que señalo con el número 3,

yo quiero en la página de inicio algo como lo de esta imagen, justo debajo de la foto grande quiero un menú horizontal o también podría ser vertical, pero lo que si quiero es que sea con fotos de diferentes artículo, y cuando haga click sobre una de ellas me dirija a su correspondiente página, es un poco la idea....

en resumen, crear este menú inferior es lo que veo ahora mismo más complicado de crear, 

si tú ves que hay opciones más fáciles de hacerlo, me dices y lo hago sin pensarlo, yo me dejo aconsejar 🙂

de todos modos estoy empezando y aprendiendo día a día, ya he hecho el curso básico y ya estoy con el avanzado, espero que cuando lo termine me sirva para superar también este tipo de dificultades y otras, pero vi necesario ir practicando a medida que hago el curso

Hola Fernando,

Lo que pasa con el constructor es que a veces ocupa espacio en barras laterales que son las de edición y esto hace que la web se achique por así decirle y las proporciones cambian un poco, sin embargo la mejor forma de visualizar los cambios siempre es actualizado la web en otra pestana para poder ir viéndolo en vivo, claro la herramienta de construcción es una ayuda pero lo mejor es actualizar y ver.

Con respecto a como crear este tipo de menú te comparto un video para explicártelo mejor:

Verifica si de esta forma te funciona y nos comentas.

Un saludo 🖐️