This section of my sight 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.

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.

Check it out

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.

Check it out

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.

Check it out

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

Avada 7 is Live

Reading Time: 3 minutes The latest update from Theme Fusion has hit the streets. This may be the most impactful update yet with the addition of the header builder and flexbox.

Small Accessibility Error

I recently ran across a small typo in Avada that is causing an accessibility error to be raised. On line 112 of featured-image-first.php, the equal sign (=) is missing from the aria-label. This doesn't < 1