Actualizar Avada 4.0. Todo lo que debes saber

Toca actualizar Avada, una plantilla WordPress que no para de crecer… Casi cuatro años después este theme se ha convertido en un auténtico gigante. El lunes 18 de Abril se lanzó la versión 4.0 de Avada. Viene con un panel de opciones completamente nuevo y reformado. También incorpora un nuevo header con un estilo minimalista y moderno además de un largo etc de pequeños detalles que nos ayudarán mucho en el día a día de nuestro trabajo. En este post voy a destripar el proceso de actualización y todas las novedades que aporta. Además he preparado un pequeño video para que podeis ver su nuevo aspecto y algunas de sus novedades mas interesantes…

El proceso de actualizar Avada a 4.0

Antes de hablar sobre las novedades de Avada 4.0, veamos como debemos actualizar a esta versión.

Si algo tiene Avada por encima de cualquier otra cosa es fiabilidad. Es un theme seguro y robusto que aporta seguridad en cualquier proyecto. Cuando realizamos labores de mantenimiento y actualización también lo necesitamos.

En mi caso hasta la fecha, jamás he tenido ningún problema y en el paso a la versión 4.0 tampoco. Sin embargo esta actualización significa un enorme cambio principalmente en el núcleo de Avada y es necesario tener en cuenta algunos detalles.

Los chicos de theme-fusion han indicado el procedimiento muy bien explicado y siguiendo los pasos no habrá sobresaltos. Te lo explico todo a continuación.

¿Cómo actualizar?

La primera recomendación que nos hacen y muy importante es que debe hacerse desde la versión 3.8 en adelante. Es decir, todos aquellos que mantengan una versión inferior a la 3.8 no deben actualizar directamente a la 4. También aclaran que es una recomendación y no una obligación, pero… ¡por algo lo dirán!.

Si es tu caso, deben bajarte primero una versión anterior, por ejemplo la 3.9.4. Puedes bajarlo desde este enlace. Realiza la actualización, revisa que todo está correctamente y después procede a la actualización para la versión 4.0.

Desde la versión 3.7 se han añadido y también eliminado muchas funciones y posiblemente si usas alguna de ellas, dejarán de funcionar. De ahí esta recomendación.

Además su nuevo panel necesita migrar todas las opciones anteriores para que todo funcione de la misma manera. Si lo hacemos desde versiones muy antiguas, sencillamente no podrá hacerlo.

Copias de seguridad del theme y la base de datos

Al actualizar a Avada 4.0 se copian todas las configuraciones de tu antiguo panel guardándose en la base de datos. Una vez hecho el cambio se recuperan para guardarlos en el nuevo panel. A priori el proceso es limpio y transparente y no debería haber problema. Pero como ya habrás notado alguna vez (y si no ya lo notarás) estas cosas las carga el diablo y el proceso podría interrumpirse por cualquier problema ajeno a Avada o al proceso de actualización. por eso es imprescindible que hagas una copia de seguridad de la base de datos antes antes de hacer nada. Y yo que tu, haría una copia de seguridad de todo wordpress, por si fuese necesario restaurar por cualquier motivo. Así te quedas completamente tranquilo/a. Si no es posible, al menos guarda una copia de la carpeta wp-content, el archivo htaccess y wp-config.php.

Si estás utilizando Revolution Slider y has personalizado algo con CSS, guárdate el código  si has utilizado css personalizado, guárdatelo también por si las moscas. Después podrás restaurarlo.

No guardes copias antiguas del tema en la carpeta Theme

Es importante que elimines las carpetas antiguas que tengas de Avada en la carpeta theme de WordPress. Que solo quede Avada 4.0. Si no lo haces así, tal vez te encuentres con el theme desconfigurado.

No renombrar la carpeta

Si en su día renombraste la carpeta Avada con otro nombre, debes volver a poner ese nombre a la carpeta o los menus, y ajustes ya no funcionarán. Igualmente si has utilizado el nombre por defecto Avada, ahora ya no pongas otro diferente por el mismo motivo.

Actualización del Child theme

Si utilizas el Child theme, haz una copia de seguridad y una vez hayas instalado Avada vuelve a restaurarlo. Si algo no funciona por algún motivo (no lo creo), coge el nuevo que ofrece Avada y vuelve a personalizarlo con lo que tenias en el anterior.

Desconecta la caché

Si estas utilizando algún plugin de caché, límpiala y luego desconéctalo por completo para que no interfiera en ningún momento.

Actualiza los plugins que utilices y no hayas actualizado

Desde Avada, ya te avisa para que actualices los plugins que están en uso y fundamentalmente tienen integración con Avada, por ejemplo, Contact Form 7, Woocommerce, Gravity Forms, Event Calendar, Revolutions slider, Layer Slider…etc

Actualizar a WordPress 4.5 (si quieres)

