REGALO ACERCA DE SERVICIOS 3 BLOG 3 CÓMO HACER UN BLOG 3 RECURSOS CONTACTO U

[MEGA] GUÍA EN CASTELLANO SOBRE DIVI.

OBTÉN DISEÑOS ELEGANTES SIN TENER
PROGRAMAR
por Pedro Suárez | 26 Comentarios

   

Antes de comenzar con la guía en castellano sobre Divi permíteme evaluar tu situación:

1 ¿Quieres diseñar tu blog por ti mismo pero no tienes ni idea

que tema WordPress elegir?

2 ¿Estás cansado de lidiar con plantillas difíciles de manejar, que requieren

mucho tiempo y además no te permiten realizar gran parte de lo que andabas
buscando?

3 ¿Te desesperas ante la excesiva cantidad de información que encuentras en

internet?

Si estás en alguno de estos casos no te preocupes puesto que yo también pasé por esa dura etapa.

La buena noticia es que afortunadamente existe grandes productos si se sabemos dónde elegir.

Para facilitarte esta tarea hoy te traigo una guía muy completa sobre una plantilla para WordPress
que me ha dado muchas satisfacciones: Divi, el tema framework de Elegant Themes.

Hoy quiero compartir mis conocimientos contigo, hacer un repaso de sus características principales
así como de sus carencias.

Antes de comenzar con la guía quiero recordarte que si quieres aprender más sobre otras
herramientas y recursos interesantes relacionados con el diseño te recomiendo:
Los 6 errores en el diseño web que arruinarán tu proyecto digital y todas las claves para
evitarlos

Tabla de contenidos [ocultar]

1 Guía en castellano sobre Divi

2 ¿Qué puede diseñar con Divi?
2.1 Timeline Missions
2.2 Dan Carr Photography
2.3 The Global Church Project
2.4 Findability Sciences

3 ¿Qué va a ofrecerte Divi?

3.1 Instalación de Divi
3.2 Creación tema hijo
3.3 Sinergia Divi + Divi Builder
3.4 Configuración de la cabecera
3.5 Accede rápido a WordPress
3.6 Modos de edición de Divi Builder
3.7 Disposición de layouts
3.8 Integración de 46 módulos listos para su instalación
3.9 Configuraciones y ajustes de todo tipo
3.10 Guarda tus diseños en la Biblioteca de Divi
3.11 Elementos globales
3.12 Plantillas prediseñadas
3.13 Exportación / importación de diseños y configuraciones
3.14 Corrige errores fácilmente
3.15 Búsqueda
3.16 A/B Testing con Divi Leads
3.17 Diseño Responsive
3.18 Seguridad con Divi
3.19 Actualizaciones
4 Precio
4.1 Yearly Access
4.2 Lifetime Access
5 Cómo crear una home page con Divi en unos minutos
6 ¿Es todo es tan bonito como lo pintan?
7 Regalo
8 Descuento - Planes de Elegant Themes
9 Conclusión

Guía en castellano sobre Divi

Divi es un tema desarrollado por la empresa norteamericana Elegant Themes que te va a permitir
diseñar una gran variedad de sitios web partiendo de un mismo producto.

Tanto Divi y como su constructor Divi Builder te ofrecen:

Diseñar rápidamente: su uso es sencillo y gracias a acciones como duplicar, importar y

cargar elementos tu proceso de diseño se va a ver acelerado.
 Código: apenas necesitas implementar código. Si sabes de lenguajes tipo CSS pues
mejor. Personalizarás tus webs a tope dándoles un aspecto mucho más profesional y
diferente.

Resultados: los diseños obtenidos son minimalistas, elegantes y profesionales.

¿Qué puede diseñar con Divi?

Divi es un tema multipropósito lo que significa que con él podrás crear webs de temáticas muy
distintas como por ejemplo: restaurantes, blogs, portfolios de fotografía, pequeños negocios e
incluso tiendas online gracias a su integración con el plugin WooCommerce.

Como ejemplo te muestro a continuación una serie de sitios webs basados en Divi y Divi Builder:

Timeline Missions Dan Carr Photography

timelinemissions.com dancarrphotography.com

The Global Church Project Findability Sciences

 theglobalchurchproject.com sitio web: findabilitysciences.com

¿Qué va a ofrecerte Divi?

Ponerme a relatar todas y cada una de las características de Divi y Divi Builder nos llevaría un curso
completo y no es esa mi intención.

Por eso en este artículo te mostraré las que para mi son las principales características que hacen de
Divi un tema muy sencillo de usar, potente y elegante.

De todas maneras si quieres ampliar conocimientos te aconsejo que te pases por el blog de mi
amigo Omar de la Fuente en el cual publiqué una guía sobre Divi Builder que te servirá como
complemento.

Veamos algunas de sus características:

Instalación de Divi
La instalación de Divi es super sencilla y te llevará sólo un par de segundos:

