This section of my website is focused on experimenting with what Avada can do. I try to stay active in the Avada Users group on Facebook and often answer questions with examples. I will use this section to collect the examples with simple instructions on how to recreate the item in question. One other thing I am considering is recreating the homepages of sites I run across that make me ask myself – “can I do that with Avada?”

The Challenges

This section will contain major challenges. Minor ones (basic css or other settings) will be in The Journal articles below.

Flip Box Margins

A request came in on the Facebook group asking how to get rid of the spacing (margins) at the bottom of flip boxes. Simple solution, but a lot of fun creating the demo page.

screenshot of triple panel sample

Triple image panel

A request came in on the Facebook group asking if it as possible to reproduce a section they had seen on another site – 3 images that brightened on hover and provide a link to other content. The answer is yes.

Custom Mega-Menu

An Avada user was faced with a dilemma, how to get 7 columns on a mega-menu without forcing a second row? The short answer is you can’t. Creating a custom mega-menu in Avada using the widgets and global elements.

Hover Columns

An Avada user wanted to know if it was possible to have the background colors change when a user hovers over the column. A little css goes a long way.

Make the Image Pop

An Avada user wanted to know if it was possible to recreate a look where an image appears to overlap another section without using css or negative margins.

CSS Play Button + Lightbox

An Avada user wanted to know if it was possible to add a video play button to a lightbox with only CSS. While it is not possible with the lightbox element, like most things with Avada, it is possible with very little effort.

Creating a Flag Card

An Avada user wanted to know if it was possible to create a flag card – content on one side and an image on the other to mirror something seen on another site. Example uses just Avada features and no custom css.

Avada related posts

Three Columns, Same Height

This is a fundamental challenge is that this represents some of the basic column functionality of Avada, but if you are new to it might not be "common sense."

Centering Content

This challenge came from a couple of questions in the facebook group: How do I center a 1/2 column in desktop and have it be full width on smaller screens? How do I keep an image focal point correct on mobile?

YouTube® Video Parameters

The YouTube video parameters allow you to control some of the features that the embedded player has enabled by default. Some have changed over the years and others are not quite as functional as one might like.