Icon - Flipbox

Flipbox element in the shopping experiences

With this element, you can design content to flip when hovered over. This type of interaction draws users' attention and allows you to present information in a creative way.

Essentially, after mouse hover, the back of the box is displayed / the entire box is flipped with an animation.

General Settings

Function	Description
Animation Effect (1)	Here you can set the animation effect.
Direction of Animation (2)	Horizontal or vertical.
Linking (3)	Linking

Layout Settings

Function	Description
Height of Flipbox (1)	A fixed height is set here. Make sure your content is adjusted accordingly.
Vertical Alignment (2)	The vertical alignment of all content within the flipbox
Horizontal Alignment (3)	The horizontal alignment of all content within the flipbox

Front Side Settings

Function	Description
Background Type (1)	Choose color, image, or gradient
Icon (2)	Icon

Back Side Settings

Function	Description
Content of the Box (1)	The content displayed on the back side. TWIG variables are also possible.
Button (2)	Button
Entire Box Clickable (3)	Not only the button, but also the box itself is linked

Responsive Settings

Elements per Row

SEO Settings

SEO