1 Descárgalo a través de tu cuenta de Elegant Themes.

2 Accede a tu WordPress y selecciona “Apariencia > Tema” y presiona “Añadir uno

nuevo”.

3 Selecciona Divi, instálalo y actívalo. Ya tienes tu tema Divi listo para ser usado.

Creación tema hijo

Una de las posibilidades que te ofrece Divi como framework es la de crear un tema hijo para
personalizar tu sitio web de la manera que quieras sin afectar negativamente el funcionamiento de tu
sitio web.

El proceso de instalación es igual de sencillo:

1 En el respositorio de WordPress busca el plugin llamado Child Theme Configurator,

instálalo y actívalo.

2 Ve a “Herramientas > Child Theme” y presiona el botón “Analyze”.

3 Haz clic en “Create New Child Theme” y tu tema hijo será instalado.

4 Para activarlo nos dirigimos “Apariencia > Tema”, seleccionamos el tema hijo y lo
activamos. Hecho.

Tras la instalación tendrás dos archivos: functions.php y styles.css.

Son esos dos archivos los que te permitirán personalizar tu sitio web tanto como quieras.

Con el primero podrás añadir funciones en PHP y con el segundo estilos en CSS para cambiar la
apariencia de tu web.

En el siguiente vídeo te muestro paso a paso cómo instalar tu tema Divi y tu tema hijo:
Sinergia Divi + Divi Builder
Muchas veces se habla de Divi sin mencionar a parte a Divi Builder y es que estamos hablando dos
productos totalmente diferentes:

Divi es un tema framework.

Divi Builder es un plugin para diseñar el contenido de tu web.

Con Divi editarás y personalizarás los aspectos generales de tu web como el logotipo, tu cabecera,
pié de página, el tipo de fuente así como su color y tamaño.

Mientras que con Divi Builder nos centraremos en forjar y diseñar el grueso de tu web con sus
módulos y opciones de diseño.

La principal ventaja es que ambos productos han sido diseñados para que se
complementen a la perfección de forma que se potencien mútuamente logrando
resultados realmente soprendentes.
Además ambos vienen paquetizados en los planes de contratación, es decir, disfrutarás de ellos sin
tener que gastar un céntimo más.

Con guración de la cabecera

Uno de los aspectos que más me gusta de Divi es la facilidad para configurar la
cabecera mediante el personalizador de temas pudiendo así cambiar la ubicación del logotipo, la
disposición de los menús y sus estilos.

Con Divi podrás modificar sus elementos de la siguiente forma:

Por defecto: tu logo a la izquierda y el menú a la derecha.

Centrado o centrado en línea: si quieres tu logotipo centrado ésta es sin duda tu opción.

Deslizar: tu menú se muestra oculto en el lado derecho de la pantalla.

Pantalla completa: tu menú se mostrará en pantalla completa haciendo clic en el

icono ☰.

Guía en castellano sobre Divi: Estilos de la cabecera

Además el tema te deja aplicar estilos específicos sobre el menú principal y el secundario que
conforman la cabecera:

Guía en castellano sobre Divi: Menu Primario y secundario

Por último Divi te da la opción de mostrar tus iconos sociales así como un botón de búsqueda:
 Guía en castellano sobre Divi: Elementos de cabecera

Accede rápido a WordPress

Una opción sumamente interesante es el acceso rápido que el personalizador de temas te ofrece a
otras partes del administrador de WordPress como por ejemplo:

Menús.

Widgets.

Portada estática.

Guía en castellano sobre Divi: Acceso rápido a

WordPress

Luego, si necesitarás añadir un nuevo menú, modificar o sustituir tus widgets o incluso establecer tu
página de inicio y la de tu blog, lo podrás hacer todo a través de esta herramienta sin tener que
acceder al panel de administración de WordPress ahorrándote tiempo durante el proceso.

Modos de edición de Divi Builder

El diseño del contenido de tu web se hará con Divi Builder a través de dos modos de edición: el
Back-end o el Front-end.

El Back-end es la parte ubicada en el panel de WordPress de tu página. Es la vía de diseño que

Elegant Themes ofrece desde el principio y el que resultados más estables ha dado hasta el
momento:
 Guía en castellano sobre Divi: Back-end

Por otro lado tenemos el Front-end, un modo que te permite diseñar tus páginas en la parte visual,
directamente sobre ellas:

Guía en castellano sobre Divi: Front-end

Dado que ambos tienen sus pros y sus contras Elegant Themes ha desarrollado recientemente el
Wireframe, un híbrido entre el back-end y el front-end para que te beneficies de las ventajas de
estos modos de edición :

Guía en castellano sobre Divi: Wireframe

Disposición de layouts
Como verás los módulos son los bloques básicos del diseño, cada uno con una funcionalidad
específica que dotará a tu web con la potencia que necesita.

Y te preguntarás: ¿pero cómo los inserto en mi web?

