El Fusion Builder es el page builder de la plantilla Avada que viene incluido en la plantilla.
Los desarrolladores de Avada tienen intención de crear un plugin del Fusion Builder para que pueda ser utilizado en cualquier plantilla.
Con la última versión del Fusion Builder que es la versión 5, se ha renovado completamente el constructor con respecto a su versión anterior, se ha hecho mucho más intuitivo y flexible.
El page builder de Avada hoy en día es un page builder de tipo backoffice, es decir no vemos los cambios en tiempo real. Para ver los cambios hay que hacer pre visualizaciones.
En cualquier caso, Avada tiene intención de añadir al constructor la opción de un formato visual tipo frontend.
QUIERO LA PLANTILLA AVADA
Otros post:
ÍNDICE DEL POST
- 1.- Activación del fusion builder de Avada
- 2.- Estructura del page builder de la plantilla Avada
- 3.- Contenedores en Fusion Builder de Avada
- 4.- Las columnas en el page builder de Avada
- 5.- Mega guía de todos los elementos del page builder de Avada
1.- Activación del fusion builder de Avada
Para utilizar el fusion builder de Avada en una página tendremos que hacer clic en el botón: “Use Fusion Builder”.
De esta manera desaparecerá el editor por defecto de wordpress y aparecerá el page builder de la plantilla Avada.
Interface del Fusion Builder / El page builder de Avada
El page buider de Avada o Fusion builder estará disponible en: páginas wordpress, entradas blog, Portfolio y FAQ.
Podemos hacer que el Fusion builder no se muestre en alguno de estos tipos de páginas desde el panel de administración: “Fusion builder > Settings”
Desde «Fusion builder > Settings» podremos activar o desactivar el Fusion builder de manera general y activar o desactivar elementos.
2.- Estructura del page builder de la plantilla Avada
El page builder de la plantilla Avada está formado por 3 tipos de estructuras:
i.- Contenedores (container): los contenedores o containers son las estructuras más grandes del page builder de Avada.
En una página puede haber 1 o más contenedores. Los contenedores marcarán las diferentes secciones de una misma página.
En el interior de los contenedores colocaremos las columnas en una distribución determinada y dentro de las columnas colocaremos los elementos.
ii.- Columnas (columns): las columnas dividen el contenedor en varias partes. Existe una amplísima variedad de posibles distribuciones de columnas dentro de un contenedor. De hecho el page builder de Avada es uno de los constructores con una variedad más amplia de distribuciones y eso lo veremos un poco más adelante.
Además el Fusion builder de Avada es de los pocos page builders para wordpress que permiten anidar columnas dentro de una columna.
Estructura de contenedores y columnas en el builder de Avada
iii.- Elementos (element): Los “elementos” son las estructuras finales del page builder de Avada. Los elementos o elements se colocan dentro de las columnas.
En una columna puede haber 1 elemento o varios. Para insertar una columna debemos haber añadido previamente una columna.
En las columnas aparecerá un botón “+ Element” en los que al hacer clic se desplegarán en una ventana emergente los posibles elementos que podremos añadir a dicha columna.
Existe una gran variedad de diferentes elementos con diferentes funcionalidades, que veremos más adelante. Concretamente 46 elementos diferentes como son: Alert, blog, button, Checklist, code block, Content boxes, Countdown, etc. más 3 elementos específicos para woocommerce que son: Woo Carousel, Woo Featured y Woo Shortcodes.
Algunos de los elementos de que dispone el Fusion Builder de Avada
QUIERO LA PLANTILLA AVADA
3.- Contenedores en Fusion Builder de Avada
Los contenedores (container) son los bloques principales y más grandes que utiliza el page builder de Avada.
Podemos tener todos los contenedores que queramos en una sola página de wordpress.
Dentro de un contenedor introduciremos una serie de columnas (columns) y elementos (elements) dentro de las columnas.
Habitualmente cuando creamos una página con wordpress dividimos la página en varias zonas con diferentes fondos para separar las diferentes zonas dentro de la página. Pues bien, esas diferentes zonas las crearemos con diferentes contenedores (containers).
3.1.- Cómo añadir un contenedor (container) con el Fusion Builder
Cuando activas el Fusion Builder en una página te aparecerá la interface de gestión del page builder de Avada.
Para añadir el primer contenedor deberás hacer clic en el botón azul “+Container”.
Una vez que hayas añadido el primer contenedor, para añadir otro contenedor sitúa el ratón en la parte inferior derecha del contenedor y te aparecerá un botón “+Container”.
Botón para añadir un nuevo contenedor a la página
3.2.- Opciones de configuración de los contenedores (containers) del Fusion Builder
Para configurar un contenedor del Fusion Builder de Avada haremos clic en el icono en forma de “pluma” en la parte superior derecha del contendor. Si pones el ratón sobre la pluma te aparecerá la leyenda: “Container Settings”.
Dentro de la configuración de los contenedores tenemos 3 pestañas: General, Background (fondo), y Design (Diseño).
3.2.1.- Opciones de configuración “General” de los contendores del Fusion Builder
En las opciones generales tenemos las siguientes opciones principales:
i.- Set column to equal Height: establecer que todas las columnas que haya dentro del contenedor tengan la misma altura. Esto se visualiza y entiende fácilmente si pones un color de fondo a cada columna, algún elemento de texto y pruebas con esta opción.
ii.- Name of menú anchor: aquí podremos poner un nombre a la sección, que será el que tendremos que utilizar desde el menú para crear una web en una sola página con Avada.
iii.- Container Visibility: podemos ocultar o desactivar la sección en: móviles (small screen), tablets (médium screen) o escritorio (Large screen). Selecciona donde quieres que no se muestre.
3.2.2.- Opciones de configuración “Background” de los contenedores de Avada
En la pestaña background encontraremos principalmente opciones generales de diseño de fondo del contenedor como:
i.- Container Background color: Seguramente la opción más importante de configuración de una sección. Desde aquí podremos seleccionar un color de fondo para todo el contenedor.
ii.- Background image: desde aquí podremos subir una imagen de fondo para la sección
iii.- Video MP4, Video WebM y Video OGV: desde estas opciones podremos subir vídeos en diferente versiones para que aparezcan como fondo del contenedor. Hay que llevar mucho cuidado con estas opciones ya que ralentizan notablemente la carga de la página donde se incluyen dichos vídeos.
iv.- You tube / Vimeo Video URL or ID: Opción mucho más interesante que las anteriores para añadir un vídeo, ya que al cargarse directamente desde YouTube o Vimeo el tiempo de carga será mucho menor, y el esfuerzo lo realizarán los servidores de Youtube o Vimeo y no nuestro hosting.
3.2.3.- Opciones de configuración “Design” de los contenedores de Avada
En esta pestaña encontraremos opciones de márgenes exteriores (margin) y márgenes interiores (padding):
i.- Container border size: esta opción sirve para mostrar un borde superior e inferior en el contenedor. Una vez establecido el ancho del borde nos aparecerán dos nuevas opciones. Una denominada (Container border color) donde estableceremos el color del borde y otra denominada (Border style) donde estableceremos si es una línea continua (solid) , discontinua (dashed )o de puntos (dotted).
ii.- Margin: aquí estableceremos los márgenes exteriores del contenedor superior e inferior.
iii.- Padding: aquí estableceremos los márgenes interiores del contenedor (superior, derecho, inferior e izquierdo)
QUIERO LA PLANTILLA AVADA
4.- Las columnas en el page builder de Avada
Las columnas son los elementos que se deben introducir en los contenedores para posteriormente poder añadir los elementos en su interior.
Cuando añadimos un contenedor veremos una ventana en la que se nos indicará que elijamos una distribución de columnas para el contenedor.
Avada dispone de uno de los constructores con más tipos diferente de posibles estructuras.
Algunas de las posibles distribuciones de columnas en los contenedores de Avada
Disponemos de las siguientes distribuciones:
1/ 1
1/ 2 + 1/ 2
1/ 3 + 1/ 3 + 1/ 3
1/ 4 + 1/ 4 + 1/ 4 + 1/ 4
2/ 3 + 1/ 3
1/ 3 + 2/ 3
1/ 4 + 3/ 4
3/ 4 + 1/ 4
1/ 2 + 1/ 4 + 1/ 4
1/ 4 + 1/ 4 + 1/ 2
1/ 4 + 1/ 2 + 1/ 4
1/ 5 + 4/ 5
4/ 5 + 1/ 5
3/ 5 + 2/ 5
2/ 5 + 3/ 5
1/ 5 + 1/ 5 + 3/ 5
1/ 5 + 3/ 5 + 1/ 5
1/ 2 + 1/ 6 + 1/ 6 + 1/ 6
1/ 6 + 1/ 6 + 1/ 6 + 1/ 2
1/ 6 + 2/ 3 + 1/ 6
1/ 5 + 1/ 5 + 1/ 5 + 1/ 5 + 1/ 5
1/ 6 + 1/ 6 + 1/ 6 + 1/ 6 + 1/ 6 + 1/ 6
5/ 6 + 0
4/ 5 + 0
3/ 4 + 0
2/ 3 + 0
3/ 5 + 0
1/ 2 + 0
2/ 5 + 0
1/ 3 + 0
1/ 4 + 0
1/ 5 + 0
1/ 6 + 0
4.1.- Opciones de configuración de las columnas con Avada
Para ver las opciones de configuración de una columna deberás hacer clic sobre el icono en forma de pluma que aparece en la parte superior derecha de dicha columna.
Verás tres pestañas diferentes: General, Design y animation
4.1.1.- Opciones de configuración de la pestaña “General” de las columnas
i.- Column spacing: desde aquí estableceremos el espacio de separación entre una columna y la contigua.
ii.- Center content: esta opción sirve para centrar el contenido de la columna verticalmente (no horizontalmente).
iii.- Hover type: desde aquí podremos establecer el efecto hover que queremos para los elementos enlazables situados en el interior de la columna. El efecto “hover” es el que se produce cuando ponemos el cursor sobre un elemento con un link o enlace.
iv.- Link URL: Aquí podemos establecer un enlace de destino si hacemos clic sobre la columna.
v.- Ignore Equal Heights: recuerda que en las opciones de configuración del contenedor podíamos establecer que todas las columnas tengan la misma altura. Pues con esta opción podemos establecer que esta columna no tenga la misma altura que el resto de columnas del contenedor.
vi.- Column Visibility: al igual que en los contenedores aquí estableceremos los tipos de dispositivos en los cuales no queremos que se muestre esta columna.
4.1.2.- Opciones de configuración de la pestaña “Design” y “Animation” de las columnas
i.- Background color: desde aquí podremos establecer un color de fondo para la columna que estamos personalizando.
ii.- Background Image: desde aquí podremos establecer una imagen de fondo para la columna
iii.- Border size: desde aquí podremos establecer un borde de color alrededor de la columna. Al marcar el ancho del borde nos aparecerán dos nuevos selectores para color y tipo de línea.
Podemos personalizar que el borde aparezca alrededor de toda la columna o solo en algunos laterales con la opción: Border position
iv.- Padding: sirve para establecer el margen interior de la columna
v.- Margin: sirve para establecer el margen exterior de la columna
En la pestaña “Animation” (Animación) tenemos una única opción:
i.- Animation Type: desde aquí podremos elegir qué tipo de animación se utilizará para mostrar la columna.
5.- Mega guía de todos los elementos del page builder de Avada
Para añadir un elemento (element) a una columna tendremos que hacer clic sobre el botón “+ Element” de la columna en la que quieras insertar el elemento
Cuando hagas clic en el botón “+ Element” te aparecerá una ventana con todos los posibles elementos que podemos añadir a la columna.
QUIERO LA PLANTILLA AVADA
Vamos a ver una lista de todos los elementos disponible de la plantilla Avada:
i.- Alert (Alerta): es un rectángulo que sirve para avisar o alertar de algo. Podremos elegir entre diferentes tipos de avisos según cual sea su finalidad, lo que afectará al diseño de dicho rectángulo.
El rectángulo dispondrá de un “aspa” para que el visitante pueda cerrar el aviso y se podrán aplicar efectos de movimiento sobre el rectángulo.
Aquí puedes ver varios ejemplos del elemento Alert
Ejemplos del elemento Alert del Fusion Builder de Avada
ii.- Blog: con este elemento podremos añadir un bloque en el cual aparezcan entradas de blog. Podremos elegir entre múltiples diseños, filtros y opciones de configuración.
Puedes ver algún ejemplo aquí: Elemento blog Avada
iii.- Button (Botón): con este elemento podremos crear y añadir botones. Los botones son muy personalizables y también se les puede aplicar efectos de movimiento.
Aquí puedes ver algunos ejemplos: Botones Avada
iv.- Checklist (lista): con este elemento podremos establecer una lista de textos precedidos por un icono a modo de lista para chequear. Puedes ver un ejemplo aquí: Elemento Checklist
Ejemplo elemento Checklist del page builder de AVADA
v.- Code block: este elemento sirve para introducir código HTML
vi.- Content Boxes (Cajas de contenido): este elemento sirve para añadir un bloque compuesto de un icono + un título + texto descriptivo + un botón.
Este tipo de bloques se utilizan asiduamente en las páginas web de hoy en día. Este elemento dispone de un montón de opciones de personalización. Aquí puedes ver un montón de ejemplos: Elemento Content Boxes Avada
Elemento Content Boxes del page builder de Avada
vii.- Countdown (cuenta atrás): con este elemento de Avada podremos crear un bloque con una cuenta atrás (semana + días + horas + minutos + segundos) hasta una determinada fecha y hora. Puedes ver un ejemplo aquí: Elemento Countdown Fusion Builder
Elemento Countdown del Fusion Builder
viii.- Counter Boxes (caja con contador): con este elemento del Fusion Builder podremos añadir cajas con texto + icono + contador. El contador partirá desde cero hasta el número que establezcamos en pocos segundos. Puedes ver aquí algunos ejemplos: Elemento Counter Box
ix.- Counter Circles (Contadores circulares): un círculo en movimiento en tiempo real hasta una determinado porcentaje y con un elemento central es lo que permite hacer el elemento Counter Circles. Puedes ver aquí algunos ejemplos: Elemento Counter Circles Avada
x.- FAQ (Preguntas frecuentes): elemento formado por botones desplegables (título + descripción) que además podremos clasificar en diferentes pestañas. Recurso habitualmente utilizado para crear una página de preguntas frecuentes. Puedes ver aquí un ejemplo: Elemento FAQ Fusion Builder
xi.- Flip Boxes (cajas que dan la vuelta): con este elemento podremos crear cajas con texto. Si ponemos el ratón sobre dichas cajas están se dan media vuelta y muestran otro contenido diferente. Además de texto se pueden mostrar imágenes e iconos. Puedes ver un ejemplo aquí: Flip Boxes
xii.- Font Awesome Icon (Iconos): con este elemento podrás mostrar un icono de la Fuente Awesome. En el siguiente enlace puedes ver todos los iconos y su nombre: Font Awesome Icon Avada
xiii.- Fusion slider: Elemento para mostrar un slider que previamente debe haber sido creado desde la herramienta Fusion Slider
xiv.- Gallery (galería de imágenes): con este elemento podremos crear galerías de imágenes. Al hacer clic sobre una imagen aparecerá una ventana emergente en la que podremos pasar el resto de imágenes. Puedes ver un ejemplo aquí: Gallery Avada
xv.- Google Map: Con este elemento podrás añadir el típico mapa de Google. Puedes ver ejemplos aquí: Google Map Avada
xvi.- Image Carousel (Carrusel de imágenes): con este elemento podremos crear un carrusel de imágenes. Imágenes que aparecen en una sola línea y que se pueden pasar como un slider, pero que a diferencia de este muestran varias imágenes. Aquí puedes ver un ejemplo: Elemento Carrusel Imágenes Avada
xvii.- Image Frame (Imagen): con este elemento de Avada podremos añadir una imagen con diferente efectos hover de movimiento y marco. Mira un ejemplo: Elemento Image Frame
xviii.- Lightbox: con este elemento podremos crear un lightbox con una imagen o un vídeo.
xix.- Menu anchor: este elemento es un id de anclaje que podremos utilizar para fijar posiciones en una web realizada en una sola página.
xx.- Modal: Con este elemento podremos crear una ventana emergente que se muestre al hacer clic sobre un determinado elemento. Puedes ver un ejemplo aquí: Elemento Modal
xxi.- Modal text link: con este elemento podemos crear el enlace para abrir el elemento Modal del apartado anterior. Es decir, con este elemento crearemos el lanzador.
xxii.- Person (persona): con este elemento podremos crear la típica página de “Equipo” con las imágenes, descripción y enlaces sociales de los miembros del equipo que forma la empresa. Puedes ver un ejemplo aquí Elemento team member
Elemento Team member de la plantilla AVADA
xxiii.- Porfolio: este elemento del Fusion Builder de Avada sirve para mostrar un porfolio clasificado y filtrado por categorías o a través de un carrusel de proyectos. Puedes ver una demo aquí: Elemento Porfolio
xxiv.- Post slider (slider entradas): este elemento sirve para mostrar entradas del blog a modo de slider. Aquí puedes ver varios ejemplos: Elemento post slider
xxv.- Pricing table (tabla de precios): este elemento de Avada sirve para mostrar la tradicional tabla de precios que vemos por todo internet. Aquí puedes ver un ejemplo: Elemento Pricing Table
Elemento pricing table de Avada
xxvi.- Progress bar: con este elemento o módulo de Avada podrás crear barras con movimiento que muestran datos con diferentes unidades.
Puedes ver un ejemplo aquí: Elemento Progress bar
xxvii.- Recent Posts: elemento muy interesante que sirve para mostrar entradas de blog en diferentes formatos y estructuras. Puedes ver un ejemplo aquí: Elemento Recent posts
xxviii.- Section Separator: elemento para incluir diferente formas cuya finalidad sea la de separar diferentes secciones de contenido de una página.
xxix.- Separator: elemento visible o no visible que separa varios elementos o contenidos. Puedes ver un ejemplo aquí: Elementos Separator
xxx.- Sharing box: elemento que aporta una caja con iconos de compartir contenido en redes sociales.
xxxi.- Slider: elemento para crear un slider de imágenes
xxxii.- Social links: elemento de Avada para mostrar iconos de redes sociales con su correspondiente enlace. Puedes ver ejemplos aquí: Elemento Social Links Avada
xxxiii.- Soundcloud: este elemento sirve para añadir postcasts de Soundcloud a través de la introducción de su url
xxxiv.- Table (tabla): elemento que genera el código html necesario para crear una tabla de forma sencilla sin saber html.
xxxv.- Tabs (pestañas): con este elemento de Avada podrás mostrar contenido (texto + imágenes) clasificado en diferentes pestañas. Puedes ver un ejemplo aquí Tabs
xxxvi.- Tagline box: elemento de call to action (llamada a la acción) con diferentes diseños, rebordes y sombreados con título, descripción y botón. Puedes ver ejemplos: elemento Tagline box
Call to action de Avada
xxxvii.- Testimonials (testimonios): con este elemento se pueden crear los típicos testimonios de clientes que vemos en cientos de web por internet. Puedes ver un ejemplo: Testimonials
xxxviii.- Text block: un bloque fundamental que sirve para introducir texto con el típico editor de wordpress.
xxxvix.- Title: con este elemento podremos crear títulos y podremos definir el tipo de título en HTML.
xl.- Toggles: con este elemento de Avada podrás crear los típicos contenidos desplegables que vemos en muchos sitios web. Podrás configurar para que se comporten como un acordeón (cuando un elemento se despliega se pliega el anterior abierto) como como desplegables independientes. Puedes ver un ejemplo: Toggles
xli.- User Login, los password y register: con estos elementos podremos crear una caja de acceso para iniciar sesión, gestión de usuario y opción de recuperación de contraseña para el inicio de sesión.
xlii.- Vimeo: elemento para insertar un vídeo de Vimeo
xliii.- Widget área: elemento para insertar un área de widgets en el cual posteriormente podremos insertar widgets desde “Apariencia > Widgets”
xliv.- Youtube: elemento para insertar un vídeo de YouTube
Soy Blogger y formador profesional. Me gustaría que este blog te sirviera para conocer más de cerca el mundo del diseño web y de WordPress. Mi proyecto online es una plataforma de formación online tipo membership site, denominada cursotiendaonline.com donde podrás acceder a todos los cursos por solo 10 €/mes
Joaquín, enhorabuena por la web. Bien explicadito todo y breve. Tengo un problemilla: En Avada 7.1.1. Si bien cuando importo de youtube el vídeo arranca y funciona en el ordenador, en el móvil ni arranca ni hace nada. Cómo podría solucionarlo? Gracias
Hola Joaquín muchas gracias por tu blog y valiosas aportaciones.
Tengo un «problema» sin resolver sobre el que espero aportes luz.
Tengo una web en AVADA. En una de las páginas he colocado un TABS (pestañas) en horizontal y justificado.
El tema es que los titles de algunas de las pestañas son más largos que otros y crean 2 lineas, cosa que queda muy feo ya que se ve irregular.
Existe alguna posibilidad de «forzar» las pestañas de 1 linea para igualar alturas?
Hola buenas tarde… Tengo una duda, Como pudo anidar tabs en el thema Avada
Hola Joaquín,
Estoy haciendo un blog y en la página donde sale solo la foto y el texto corto, no sé como añadir los puntos suspensivos. Me dice que escoja el número de palabras que quiero que aparezcan pero se me corta en ese número y queda bastante mal…
Me podrías ayudar por favor.
Gracias!!
Tengo un problema con las tabs de esta web
http://www.prolibertas.org/que-hacemos/inclusion-social/programas-para-personas-reclusas-y-ex-reclusas/Antes iban bien, ahora sólo funciona el primer icono, los demás salen vacíos.
¿Me podrías ayudar?
Gracias
Buenas.
Pero ¿has comprobado si tienes contenido añadido a todas las pestañas?
un saludo
Hola, por favor, me puedes indicar si puedo crear una página en Avada en la pueda incluir un programa que cree con html5, css3, javasript y php? Pide primero Usuario y Contraseña y si son correctos despliega el menú principal. Se puede incluir en una página de Avada?
Hola Erick.
Consulta esto mejor en el soporte de Avada
Hola! Quiero poner un título que tenga un recuadro y no líneas. ¿Cómo debería hacer?
Buenas.
Mira a ver si con un elemento título o similar tienes la opción de poner bordes
Hola agradecida con tu blog es muy explicativo felicidades. mil buenos deseos para ti. Tengo una duda si puedes ayudarme por favor seria fenomenal. Quiero poner dos texto sobre una imagen uno en la parte derecha y el otro en la izquierda.
Gracias de antemao.
Buenas.
1.- Añade un contenedor (sección) y pon la imagen de fondo
2.- Añade tres columnas y pon un texto en la primera y la última columna
un saludo
Graciasss por responder. Así lo hice, pero pensé que había otra manera como mover el texto de forma flotante, me explico pinchar el texto y colocarlo en cualquier lado de la imagen como en photoshop o powerpoint.
Eres lo máximo, Recomendado 100 % .
Un abrazo
Buenas y gracias por tus palabras.
No es posible, ni con la plantilla Avada ni con ninguna otra plantilla de WordPress. Lo que describes es más un diseño tipo WIX, cuya interface de construcción esta mucho más desarrollada, pero que tiene muchos inconvenientes de otras tipologías. Aquí tienes más info
Hola Joaquín, la plantilla que utilizo en WordPress es Avada. Me ha desaparecido la imagen de cabecera de la sección Conferencias, no sabemos porqué y lo peor es que no podemos subir otra imagen porque no da la opción.
¿Se te ocurre qué podemos hacer?
Muchas gracias
Buenas.
Parece que esa página es la del calendario de eventos del plugin «The events calendar». No sé de que manera estabas mostrando en esa página una imagen de cabecera.
Mira a ver con las opciones de página de Avada de esa página en concreto.
Hola Joaquin. Tengo una web realizada con Fusion Builder, y un día quise agregarle información a una pagina y es como que Fusion Builder no lo tomará. Me aparece en html y si hago una pagina nueva no aparece el Fusion Builder. Sabras que podrá ser lo que pasa?
Muchas gracias!
Hola Florencia.
Pues tiene pinta de ser algún problema de incompatibilidad entre la versión de Avada y la versión de WordPress.
¿tienes ambos actualizados a la última versión?
Saludos Joaquin, excelente tu blog vaya mis felicitaciones. Queria hacer una consulta a ver si me pueden ayudar. TEngo unas imagenes de portafolio, el cuando colocas el mouse el hover es de color verde por defecto, he revisado el fusion builder de arriba a abajo y no consigo el apartado para cambiarle el color y la forma del efecto, si me podrian ayudar estaria muy agradecido… Exitos
Buenas.
Si no encuentras ninguna opción en el Fusion Builder, mira a ver si es una opción del tema. Mira en theme options (Opciones del tema)
Buenas tardes, estoy tratando de mover una columna de un contenedor a otro. El sistema lo permite, pero cuando voy a guardarlo, me dice que debo guardarlo como Global Element y me pide un nombre.
Que ocurre con el contenedor donde estaba la columna ? también hay que guardarlo con otro nombre, o lo estoy haciendo mal ?.
Hola Paco,
Acabo de probar a realizar lo que comentas de mover una columna de un contenedor a otro y no tengo ningún problema para hacerlo. No me sale ningún cuadro de diálogo que me de la opción de guardar.
No sé porque a ti te sale esa opción de gurdar como global element.
PD: Perdón por tardar en contestar. He estado una semana de vacaciones.
Hola
estoy haciendo una web para un restaurante
la carta va en dos columnas el problema que tengo es con los saltos de párrafo al estrechar la página para ver como se vería en el móvil me baja el precio y quiero que se mantenga en la misma linea
ejemplo:
ENSALADA TRADICIONAL 10 €
Tomate, lechuga, espárragos atún y huevo cocido
el texto de tomate lechuga si debería de bajar pero la linea donde va el precio no
lo he intentado de mil maneras y no lo consigo la única forma que veo es con una tabla pero no me deja modificar el diseño
he visto varias webs que funciona como te digo se expande y se contrae sin bajar
Gracias y a ver si me puedes ayudar
Buenas,
Prueba como se vería en un móvil real, no pruebes estrechando el navegador en el ordenador
Hola de nuevo de paso una demo como ejemplo de lo que quiero conseguir
en la web que estoy haciendo con Avada
http://bliccathemes.com/themes/pronto/demo1/classic-menu/
Como podrás comprobar tanto en la web como en el móvil el precio se mantiene en la misma linea que el producto principal como si estuviera justificado al 100% de la columna como ya te dije le he dado mil vueltas y no lo consigo he instalado varios pluging de menús pero me dan problemas con el fusion builder. Me da la sensación de que tengo que añadir algo de código si me pudieras decir que es lo que tengo que poner y donde te lo agradeceria un montón
Muchísimas gracias por tu atención.
Hola Elsa,
veo a que te refieres, pero no se como se podría configurar eso para que no haya saltos de línea en los diferentes dispositivos.
Seguramente tendrías que buscar algún diseño que se pudiera añadir al builder o algún tema hijo para avada que implementara esa característica.
Hola Joaquin, te hago la siguiente consulta, sabes como cambiar el tamaño del header al momento de deslizar hacia abajo una web?
Saludos.
Hola Alejandro,
La opciones que ofrece Avada con respecto al header o menú flotante o sticky header están en: «Avada > Theme Options > Header > Sticky Header», y no existe ninguna opción para gestionar la altura del header en esa posición flotante del menú (que se produce cuando se hace scroll).
Si tienes la posibilidad de subir un logo específico para la posición flotante o sticky del menú en: «Avada > Theme Options > Logo > Sticky header logo». Prueba a subir un logo más pequeño y a reducir los márgenes del logo (logo margins). A ver si de esta forma se reduce la altura del header
un saludo
Necesito poner un buscador en un contenedor de fusion builden en avada, encuentro el incono, le quiero dar funcion de buscador, me puedes ayudar?
Hola,
A través de un icono no se como se podría hacer,
yo lo que intentaría sería añadir un elemento «Widget area» con en el fusion builder, asociarlo con una zona de widget y en la zona de widget asociada incluir un widget de barra de búsqueda.
Tema actual
AvadaVersión: 5.2.3 desde hace pocos días que lo cambié
Tenía:
Avada ChildVersión: 1.0.0 (con esta plantilla y versión he hecho todo el web) ya con este no me funcionaba el 100% with
Pues tienes la última versión de Avada y de WordPress,
No se que puede ser lo que te ocurre, es muy raro.
Yo lo que haría sería crear un hilo en el foro de Avadad y escribir un ticket de soporte a Avada si tienes aún soporte:
1.- foro Avada
2.- Soporte Avada
(también probaría a desactivar plugins ya que puede ser que haya alguno que te esté interfiriendo con el fusion builder)
Hola Joaquín. gracias por la web. tengo un problema con la plantilla que no consigo resolver.
quiero hacer en algunos contenedores un fondo que sea el ancho completo del navegador, para eso, elijo la plantilla 100% with, pero la sorpresa viene cuando voy a previsualizar y esta vacía, aunque tenga todo los elementos colocados en los diferentes contedores. agradecería ayuda.
un saludo
Hola Sonia,
Efectivamente cuando quieres poner imágenes que tengan ancho completo en el navegador deber poner la plantilla con 100% width.
Pero que al seleccionar esta opción no te aparezca el contenido de la página es rarísimo.
No sé, solo se me ocurre que no esté actualizada la plantilla y el fusion builder tenga algún problema con tu versión de wordpress.
Es muy raro.
¿Con qué versión de plantilla y wordpress estás trabajando?
Estas son las versiones.
FUSION BUILDER 1.1.6
WORDPRESS 4.8.3.
Pero ¿qué versión de la plantilla Avada?
aquí te dejo un enlace al histórico de actualizaciones: Changelog Avada
Buenísimo. He aprendido mucho. Gracias!