Un mes y medio después de anunciar nuevas características para la siguiente versión de su tema por antonomasia, Elegant Themes se despachó ayer con Divi 2.7.
La inclusión más significativa de este lanzamiento es el sistema de pruebas multivariable, centrado en el rastreo de rendimiento y conversiones.
Si bien es probable que el usuario común no llegue a necesitar esta herramienta, sin duda se trata de un interesante accesorio para aquellos que trabajan principalmente con páginas de aterrizaje (landing pages) o páginas de venta, ya que les proporciona un método integral para monitorear el desempeño de las distintas alternativas de diseño.
Según nos cuenta Nick Roach en la entrada del blog, la idea de Divi Leads (una expresión difícil de traducir, pero que hace referencia a elementos “que llevan la delantera”) es simple: sirve para crear diferentes versiones de una misma página, seleccionar una meta u objetivo para alcanzar, y luego de determinado tiempo saber cuál de las versiones es la más efectiva al momento de cumplir esa meta deseada. Puede ser desde cambiarle el color o el tamaño a un botón de un llamado a la acción, hasta usar distintos textos para comunicar un mismo mensaje. Y no solo está circunscripto a elementos, sino que también se puede aplicar a módulos, filas, secciones y diseños enteros.
El nuevo sistema de pruebas multivariable del Constructor de Divi
Otra novedad de Divi 2.7 es la portabilidad extendida. Esta sí es una característica genial y de la cual todos nos veremos beneficiados por igual. Ahora Divi incluye un sistema que facilita la exportación e importación de todos los aspectos de nuestros sitios: paquetes de diseños de la Biblioteca, ajustes del personalizador de tema y de módulo, perfiles y opciones del tema. Hasta la migración de imágenes ya no será un problema, ya que el sistema de portabilidad las codifica dentro de los archivos de importación, las añade a la biblioteca de medios y les actualiza las URL sin necesidad de que el usuario intervenga.
Y por último, los ajustes de página en el constructor de Divi, que nos dan un control mayor sobre los elementos de diseño, tales como los márgenes, los colores predeterminados y los estilos CSS.
Asimismo, han agregado un sistema de ayuda dinámica, para cuando se produce algún error de carga en el constructor. Esto es muy útil para los usuarios menos experimentados, ya que les dará indicaciones para identificar el problema y aportará posibles soluciones.
El tema Extra y el plugin Divi Builder también incluyen todos estos nuevos agregados. Las respectivas documentaciones se actualizarán debidamente (en las próximas dos semanas). Mientras tanto, pongo a disposición la actualización de los archivos de traducción para Divi 2.7, para Extra y para el plugin Divi Builder.
Y, como es costumbre, para celebrar esta reluciente versión de Divi, Elegant Themes sortea cinco membresías. Pasen por esta entrada del blog de ET (hay tiempo hasta el próximo miércoles para participar). O bien aprovechen el descuento de 20% para la cuenta Desarrollador, que otorga acceso a todos los temas y plugins por un año.
Técnica en electromecánica, periodista, entusiasta de los idiomas y enamorada de WordPress. Amante del mate, la lectura, la música y las series de sci-fi. Mamá de una vizsla loca.
- Guía para WordPress 6.6 disponible - 22 de septiembre de 2024
- Guía para WordPress 6.5 disponible - 13 de junio de 2024
- Guía para WordPress 6.4 disponible - 5 de diciembre de 2023
Hola,
querría saber como eliminar la barra lateral derecha del blog.
En una web lo tengo hecho pero ahora no encuentro dónde hacerlo.
Gracias
Hola, Max.
En esta entrada reciente del blog de ET está bien detallado.
Saludos.
Mil gracias por vuestra respuesta
Hola a todos/as,
Me han surgido unas dudas que no sé me podríais resolver, quisiera saber:
– Cómo añadir los iconos de redes sociales al final de cada entrada del blog (para poner unos diseñado por nosotros y también poder añadir algún separador bonito).
– Cómo cambiar el fondo de cada título del sidebar por separado, un fondo para categorías, otro para publicidad, etc…
– Cómo quitar el cartel de Pinterest rojo que aparece arriba a la izquierda, ya que estamos poniendo el botón pin it personalizado y no queremos que aparezca el de defecto también.
– Por último esto no sé si solo me pasa a mi por tener el widget google fonts y que entre en conflicto con Divi, pero resulta que en el blog, el sidebar es de una forma cuando estoy en todas las entradas y cuando entro a un post en particular el sidebar cambia de apariencia (tamaño de las letras, fondos, márgenes…)
De nuevo muchas gracias Ana por todo 🙂
Hola, Esther.
Para los botones de redes sociales, tendrás que buscar algún plugin de social share que te permita subir tus propios iconos.
Para el fondo de los títulos, todo va a depender del tipo de widgets que estés usando. Fijate cuál es la ID del widget y luego aplicale estilos al elemento
h4. Por ejemplo, para un widget de comentarios recientes sería algo así:#recent-comments h4 { background: #ff0000; }El cartel de Pinterest no me queda claro cuál es. Y lo del widget de Google Fonts tampoco sabría decirte ya que nunca lo usé. Fijate si desactivándolo los estilos se unifican. Si no, puede deberse a que tengas estilos aplicados al módulo Barra lateral (en el caso de que la página del blog la hayas hecho con el Constructor).
Saludos.
Hola Ana,
Acabo de descubrir el blog (me encanta) y hace poco Divi. Estoy queriendo cambiar por completo la apariencia del widget “buscar”, pero cuando subo la nueva imagen (añado content:url de la imagen en su selector) se sustituye el diseño pero se convierte solo en eso… una imagen sin la función de búsqueda. ¿Alguien sabe cómo cambiar su diseño sin perder su funcionalidad?
Un saludo y muchísimas gracias!!
Hola, Elisa.
Gracias por tu comentario. Para cambiar el estilo del campo y botón del widget de búsqueda tenés que usar CSS.
Las clases son:
.widget_search input#s, .widget_search input#searchsubmit { /* Para el campo de entrada */ } .widget_search #searchsubmit { /* Para el botón */ }Incluí las imágenes como fondo, con
background. En algunos estilos seguramente tendrás que agregar la declaración!importantpara que tomen efecto.Espero que te sirva.
Saludos.
Ha funcionado perfecto, muchas gracias 🙂 !!!!!!
Hola de nuevo. Me gustaría utilizar el constructor de DIVI para personalizar las entradas de mi blog. Todas las entradas hacen referencia a un enlace de video de Youtube. Cuando utilizo el constructor DIVI, la imagen asociada al video desaparece de la página principal de entradas, visualizando solo el título de la entrada. ¿ Sabes como puedo solucionarlo ?
Un saludo y gracias.
Hola, Ángel.
No hay solución para esto. El vídeo solo aparece como miniatura cuando se usa el tipo de entrada personalizada Vídeo, la cual está disponible únicamente en el editor predeterminado y no en el constructor. 🙁
Saludos.
Hola Ana, gracias por la información que aportas sobre Divi para los que estamos comenzando nos saca de muchos apuros.
Una consulta en un “Control deslizante de anchura completa” por defecto el titulo, cuerpo y botón me salen en el centro de la diapositiva, como puedo hacer para mover estos elementos en una posición diferente?, por ejemplo si tengo un titulo y un botón y quiero que estén en la parte superior de la diapositiva o en la parte superior-izquierda
Gracias y un saludo
Hola, Iván.
Gracias por tu comentario.
El Carrusel de ancho completo tiene dos imágenes: una de fondo (la que cubre el ancho de la pantalla) y una de diapositiva, que se coloca a la izquierda. El título, texto y botón siempre quedan a la derecha de la diapositiva. Depende de la ubicación que quieras darle a la diapositiva y/o al bloque de la descripción, tendrás que usar estilos CSS personalizados. Por ejemplo, si no querés diapositiva y el contenido a la derecha, el código sería:
agregado a la pestaña CSS personalizado del módulo, campo Descripción de la diapositiva. Todo es cuestión de probar.
Espero que te sirva.
Saludos.
Hola Ana, tengo un par de dudas que no consigo resolver, te lo agradezco si me puedes ayudar
1.- Que codigo debo introducir y donde para que cuando la persona pinche sobre los iconos de las redes sociales estos se abra en una ventana nueva?
2.- Como puedo poner un control deslizante de anchura completa con testimonios, lo he hecho con los articulos en mi pagina principal de la cual te dejo la url aunque no he conseguido el efecto de que vayan entrando por la derecha y salgan por la izquierda pero con testimonios no se como hacer.
gracias y un saludo
Hola, Vicente.
El código se encuentra en esta entrada, sección Abrir enlaces a redes sociales en una nueva ventana.
En cuanto a testimonios, podés usar un Carrusel de ancho completo y simplemente editar el contenido. En cuanto a la animación, el módulo no ofrece muchas opciones. Para que aparezca por la derecha, tendrías que agregar el siguiente código CSS:
.et-pb-active-slide .et_pb_slide_description { animation-name: fadeRight !important; }Pero eso es todo lo que podés controlar (no que salga por la izquierda). Si necesitás un slider de testimonios con más opciones, te convendría buscar un plugin.
Saludos.
Hola Ana, como siempre genial el Blog de lo mejor respecto a DIVI en castellano.
Quisiera hacerte una consulta, textualmente seria muy engorroso o largo y acompañado de imágenes es super simple por lo cual dejo link a un pdf para que me entiendan mejor.
Pero básicamente se trata de como lograr en DIVI un modulo interactivo al posar el puntero por encima, cualquier dato o guía de por donde ir o buscar te lo re contra agradeceria.
Gracias desde ya!
https://drive.google.com/file/d/0B4tD17-DQgVQQVI4VzdGaHgtRVk/view?usp=sharing
Hola, Luciano.
El plugin Essential Grid es ideal para estos casos. Es de los creadores de Slider Revolution, así que la mecánica es bastante parecida (con capas, efectos, etc.).
Saludos.
Muchas gracias! creo que estoy logrando lo que necesito, no 100% pero con resultados más que decentes.
Sos una genia!
Hola Ana,
Haber si puedes ayudarme. Que puedo hacer para que un slider a anchura completa se adapte a cualquier dispositivo, lo estoy intentando con el modulo slider de Divi pero no logro que funcione.
Muchas gracias.
Hola, Jonathan.
Lamentablemente no hay una forma infalible. Todo depende de la proporción y tamaño de la foto que uses como diapositiva, y de la extensión y tamaño de fuente del contentido. Es prueba y error, ajustando las distintas opciones para teléfono, tablet y escritorio.
Saludos.
Hola 🙂 Está genial la nueva versión de Divi, aunque me he encontrado un problema que no sé si os ha pasado. Cuando cambio (en el módulo de llamada a la acción) la fuente al texto del cuerpo no reacciona, se queda con la que viene por defecto, en cambio la del título y la del botón cambia perfectamente.
Un saludo!!
Hola, Esther.
La verdad, no sé por qué puede pasar eso. Fijate limpiando cookies e historial del navegador. A mí a veces me pasa que no me muestra los cambios en tiempo real mientras estoy en el Personalizador de tema, pero cuando lo guardo y cargo la página, los cambios sí están. Misterios… 😕
Saludos.
Hola Ana, necesito subir una fuente a divi que no trae dentro de todas las que ya incorpora pero no se como hacerlo, me podrias decir como puedo incorporar una nueva fuente para utilizarla?
gracias
Hola, Vicente.
Depende del tipo de fuente que quieras agregar. Si es una de Google Fonts, basta con agregar en Opciones del tema > Integración > Agregar código al <head> de su sitio el código de la fuente (por ejemplo:
<link href='https://fonts.googleapis.com/css?family=Allura' rel='stylesheet' type='text/css'>). Luego la aplicás con CSS, por ejemplo:p { font-family: Allura; }Una solución simple es instalar el plugin Use Any Font, que permite subir las fuentes y las agrega al menú del editor.
Espero que te sirva.
Saludos.
Hola!! De nuevo, muchísimas gracias por la valiosa información sobre este gran tema Divi, lo estoy utilizando en varios dominios y resulta divertido jugar con los módulos. En mi opinión esta es la mejor página de información sobre el tema y sus actualizaciones.
A ver si me podeis ayudar con una duda: Cuando pongo el módulo de Formulario de contacto, el título se pone como H1 y yo no quiero eso para el SEO. ¿Donde se puede modificar? (Teniendo en cuenta que estoy pez en programación).
Y otra duda del formulario, si quiero cambiar el método de Captcha ¿Donde y como podría hacerlo?
Muchas gracias y seguir así! 🙂
Hola, Elena.
Gracias por tu comentario. 🙂
Ponerle título al formulario de contacto no es obligatorio, así que lo más conveniente sería dejar el campo en blanco, y en caso de que quieras agregarle un encabezado, simplemente usar un módulo de texto arriba.
Ahora bien, en cuanto al CAPTCHA, no hay opciones: es mostrarlo o no. Si buscás algo más personalizable, tendrías que usar un plugin externo, como por ejemplo Contact Form 7, y ajustar los estilos para que coincida con Divi (pero ya es terreno un poco más complejo).
Espero que te sirva. Saludos.
Hola, yo me dedico al desarrollo organizacional, es la primera vez que voy hacer una pagina web, es decir no se nada, no wordpress y claro no eleganttheme. Sin embargo el mes pasado me anime a comprar, el Developer. Compre un dominio y y espacio en disco, instale la version (en ingles) creo que es la 2.6.X y he empezado a desarrollar una pagina bajo divi, claro que es divertido. Mi pregunta es si quiero el divi 2.7 en español, que debo hacer? gracias por su información y disculpen mi ignorancia.
Hola, Carlos.
El tema ya viene con el idioma español incluido, pero yo había hecho mi propia traducción antes de que ET la incluyera en Divi. Podés usar la que trae por defecto, o si querés subir la mía tenés que acceder vía FTP a la carpeta de instalación de WP (en el ZIP con los archivos hay un documento de texto,
Léeme.txt, donde se explican los pasos para subir los archivos.mo). Para tener en cuenta: WordPress debe estar configurado también en español: Ajustes > Generales > Idioma del sitio > Español (y no Español de [nombre del país]).Espero que te sirva.
Saludos. 🙂