Pues de forma muy simple: a través de los distintos diseños o layouts que Divi Builder te ofrece.

Con el plugin contarás con hasta 20 disposiciones de diferentes a través de sus secciones
estándar, de anchura completa y especial:
 Guía en castellano sobre Divi: Layouts

Para ello sólo necesitas crear una sección, elegir el tipo de columna que necesitas e instalar allí los
módulos.

Esta amplia gama de layouts es esencial ya que con ellas diseñarás páginas con disposiciones de
todo tipo.

Integración de 46 módulos listos para su instalación

Como vimos los módulos serán elementos claves en tu web para aportarle a ésta un sin fin de
funcionalidades diferentes.

Divi Builder cuenta en la actualidad 46 módulos con un montón de particularidades distintas que
vienen la verdad muy bien para evitar tener que estar instalando plugins todo el tiempo:

Guía en castellano sobre Divi: Módulos

Los módulos que existen en la actualidad son:

Acordeón. Iniciar sesión

Anuncio. Llamada a la acción

Audio. Mapa.

Barra lateral. Navegación por los mensajes.

Blog. Persona.
 Botón Slider.

Búsqueda. Slider para vídeos.

Comentarios. Código de anchura completa.

Conmutador. Imagen de anchura completa.

Contador de número Mapa de anchura completa.

Contadores circulares. Menú de anchura completa.

Contadores de barra. Portafolios de anchura completa

Correo electrónico Opt-in Slider de anchura completa.

Código. Slider de mensaje con anchura

completa.
Formulario de contacto
Título de anchura completa.
Galeria
Título de publicación de anchura
Imagen.
completa.

Con guraciones y ajustes de todo tipo

El proceso de diseño con Divi Builder no termina con la selección de tus layouts y la instalación de
tus módulos.

Todos los elementos básicos de Divi Builder (secciones, filas y columnas) se configuran por medio
de tres pestañas principales:

Contenido
Es el lugar donde incluirás el contenido principal: una imagen, video, texto, etc…

Guía en castellano sobre Divi: Ajustes de contenido

Diseño
Aquí realizarás todas las configuraciones relativas a la apariencia de ese elemento como por
ejemplo: el tipo de alineación, el tamaño del texto, color, tipo de fuente, relleno, margen, etc…
 Guía en castellano sobre Divi: Ajustes de diseño

Avanzado
Si sabes de CSS esta puede ser una de tus secciones favoritas ya que podrás incluir clases e
identificadores así como todo tipo de reglas CSS:

Guía en castellano sobre Divi: Ajustes avanzados

Guarda tus diseños en la Biblioteca de Divi

Imagina que diseñas tu web pero hay partes que te gustan tanto que te encantaría poder aplicarlas
en otras páginas o incluso en otro sitio web distinto.

Pues esto es totalmente posible gracias a la Biblioteca de Divi:

 Guía en castellano sobre Divi: Biblioteca Divi

Este elemento es fundamental y una de las razones por las que tanto Divi como Divi Builder me
convencen como un tema top para diseñar cualquier sitio web.

Con la biblioteca no sólo vas a poder guardar el diseño de una página completa sino
prácticamente todo lo que diseñes con Divi Builder:

Diseños de páginas completas.

Secciones.

Filas.

Columnas.

Módulos

El proceso es muy simple:

1 Diseña un elemento.

2 Guárdalo en la biblioteca.

3 Instálalo.

Lo bueno es que la instalación no sólo se puede realizar en tu sitio web sino en cualquier otro que
tenga Divi Builder gracias al mecanismo de exportación/importación de archivos que te mostraré
más adelante.

Elementos globales
Otra opción muy interesante son los elementos globales.

Los elementos globales son aquellos que, una vez creados e implementados en tu web,
permanecen conectados de tal forma que un cambio en la configuración de uno se reflejará
inmediatamente en los demás:
 Guía en castellano sobre Divi: Elemento global

De esta manera podrás implementar elementos muy interesantes como un pié de página más
completo que el que Divi te trae por defecto, un call to action, un área con texto, un formulario de
contacto para captar suscriptores, etc…

Plantillas prediseñadas
Otra manera de ahorrar mucho tiempo con el diseño es con las plantillas prediseñadas que trae
Divi Builder en su biblioteca:

Guía en castellano sobre Divi: Plantillas prediseñadas

Encontrarás una gran variedad de plantillas clasificadas por temáticas para que selecciones la que
más te convenga.

Además, tanto Elegant Themes como otras empresas ofrecen plantillas gratuitas a tu libre
disposición.

Exportación / importación de diseños y con guraciones

Otra herramienta super útil es la exportar e importar tanto diseños como configuraciones.

Por un lado, tras almacenar un diseño en la biblioteca de Divi podrás exportarlo para luego
importarlo en otra web con Divi Builder:

Guía en castellano sobre Divi: Exportar e importar

