Compártelo ya!!
Opt In Image
APÚNTATE Y DESCARGA GRATIS
1.- Guía para crear una Página web Profesional
2.- Vídeo Training, Mis Plugins Imprescindibles WordPress
3.- Taller SEO para WordPress
  • Recibe todos los domingos las últimas entradas del blog y contenidos exclusivos

Te puedes dar de baja en cualquier momento. Nada de Spam

 

Todos los usuarios de Divi nos congratulamos por la nueva funcionalidad que ya incluye la plantilla Divi. Esta nueva funcionalidad permite poder buscar entre cientos de demos o diseños profesionales, predefinidos y gratuitos y poder utilizarlos en nuestras páginas de WordPress.

Es decir, en el constructor de la plantilla Divi vamos a disponer de una biblioteca de Layouts o diseños profesionales y gratuitos que podremos ir utilizando en la realización de nuestra página web, o nuestros proyectos profesionales. Pudiendo utilizar estos diseños en las diferentes páginas de nuestros wordpress.

Una vez incorporado a nuestra web un diseño predefinido de Divi podremos modificarlo y adaptarlo a nuestras necesidades. Pero partiremos de un diseño profesional y de calidad.

DESCUENTOS DIVI

 

Este repositorio de demos, diseños, layouts o plantillas para Divi lo ha ido generando de manera gratuita la empresa Elegant Themes, que es la empresa responsable de la plantilla Divi. Además, Elegant themes se compromete a ir aumentando este maravilloso repositorio de diseños para Divi.

Hasta ahora era necesario descargar los diseños e importarlos desde wordpress. Pero ahora será posible visualizar e importar cualquier diseño desde nuestro panel de administración de wordpress.

Nota: en este post vamos a llamar a esas demos o diseños preestablecidos que podremos utilizar en nuestras páginas de wordpress como diseños, layouts o plantillas. Ten en cuenta que a Divi le deberíamos llamar tema o theme y nunca plantilla. Lo que pasa es que la mayoría de gente, entre los cuales me incluyo, llamamos a Divi Plantilla, pero no deberíamos hacerlo, ya que realmente es un tema o theme y no una plantilla.

 

 

 

1.- Donde podemos visualizar los diseños o demos de páginas predefinidos para wordpress con Divi

 

Podremos visualizar el repositorio de diseños predefinidos gratuitos para Divi de Elegant themes desde el page builder tipo backend y desde su versión visual o frontend.

 

 

1.1.- Acceso a diseños desde el Divi Builder tipo Backend

 

Para acceder a las demos o diseños del repositorio de Divi empezaremos creando una nueva página: “Páginas > Añadir nueva”.

Ahora pondremos nombre a la página y haremos clic en el botón: “Usar el constructor Divi”.

En el constructor tipo backend haremos clic en “Cargar Diseño”.

 

ver diseños o demos de páginas de la plantilla Divi

Cargar diseños de páginas para Divi desde el divi builder tipo backend

 

Te aparecerán 2 pestañas:

a.- Premade Layouts (demos o diseños predefinidos): aquí se mostrarán todos los diseños predefinidos (demos) que podremos cargar en la página. Para poder gestionar mejor los diseños, mi recomendación es que hagas clic en F11 (Windows) para poder ver el contenido a tamaño completo.

Cuando vuelvas a hacer clic en F11 volverás al estado normal.

 

b.- Your saved Layouts (tus diseños guardados): en esta pestaña se mostrarán los diseños que tú vayas guardando en la biblioteca de Divi.


 

1.2.- Acceso a los diseños de página desde el Divi Builder tipo Visual

 

Para acceder a los diseños o demos del repositorio de Divi empezaremos creando una nueva página: “Páginas > Añadir nueva”.

Ahora pondremos nombre a la página y haremos clic en el botón: “Usar el constructor Divi”.

Ahora haremos clic en el botón: “Usar constructor Visual”.

Una vez se haya abierto el constructor visual, haz clic en el icono circular con tres puntos en su interior para desplegar las opciones de configuración de la página.

A continuación, haz clic en el icono “+” y se desplegará la biblioteca con los diseños predefinidos (premade Layouts) en una pestaña y en la otra los diseños que vayamos guardando nosotros (your saved Layouts)

 

cargar demos o diseños desde el divi builder tipo visual

Ver demos o diseños de páginas para Divi desde el constructor visual

 

Para poder gestionar mejor los diseños, mi recomendación es que hagas clic en F11 (Windows) para poder ver el contenido a tamaño completo.

 

 

2.- Paquetes o packs de demos o diseños gratuitos de páginas para Divi

 

Una vez se abra la herramienta de diseños o plantillas de Divi podrás ver todos los diseños que podemos utilizar en nuestro wordpress.

Debes tener en cuenta que los diferentes diseños de Divi vienen agrupados en diferentes paquetes o packs.

Una paquete o pack estará formado por varios diseños o plantillas (layouts) para páginas wordpress. Cada diseño o layout se ha pensado para un tipo de página específica de la web. Aunque tu puedes utilizar cada diseño en la página que quieras.

 

Por ejemplo, el paquete “Restaurant” (restaurante) está formado por 8 diseños, demos o layouts:

  • 1.- About: este diseño o layout es para la página de nosotros o quienes somos
  • 2.- Blog: este diseño seria para la página blog
  • 3.- Contact: este diseño de el pack Restaurant sería para la página de contacto
  • 4.- Gallery: este diseño sería para una galería de imágenes
  • 5.- Home: este diseño sería para la página de inicio
  • 6.- Landing: este diseño de página sería para una landing page
  • 7.- Shop: este diseño sería para mostrar productos de la tienda woocommerce
  • 8.- Team: este diseño de página sería para la de equipo

 