Theme Fusion tuvo que liberar una versión con un parche para WordPress 4.5. Esta era la versión 3.9.4. Pero si no te habías actualizado a WordPress 4.5, no lo hagas hasta que no hayas instalado por completo Avada 4.0.

El proceso

Como siempre, descarga la actualización y súbela por ftp a la carpeta theme de tu wordpress. Actualiza los archivos del theme y cuando hayas terminado ingresa a la administración de tu wordpress. En el momento en que lo hagas Avada entenderá que hay una nueva actualización y comenzará automáticamente con el proceso.

Te aparecerá una pantalla como la que te muestro a continuación y Avada se encarga de todo. Déjalo trabajar tranquilo. Te irá mostrando todo el proceso y si se está llevando a cabo con normalidad, punto por punto.

Fíjate el pedazo de botón rojo. Cuando haya terminado el proceso haz click en el para actualizar Fusion Core. Esto es esencial o nada funcionará.

¿Qué ocurre si falla la migración?

Si el script fallase, lo más seguro es que sea debido a un problema de recursos en tu hosting. Casi con toda seguridad falta de memoria. Recuerda que Avada es un gran theme, pero también necesita un hosting adecuado.

En cualquier caso, los chicos de Avada, han tenido en cuenta esta posibilidad y han creado un sistema «manual» para continuar con el proceso.

Sigue los siguientes pasos:

• Paso 1: navega hasta Avada->System Status
• Paso 2: En la parte inferior aparece un apartado que dice «Run manual migration from Previus Version to version 4.0». Haz click en el enlace
• Paso 3: Al hacer click te redirigen a la pantalla de migracion manual. Espera mientras se completa el proceso.
• Paso 4: Cuando el sistema haya completado la migración haz click en «Take Me to Theme Options». Esto te llevará al nuevo panel de opciones de Avada.

Nota importante: Casi todas las actualizaciones de gran calado como esta, implican el tener que ir afinando detalles que van surgiendo. El 18 de Abril, han liberado la versión 4.01, que corrige algunos pequeños errores e incompatibilidades con el Panel de Redux. Si has actualizado a la versión 4.0 es conveniente que actualices con este parche para asegurar el buen funcionamiento de la web.

El nuevo Panel de control

El nuevo panel de opciones que te encuentras al actualizar Avada te ofrece una interfaz mucho más ordenada y fresca. Colores similares a la del propio WordPress. Es casi como una extensión de la misma. Este era un paso demandado y necesario.

Todo ha sido reordenado y segmentado en opciones principales y a su vez en subsecciones. Esto nos facilita mucho las tareas de configuración. Ahora todo está en su sitio y para poder cambiar por ejemplo aspectos de la tipografía y los colores, no hay que estar saltando de opción en opción, lo cual podía resultar caótico para los usuarios que se inician en Avada.

Principales novedades

Ahora solo aparecen las opciones que están en uso. por ejemplo, si no tienes instalado Woocommerce, no aparecerá las opciones de configuración de Woocommerce.

Múltiples opciones de configuración personalizada

Ahora es posible personalizar las fuentes, los iconos y las redes sociales. De tal manera, que es posible subir diferentes fuentes para luego incluirlas en cualquier parte de la web. Esto es muy interesante, porque evita tener que cargarlas desde Google, lo cual aporta mayor optimización evitando la carga de recursos externos.

Controles de la tipografía agrupados

Antes era necesario saltar por varias opciones del menu para poder configurar las fuentes. Ahora todo está agrupado y reordenado para que la configuración sea muy fácil, efectivo y sobre todo rápido. Desde el mismo item puedes configurar, el tipo de fuente, el color, estilo y grosor, tamaño, altura, margen…

Nuevo selector de colores

Ahora el selector de color es más intuitivo y puedes en origen elegir el tipo de transparencia. Antes se podía hacer, pero incluyendo el código rgba. Ahora ya nada de esto es necesario. Me imagino que poco a poco lo irán extendiendo a los shortcodes en Fusion Builder.

Sistema de búsquedas de opciones

Esta me parece una idea buenísima. Han creado un sistema de búsquedas para el panel de control. De esta manera si hay algo que no encuentras, puedes buscarlo y de forma automática te lleva al apartado donde aparece la palabra que has incluido en la búsqueda. Esto de cara al futuro puede ser increíblemente efectivo, porque sin lugar a dudas el panel volverá a crecer y cada vez habrá más y más opciones. Encontrarlas será cuestión de segundos.

Más posibilidades

Como ya sabrás, Avada ofrece desde hace tiempo integración con numerosos plugins, algunos de ellos de manera especial. Desde el propio panel podrás configurar ciertas opciones de Events Calendar, Woocommerce y Contact 7. Sin embargo, no todo el mundo necesita estos plugins y lo que han hecho es que estas opciones sean visibles solo si estos están instalados, de lo contrario no aparecerán.