diseños

De igual forma tendrás la posibilidad de hacer lo mismo con todos los ajustes y configuraciones
realizados en los siguientes elementos

Opciones del tema.

Personalizador de temas.

Personalizador de módulos.

Guía en castellano sobre Divi: Exportar e

importar configuraciones

Como ves si te dedicas al diseño web de forma profesional la cantidad de tiempo que te ahorrarás
será enorme.

Corrige errores fácilmente

Divi Builder trae consigo botones de deshacer/rehacer para que siempre puedas rectificar
cualquier error que hayas cometido:
 Guía en castellano sobre Divi: Deshacer/rehacer

Así mismo tienes la opción historial para que puedas volver atrás seleccionando un estado anterior:

Guía en castellano sobre Divi: Historial

Además, recientemente añadieron una serie de comandos en forma de shorcuts para que a través
del teclado de tu ordenador puedas copiar, cortar, pegar, deshacer, rehacer y un montón de
acciones super interesantes que te ahorrarán mucho tiempo.

Búsqueda
Una funcionalidad nueva muy interesante es la del buscador de opciones que encontrarás en
todos los elementos de diseño de Divi Builder.
Sólo tienes que introducir la palabra clave de las opciones que te interesen configurar y se
mostrarán todas ellas.

De esta forma irás directo al grano evitando perder bastante tiempo.

A/B Testing con Divi Leads

Divi Builder trae incorporado un nuevo sistema de testeo que te permitirá analizar el potencial de tus
landing pages para saber cuál de ellas genera más conversiones.

Sólo tienes que crear varios tipos de diseños y configurar el sistema.

Divi Leads se encargará de mostrar tus versiones a usuarios distintos para recopilar
posteriormente toda la información.

Guía en castellano sobre Divi: Divi Leads

Una vez hecho esto tendrás a tu disposición un completo informe estadístico donde toda la
información recogida será visualizada en forma de gráficos y otros elementos permitiéndote
comprender de un rápido vistazo cuáles de tus diseños están funcionando mejor.

Diseño Responsive
 Cada día el uso de dispositivos móviles tipo tablet y smartphones está creciendo exponencialmente.
Por eso el diseño responsive, es decir, la capacidad que tu sitio web tiene para adaptarse a los
distintos dispositivos móviles, es fundamental.

En este aspecto Elegant Themes no sólo se han asegurado de implementar un diseño fluido sino
que también te ofrece distintas herramientas para que tú mismo intervengas en el proceso:

Guía en castellano sobre Divi: Diseño responsive

Podrás configurar estilos como el margen, padding, tamaño de fuente y la visualización o no de

cada uno de los elementos dependiendo del dispositivo que selecciones.

Seguridad con Divi

En cumplimiento con Ley 34/2002, de servicios de la sociedad de la información te recordamos que al navegar por este sitio estás aceptando el uso de cookies propias y ajenas. Acepto Más información

La seguridad de tu sitio web es algo que debes tener muy en cuenta desde el principio.

Por esa razón desarrollé mi artículo Cómo aumentar la seguridad de tu sitio web sin
complicaciones con el objetivo de que tengas las bases para implementar un sistema de seguridad
sólido que blinde tu sitio web.

Elegant Themes se toma también muy en serio este aspecto.

Prueba de ello son las auditorias a las que se han visto sometidos continuamente por Sucuri una
empresa internacional especializada en seguridad web:
 Guía en castellano sobre Divi: Certificado de seguridad con Divi

Actualizaciones
Esto mola y mucho.

Te cuento: Elegant Themes publica mejoras frecuentes a través de sus actualizaciones eliminando
así posibles errores de código que afecten tanto la experiencia de usuario como la seguridad.

Pero aparte de esto están incorporando nuevas funcionalidades que te permitirán diseñar de
forma mucho más eficiente.

Algunos ejemplos recientes son:

Wireframe view.

Barra de búsqueda en los módulo.

Nuevas opciones de background.

Mejora en el sistema de documentación.

Mejoras que no te van a costar ni un sólo céntimo ya que son totalmente gratuitas.

Precio
Elegant Themes cuenta en la actualidad con 2 planes de contratación:
 Guía en castellano sobre Divi: Precios Elegant Themes

Yearly Access
Por 89$ al año vas a disponer de los siguientes productos:

Acceso a todos los temas: casi 90 temas a tu disposición.

Acceso a todos los plugins: podrás usar los plugins Divi Builder,
Monarch y Bloom desde el primer momento.

Actualizaciones de todos tus temas: frecuentes mejoras en el código.

Soporte premium: tus preguntas serán respondidas a cualquier hora del día.

Uso ilimitado de sus productos: podrás instalarlos en tantos sitios web como quieras.

Garantía de 30 días de devolución: en caso de no estar satisfecho te devolverán el

dinero sin ningún problema.