pack de demos o diseños para divi

Ejemplo de pack de diseños o demos para Divi. El paquete “Restaurante” cuenta con 8 diseños diferentes

 

Aprende a exportar e importar tus propios diseños con la plantilla Divi: Exportar e importar diseños Divi

 

 

3.- Cómo cargar un diseño o plantilla gratis de Divi en una página

 

Nada más acceder a la herramienta de importación de diseños preestablecidos nos aparecerán los diseños clasificados en paquetes o packs de plantillas o layouts para páginas wordpress.

En la parte superior se indicará el número de pack o paquetes de diseños y entre paréntesis el número de diseños o layouts totales.

 

packs y demos disponibles en el repositorio de Elegant Themes

Número de packs y diseñso disponibles en el repositorio de Elegant Themes

 

Si hacemos clic en un paquete o pack de diseños o demos se mostrarán todas las plantillas que conforman ese paquete o pack.

Desde ahí podremos seleccionar el diseño que queremos visualizar y podremos ver una demo haciendo clic en el botón: “View Live Demo”.

Una vez tengamos localizada la plantilla o diseño que queremos utilizar en la página wordpress que estamos creando, haremos clic en el botón: “Use this Layout” (usar este diseño).

 

cargar diseño de página en la página que estamos creando

Cargar diseño en la página que estamos creando

 

Aprende a manejar los bordes de elementos con Divi: gestión de bordes con Divi

 

 

4.- Modos de visualización de los diseños (layouts) para páginas con Divi

 

Aunque al abrir la herramienta de selección de plantillas o diseños gratuitos del repositorio de Elegant Themes, se muestran los diferentes packs de diseños, podremos mostrar los elementos de diferentes maneras.

Para ello tenemos 3 iconos en la parte superior derecha (View mode):

 

opciones de visualización de los diferentes diseños

Modo de visualización de los diferentes diseños o demos de páginas

 

  • i.- icono archivo: esta es la opción que viene marcada por defecto y mostrará los packs de diseños o plantillas para Divi.
  • ii.- icono rejilla: este icono mostrará los diseños de página directamente y no los packs. Los diseños se mostrarán en modo rejilla o retícula.
  • iii.- Icono lista: si hacemos clic en este icono se mostrará un listado con todos los diseños de páginas (no los packs) en modo lista. Se mostrarán datos como la fecha de publicación de diseño y la categoría a la que pertenece.

 

Aprende a utilizar el Divi Builder, el constructor de la plantilla Divi: Divi Builder

 

 

5.- Herramienta para buscar paquetes y diseños de páginas (layouts) con Divi

 

En la pantalla para cargar diseños de página para wordpress con Divi verás que hay una barra en el lateral izquierdo con dos elementos:

 

i.- Buscador por palabras de diseños o plantillas: aquí podremos buscar diseños por palabras. El buscador dispone de tecnología Ajax y nos irá mostrando posibles resultados conforme vayamos escribiendo en la barra de búsqueda.

Por ejemplo, si escribimos “contact” o “contacto” se nos mostrarán todos los diseños del repositorio que incluyan la palabra contacto o contact. Es decir, se mostrarán todos los diseños o demos que pueden servir para páginas de contacto.

 

buscar diseños o demos por palabras

Herramienta para buscar plantillas o diseñso de página por palabras

 

ii.- Filtro por tipo de diseño o plantilla: Las plantillas, diseños de página y packs para Divi vienen clasificados en diferentes categorías, según la el tipo de web al que al que van destinados. Aunque puedes usar cualquier diseño para cualquier tipo de web.

Puedes filtrar packs o paquetes de diseños, demos o plantillas individuales. Para ello tienes que seleccionar primero el icono del lateral derecho (apartado 4)

Las categorías son las siguientes:

i.- Art & Design: Webs enfocadas al mundo de la cultura, el arte y el diseño

ii.- Business: Webs de negocios y empresas

iii.- Community & Non-Profit: Asociaciones sin ánimo de lucro.

iv.- Education: mundo de la educación

v.- Events: Webs de eventos

vi.- Fashion & Beauty: moda y belleza

vii.- Food & Drink: Restaruación y Bares

viii.- Health & Fitness: Gimnasio, deporte y salud

ix.- Online store: tienda online o ecommerce

x.- Services: Servicios profesionales, autónomos y empresas.

xi.- Simple: web limpia y sencilla

xii.- Tecnology: web relacionada con la tecnología

Aprende a crear una tienda online con Woocommerce y Divi: tienda online Divi

 

Si hacemos clic en cualquiera de los filtros solo se mostrarán los diseños o paquetes de diseños que pertenezcan a esa categoría. Es posible marcar más de una categoría.

 

categorías plantillas para Divi

Categorías clasificación diferentes diseños o demos para Divi

 

 

Bloguer especializado en WordPress, Woocommerce, Divi y Prestashop. Apasionado por la formación y el diseño web. Me gustaría que este blog te sirviera para ayudarte en el desarrollo de tu proyecto online, ya sea un blog, una web corporativa, cursos online o cualquier otro proyecto.
Mi otro blog, especializado en tiendas online: tiendaonlinemurcia.es

Compártelo ya!!

Uso de cookies

Utilizamos cookies propias y de terceros para mejorar nuestros servicios y su experiencia de navegación. Si continua navegando, consideramos que acepta su uso. Puede cambiar la configuración u obtener más información AQUÍplugin cookies

ACEPTAR
Aviso de cookies