También han mejorado el sistema de importación y exportación de la propia configuración del panel. De esta manera no es necesario volver a configurar el theme en caso de desastre o para una nueva instalación. En cuestión de segundos tendrás Avada tal y como lo tenías.

Por último cabe destacar la segmentación y organización, que esta vez es natural y muy intuitiva. Todo está perfectamente organizado. Esto favorecerá la curva de aprendizaje a cualquier persona que quiera trabajar con Avada.

Nuevo header

Algo que ya estaban tardando en hacer era ofrecer nuevas posibilidades en cuanto a tipos de encabezados (headers). Quizá Avada se estaba quedando un poco anticuada, en el sentido de que los encabezados eran muy clásicos. Ahora han incluido un nuevo header con un estilo minimalista, en el que el menú queda reducido a un simple botón y si se hace click, se abre a pantalla completa. Un acierto para aquellos que quieran darle un aspecto más vanguardista y a su vez minimalista a su web.

Además ahora han agregado nuevas posibilidades en cuanto al juego del encabezado fijo y del menú con las tansparencias, algo que en cuanto a diseño va a permitir rizar un poco más el rizo.

Nueva opción de galería con Lightbox

Ahora es posible crear una galería de fotos con el shortcode de Image Frame en la misma página con mucha más facilidad utilizando una nueva opción llamada Gallery ID. El proceso es tan simple como crear un grupo al que llamaremos como queramos, por ejemplo galeria 1. En cada imagen que utilicemos con Image Frame, le añadimos en el apartado Gallery ID el nombre. Así, cuando hagamos click en cualquiera de esas imágenes, se abrirá el Lightbox, pero con todas las imágenes del grupo.

Nueva demo para portfolios fotográficos

Avada ya dispone de una buena cantidad en cuanto a demos, listos para instalar y usar. En la nueva versión 4.0 ahora se añade una nueva demo en la que tendrás la posibilidad de ver el funcionamiento del nuevo header. Muy interesante para portfolios fotográficos o similares.

Mejoras en el uso de la memoria y la optimización

Desde hace tiempo los desarrolladores de Avada han ido mejorando y dotando al theme de mejoras importantes en el código que permitiesen una mejor optimización. Ahora dan un paso más y mejoran la carga de imágenes (algo verdaderamente esencial) mejorando cuantitativamente el uso de los recursos en cuanto a memoria.
Con el uso de «srcset» siempre se carga el tamaño de imagen apropiado en los grid del blog, timeline y archivos. Por otra parte tanto en el front-end como en el backend se cargan los archivos solo cuando es necesario.

Los campos de valores para los archivos Retina han desaparecido

Otra cosa que agredecerás (yo por lo menos si) es que ya no es necesario introducir los valores de las imágenes para pantallas Retina. Por ejemplo, con el logo había que introducir el ancho y alto del formato normal 1x y luego el ancho y alto para la versión retina 2x. Ahora Avada ya lo hace automáticamente y establece los valores correctos para ambos formatos.

La sección de widgets ha sido movida al área de Widgets

Ya sabes que en Avada puedes crear tantos widgets como quieras. Tenias una sección donde los creabas y luego en el área de widgets los configurabas. Ahora han movido todo para el área de widgets y puedes crearlos desde ahi. De esa manera no es necesario estar bailando de un lado para otro. Esto en definitiva aporta comodidad, facilidad y rapidez en el trabajo.

Duplica con un solo click un slider o slides en Fusion Slider

Para facilitar un poco más las cosas, ahora podrás duplicar a golpe de click un slider completo o cualquier slide. Esto te ayudará a no perder tiempo creando nuevos slides en tus presentaciones. Simplemente con cambiar la configuracion o la imagen será suficiente.

Otras pequeñas novedades de Avada 4.0

• Con las fuentes personalizadas puedes utilizar cualquier fuente en cualquier entorno.
• Mejoras en el uso de las imágenes de Event Calendar.
• Mejoras en la importación y exportación de la configuración de Avada.
• Incorporación de un editor CSS, lo cual facilita la escritura de código en CSS personalizado.
• Se añade Xing al paquete de Iconos de redes sociales.
• Nuevas posibilidades de configuración para los Iconos Sociales con propios colores de la red social.
• Sistema de auditoria de actualizaciones incorporado en System status.
• Nuevos Patterns para los backgrounds.
• Actualización de Revolution slider y Layer slider a la última versión.
• Nueva configuración para el borde del footer y el copyright.
• La cabecera superior ahora permite opacidad.
• Mejoras en la compatibilidad de idiomas.
• Página de contacto rediseñada.
• Diseño limpio de Woocommerce rediseñado y mejorado.
• Actualizados todos los archivos de idioma.