Lifetime Access
Si eres diseñador web y/o quieres ahorrar dinero a medio y largo plazo por un precio de 240$ vas a
disfrutar de todos los beneficios del plan anterior de por vida.

Nunca tendrás que renovar más y podrás seguir sacándole todo el partido a tus productos a la vez
que disfrutas de los nuevos que vayan saliendo.

Cómo crear una home page con Divi en unos

minutos
Para ir terminando te muestro un vídeo muy práctico y didáctico donde te enseño paso a paso cómo
diseñar por ti mismo una home page con la ayuda de Divi y Div Builder.

¡Vamos a ello!
 ¿Es todo es tan bonito como lo pintan?
No, ni mucho menos.

Ni Divi ni Divi Builder son productos perfectos y el que diga lo contrario está mintiendo. Lo
siento pero es así.

Hay varias cosas que considero que debes tener en cuenta:

Aprendizaje: dominar las herramientas que te ofrece Divi y Divi Builder requiere
dedicación. No esperes dominarlo todo en un par de días. Te va a llevar algo de tiempo
adquirir un conocimiento profundo de ellas.

Inglés: tanto la documentación como los videos que Elegant Themes te ofrece se
encuentran en inglés. Si bien todos sus tutoriales están explicados a la perfección no deja
de ser un impedimento para aquellos que no dominen bien este idioma.

Consumo de recursos: tenerlo todo a tu disposición sin tener que tocar nada de código
tiene un precio que hay que pagar. El tema ocupa más tamaño otros productos como
Génesis. Es fundamental adquirir un buen hosting que te permita mantener
tus velocidades de carga al nivel que deben estar.

Configuraciones: algunas opciones de configuración, como por ejemplo las del SEO, son
demasiado extensas. Es mejor a veces mejor delegar esta tarea a plugins de calidad tipo
Yoast SEO.

Efecto lock-in: si un día decides prescindir de Divi Builder y usar otro plugin esto se
convertirá en una molestia. Esto se debe a que al desinstalarlo, en lugar de dejarte intacta
toda la información, se mostrará una serie de shortcodes en su lugar. Si borras los
shortcodes se borrará la información por lo que tendrás que diseñar esas páginas
previamente. Afortunadamente existen soluciones y además tengo constancia que la
empresa está trabajando en este asunto.

Regalo
Seguramente te hayas quedado corto y necesites más información. No hay ningún problema.

Para ayudarte aún tengo listo un curso de introducción a Divi totalmente gratuito a través del
cual te muestro con mayor lujo de detalles todo el proceso de maquetación:
 Guía en castellano sobre Divi: Curso Gratuito de Introducción a Divi

En él encontrarás:

Una guía básica con información resumida sobre Divi para que nunca partas desde
cero.

Más de 8 videotutoriales donde te explico con detalle cada una de sus partes.

Un descuento exclusivo para cada uno de sus planes.

Auditoria personalizada para resolverte tus dudas sobre el tema (aplicable sólo
a los primeros suscriptores del mes).

¿Qué me dices?¿Necesitas aprender más?¿Quieres comprobar en directo el potencial de esta

magnífica herramienta?

Importante: Para comenzar el curso haz clic el siguiente enlace. Te llevará a la guía que regalo en mi
blog gracias a la cual, entre otras muchas ventajas, te dará acceso directo a él

Curso de Introducción a Divi

Diseña tu web fácilmente sin necesidad de programar:

Acceso gratuito a el Curso de Introducción a Divi

Descuento - Planes de Elegant Themes

Y por último pero no menos importante…

Si estás decidido a usar este tema en tu sitio web te ofrezco un descuento exclusivo del 10% en
todos sus planes de por vida para que te ahorres algo más de dinero de tus bolsillos
 Mega guía en castellano sobre Divi: Descuento Elegant Themes

Descuento exclusivo del 10% con Elegant Themes

Utiliza mi descuento del 10% y disfruta ya de cualquiera de los planes de Elegant Themes
a precios de derribo.

Adquirir un plan de Elegant Themes

Conclusión

Si realmente necesitas un tema que te ofrezca un sin fin de opciones para maquetar tu contenido sin
tener que invertir mucho tiempo aprendiendo lenguajes de programación Divi es una excelente
opción de compra.

Divi es desde el punto de vista del diseño y la funcionalidad uno de los mejores
temas para WordPress que encontrarás hoy en día.

Además, su creciente comunidad junto con sus frecuentes actualizaciones te permitirán diseñar tu
sitio web de forma profesional, rápida y elegante mientras disfrutas durante el proceso.
Y aquí termina la guía en castellano sobre Divi. ¿Qué te ha parecido? ¿Tienes más
dudas? ¡Te espero en los comentarios!

   

¿​​Qué te pareció ​el​ ​artículo​? No pierdas el

tiempo y únete ​ahora​ a ​mi​ ​comunidad​​

