Banners

5th Avenue Banner shortcode comes with various layout and hover styles which you can explore below. You can set title, subtitle, content and choose from various button styles. Adjust you banner height for desktop and mobile, set title font size and colors for each element. You can adjust banner width by placing it in different columns and even in full height/width column and it will cover the whole area. You can check Banner shortcode settings in our Documentation.

Home
Elements
Banners
 

Theory Men's Trench Jacket, Saddle in Trend

$1,500

 
 
casual friday

Trench Jackets

Banner Styles:

Default and Left top

Below you can see example of two basic banner styles. The first banner is default with content on the left top and button at the bottom. The second one has all the content on the top left.

 
in the field of scente

A signature scent

 
in the field of scente

A signature scent

Control the size

Keep in mind that you can place banners in different grid columns to change their width or even place then in full-width/height column and they will cover the whole area. You can also set min height for desktop and mobile views. Below you can see example of the default banners in 2/3 and 1/3 columns.

new arrivals

The new collection of fragrances

Fine Jewelry

Banner Styles: Below Left Right and Below Centered

Below you can see example of two different banner styles when content if below the image. First banner with text on the left and button on the right and the second one has all the content centered and below each other.

 
in the field of scente

A signature scent

 

A signature scent

Banner Styles: All Centered

Below you can see various example of this very basic banner style. All content and button is centered vertically and horizontally.

 

Fine Jewelry

 

New Perfume

 

Meet the Maker

The World of Fragrances

Sale

Banner Styles: Indent Left / Right

Below you can see example of a banner (left one) with indent right. In this style image is narrower (84%) than the banner container so the text is placed partially outside the image. There are two variation of this banner when text on the left and on the right. You can also set button style with long left or right side to make it fit the style even better.

 
new arrrivals

The new collectionof fragrances

 
indent left

Banner with indent

Banner Style: Centered, Bottom

All content, title, subtitle and button will be placed centered at the bottom.
Below you can see this banner style in action: 3 columns with zoom hover, bordered hover or in carousel with offset.

 

Fragnance News

 

Meet the Maker

 

Gift Box

Banner Style: Left Bottom,  Top and Center

A couple more example of a simple banner content positioning. You can place it all top, bottom or vertically centered.

 

A signature scent

 

A signature scent

 

A signature scent

Banner Hover Animations

You can choose from 6 predefined hover styles: color overlay (you can also set color for overlay), image zoom with overlay, masked zoom (zoom in image and zoom our container), move image and border with custom color.

Hover style: Overlay
 
 

Meet the Maker

Hover style: Masked Zoom
 

New Perfume

Hover style: Masked Zoom
 

Fine Jewelry

 
 

Fine Jewelry

Hover style: Overlay
 

Meet the Maker

Hover style: Masked Zoom
 

New Perfume

Hover style: Masked Zoom