​¡​Recibirás​​ mi ​guía​ ​gratuita​​, herramientas, ​descuentos​​ y

contenidos​ ​totalmente​​ ​exclusivos​​!​

Tu mejor email ¡ES TUYA!

Artículos Relacionados

¿Qué tema para WordPress Los 8 diseñadores web con Claves imprescindibles
elegir? En busca del tema WordPress que nunca te para vivir de un blog
perfecto pueden faltar diseñando landing pages
que conviertan

Deja volar tu imaginación ¡Exprésate!

Nombre* E-mail* Web

 Notificarme

Enviar tu comentario

Ordenar: por los más nuevos

26 comentarios

 20:58 27 diciembre, 2017

ruben
Hola Pedro!!!

Ya había podido disfrutar de tus vídeos en la END sobre Divi y gracias a ello, tomé la decisión de
utilizarlo.
Simplicidad y rapidez para maquetar. Muy intuitivo y se aprende bastante rápido.

Darte las gracias por esos vídeos y por este pedazo de guía en español.

Un abrazo.

Responder  Compartir
  18:01 29 diciembre, 2017

Pedro Suárez
Hola Rubén, Autor

¡Qué bueno verte por aquí!

Me alegro que el artículo te sea haya sido de utilidad y que poco a poco estés pudiendo diseñarte
tu propia web con Divi a tu medida, tú solito.

Así te ahorras una buena pasta y de paso aprendes, que el saber no ocupa lugar, ¿no? jajaj

Pues nada, muchas gracias por pasarte y te espero en el curso de la END de Antonio G, que pronto
sacamos más módulos entre los cuáles uno sobre Divi, por supuesto

¡Un abrazo!

Responder  Compartir

 20:02 4 noviembre, 2017

Galaad López
Hola Pedro!

Me han recomendado tu blog una amiga diseñadora gráfica porque tengo Divi en mi web como theme
y quería saber cómo configurarlo para que los posts del blog me aparezcan en el medio de la pantalla
y no ligeramente en el lateral izquierdo como ahora.

Estamos haciendo pruebas de momento con el código css con los técnicos en el foro del soporte oficial
de Elegant Theme, pero nothing de nothing. No se provoca los cambios.

Sabes algo al respecto? Ya que el texto centrado y más estrecho de laterales es más fácil de leer-
escanear para el lector.

Gracias!

+1 Responder  Compartir

 12:51 6 noviembre, 2017

Pedro Suárez
¡Hola Galaad! Autor

Encantando de conocerte.

Pues para los posts sólo tienes que dirigirte al back-end de cada post, es decir, en editar entrada y
a la derecha de tu entrada verás un menú llamado "Ajustes de publicación de Divi". Ahí podrás
seleccionar que tu post tome el ancho completo de tu página o se sitúe a la izquierda o derecha.

No tienes que recurrir a CSS ni nada por el estilo. Es una funcionalidad que te ofrece el tema por
defecto.

Ya me dices, ¿ok?

Un abrazo

Responder  Compartir

 13:37 6 noviembre, 2017

Galaad López
Nada. No te lo permite. Solo tener la barra lateral en la izquierda, en la derecha o texto ancho
del todo. Yo quiero la columna del texto totalmente centrada y que además pueda configurar
su anchura.

+1 Responder  Compartir

 20:09 6 noviembre, 2017

Pedro Suárez
Hola Galaad, Autor

Si quieres personalizar el ancho tendrás que utilizar CSS.

Con algo así te bastaría:

.single-post #main-content .container {

max-width: 800px;
margin: auto;
}

Podrás pegar ese código en la hoja de estilos de tu tema hijo (si tienes uno) o en la casilla
"CSS personalizado" de las Opciones del tema de Divi.

Si no se reflejan los cambios prueba a borrar la caché tanto de tu navegador como de tu

plugin caché, si utilizas uno.

Si siguiera sin visualizarse comprueba que tu proveedor hosting no tiene implementando

un sistema caché por defecto. De ser así tendrás que pedirle que te lo desactiven.

Un abrazo

Responder  Compartir

 08:06 7 noviembre, 2017

 Galaad López
Hola Pedro.

He aplicado los dos códigos que me has dicho seguidos:

.single-post #main-content .container {

max-width: 800px;
margin: auto;
}
body #page-container #left-area {
width: 100%;
}

Pero en los artículos se me visualiza ahora la línea del margen:

http://www.galaadlopez.com/dinero-con-sentido/

 Compartir

 10:08 7 noviembre, 2017

Pedro Suárez
Hola, Autor

Aplica:

#main-content .container:before {display: none;}

De todas formas asegúrate que en tu entrada has seleccionado que el contenido

tome el ancho completo a través de los "Ajustes de publicación de Divi"

Te lo comento porque lo ideal es hacerlo todo con Divi y en última instancia aplicar
estilos CSS.

Un abrazo

 Compartir

 06:57 7 noviembre, 2017

Galaad López
El parámetro de "margin: auto;" puede ser otro? Ahora si me deja configurar el ancho
de texto, pero la columna sigue estando ligeramente a la izquierda. Y la quiero en el
medio. Como en este mismo artículo tuyo de Divi.

La cuestión es facilitar el escaneo al lector lo máximo posible,

 Compartir

 07:05 7 noviembre, 2017

Pedro Suárez
Hola, Autor

Realmente tendría inspeccionar tu post para ver los estilos que están afectando a tu
página.

Prueba esto:

body #page-container #left-area {

width: 100%;
}

Sino ya me dices y lo veo con más detalle

Abrazos

+1  Compartir

 19:38 10 octubre, 2017

Yeferson Cogollo
Hey Pedro. Buen artículo. Yo uso también DIVI para mi sitio web y para el de mis clientes. Es una
herramienta muy intuitiva y te permite maquetar sin complicaciones. Para serte honesto, no sabía
cómo instalar el Child Theme así que me ha servido bastante. Voy a probarlo en mi web para hacer
algunos diseños diferentes.

En mi caso compre el plan anual, pero me surge la duda, si instalo este plugin en la web de mis
clientes, cuando se me acabe el año debo actualizarlo en las webs de ellos? No me queda muy claro :/

De nuevo muy buena guía. Saludos desde Colombia parcero. Éxitos

+1 Responder  Compartir

 15:47 11 octubre, 2017

Pedro Suárez
Hola Yeferson, Autor

Gracias de nuevo por pasarte por aquí.;)

¿Usas Divi entonces? ¡Perfecto! Es una muy buena elección y tiene una equipo que, como bien
sabrás, está incluyendo muchas mejoras que están de lujo.

Sí, lo del tema hijo está muy bien siempre que necesites personalizar vía CSS y/o PHP tu web o la
 de tus clientes. Yo por ejemplo ahora estoy diseñando una para uno de mis clientes y he tenido
que recurrir a un tema hijo para hacer cambios en las categorías de las entradas ya que Divi aún
no ofrece una funcionalidad para este tipo.

Sobre el tema de las actualizaciones: si tu plan es anual, instalas los productos de Elegant Themes
en la de tus clientes, pasa ese año y no actualizas ellos no podrán actualizar esos productos
porque éstos están vinculados a tu licencia.

Por eso, si eres diseñador yo siempre recomiendo adquirir el plan de por vida, el Lifetime Access.
Aunque al principio es más caro a medio plazo sale mucho más rentable. La verdad es que
merece la pena.

Ya me dirás.

¡Un abrazo!

Responder  Compartir

 20:07 4 noviembre, 2017

Galaad López
Hola, soy Galaad.

Acabo de leer tu respuesta a Yeferson.

Yo en nada voy a comenzar a diseñar la web de un cliente. Me gustaría saber para tenerlo
claro si lo ideal es que deba cobrarle por una licencia para él con la que yo diseñarle la web
además del servicio de diseño en sí.

Gracias

+1 Responder  Compartir

Hola de nuevo, Autor

Yo normalmente incluyo Divi, además de otros productos, con el diseño web para mis
clientes. Eso le da un valor añadido a tu servicio y evitas que ellos tengan que gastarse
un dinero extra en adquirir el tema.

Como tengo la licencia de Divi Lifetime Access no tengo problema, ya que ésta no caduca
nunca.

Le instalo el tema, los plugins premium que necesite, activo la licencia y listo.

Espero haberte ayudado

 Compartir

 13:39 6 noviembre, 2017

Galaad López
Osea, comprarle la licencia para siempre (Divi Lifetime Access) a cada cliente y no
cobrársela en el tarifa final. Querías decir eso?

+1  Compartir

 20:16 6 noviembre, 2017

Pedro Suárez
Hola, Autor

No exactamente.

Elegant Themes te permite instalar todos sus productos en tantos sitios web como
quieras.

Si quieres instalar Divi en la web de un cliente sólo tienes que:

1. Descargar Divi.
2. Instalarlo en la web.
3. Añadir tu nombre de usuario y clave API en el panel de Divi "Opciones del Tema >
Updates"para que tu cliente pueda actualizar Divi.

De esta forma se ahorrará tener que comprar Divi o cualquier otro producto de
Elegant Themes.

¡Un abrazo!

 Compartir

 16:38 18 agosto, 2017

jmelero
A qué se puede deber el error de que el builder de divi no se active en el front end??

+1 Responder  Compartir

 16:46 18 agosto, 2017

Pedro Suárez
Hola! Autor
 La verdad es que no he tenido un problema de ese tipo.

¿No puedes activarlo en el front-end?¿Has probado si tienes una actualización del plugin que
descargar? Si es así hazlo.

Si te sigue pasando puedes probar desactivando tus plugins y activar uno a uno comprobando si
alguno entra en conflicto con Divi Builder y así descartas.

Ya me cuentas.

Un saludo!

Responder  Compartir

Muchas gracias x el tutorial, es difícil encontrar un material tan buen en español. Éxitos!

+1  Compartir

 10:12 7 agosto, 2017

Pedro Suárez
Hola Flor, Autor

¡Bienvenida¡ Muchas gracias por pasarte por mi blog y aportarnos tu opinión.

Me alegro que te sea de utilidad y puedas aplicar lo aprendido en cualquiera de tus proyectos

Aquí estaremos para lo que necesites, tanto sobre Divi como cualquier otro producto relacionado
con WordPress

Un abrazo fuerte

Responder  Compartir

 17:53 7 julio, 2017

Beatriz GM
¡Buenas Pedro!

Si hay algo que tenía clarísimo cuando me propuse lanzar mi blog el año pasado es que merecía la
pena invertir en un buen tema. ¡Al pedir referencias DIVI estaba entre los candidatos en mi top 3!

Sé que a quién esté en una situación parecida de indecisión en estos momentos tu artículo le va
ayudar mucho a salir de dudas, y que tu opinión y los vídeos le van a servir para perder el miedo que
puedan tener a lo desconocido

A mí me costó decidirme y al final elegí otro tema, un poco a voleo, jeje. Me pregunto si hubiera
escogido ese mismo después de haber leído con un post como este...

Te felicito por el trabajazo

Un abrazo

+1 Responder  Compartir

 12:33 8 julio, 2017

Pedro Suárez
¡Hola Beatriz! Autor

Muchas gracias de corazón por pasarte por mi blog y aportarnos tu experiencia.

Elegir un buen tema es como bien dices una inversión y no un gasto. El "problema" es que hay
muchos y tanta información que muchas veces uno no sabe cuál elegir.

Eso es precisamente lo que intento aportar con mi blog dejando claro que Divi es una magnífica
elección para un usuario con conocimientos en diseño web de todo tipo.

Aunque ojo, como cualquier otro producto, no es perfecto y necesita mejoras

Pero lo bueno es que la empresa Elegant Themes está incluyendo mejoras frecuentemente y
añadiendo más funcionalidades. Y todas gratuitas claro. De hecho sacaré la semana que viene un
post de ello

Muchas gracias por todo y seguimos en contacto,

Un abrazo

Responder  Compartir

 09:39 19 junio, 2017

Rosa León
Hola Pedro!

Súper completa esta guía sin dudarlo la he compartido con mi audiencia que seguro les será de
mucha utilidad. Ya no tendrán excusas de no atreverse a crear su propia web con lo fácil que lo hace
el constructor de Divi. Aunque yo soy algo más de usarlos en momentos concretos como por ejemplo
una landing page, para quien se ve con miedos, realmente recomendable.

Un gran trabajo, ¡saludos!

Rosa León

+1 Responder  Compartir
  11:40 23 junio, 2017

Pedro Suárez
¡Hola Rosa! Autor

Un placer verte por aquí compañera y mil gracias por compartir el artículo con tu audiencia

Si, lo bueno de Divi y Divi Builder es que su uso es bastante sencillo y el potencial enorme así que
ya no hay excusas para diseñar, jeje.

¡No te pierdas las actualizaciones de Elegant Themes ya que van a tope! Te dejo el enlace por si te
interesa: https://www.elegantthemes.com/blog/category/theme-releases

Ya me dices

Abrazos

Responder  Compartir

 22:11 18 junio, 2017

david
Hola Pedro.

Muchas gracias por este artículo tan completo, la verdad es que no conocía esta herramienta, así que
ahora me tendré que poner manos a la obra siguiendo tus consejos para sacar el máximo partido
cuando lo instale.

Saludos

+1 Responder  Compartir

 11:35 23 junio, 2017

Pedro Suárez
Hola David, Autor

Me alegro que lo hayas encontrado interesante

La verdad es que Elegant Themes está desarrollando productos de muy buena calidad y Divi es sin
lugar a dudas uno de ellos. Normal que esté ya posicionado como uno de los mejores temas para
WordPress del mercado.

Ojo, el producto tiene aún cosas que mejorar. Esto hay que dejarlo claro. Pero lo bueno es que la
empresa está incluyendo actualizaciones y mejoras de forma frecuente y eso es importantísimo,
por eso tengo tanta fe en ellos.

Si te animas a probarla no dudes en comentarnos que tal te va.

¡Un abrazo!

Responder  Compartir

Aviso Legal y Política de Privacidad Límite de responsabilidad Contacto

© Copyright Pedro Suárez · Todos los derechos reservados

Diseñoteweb
En cumplimiento con Ley 34/2002, de servicios de la sociedad de la información por Pedro
recordamos queSuárez · Hosting
al navegar por esteRaiola Networks
sitio estás aceptando el uso de cookies propias y ajenas. Acepto Más información