Flip Box

Looking for the best element to take your website’s next level? Look no further than FlipBox, the innovative addon that adds a touch of excitement and interactivity to your online presence. With FlipBox, you can transform static content into dynamic experiences that leave a lasting impression on your visitors.

Choose from a variety of stunning designs, transitions, and effects that best suit your content and audience. Whether you want a subtle and elegant flip or a bold and attention-grabbing one, FlipBox has you covered.

How to set up the Flip Box:

Step 1: Search and find Flip Box in the search box under the Elements Tab. After that, easily drag and drop the widget wherever you want inside the Elementor section

        

Step 2: This is how the element will look after inserting the AI Feature addon.

How to set up content for the AI Flip Box?

Under the content tab, you can configure the AI Flip Box.

GeneralIn the General Section,  you can use the drop-down menu to choose a Flipbox Type. Play around to see different animation effects available for Flipbox and choose the right for you.

Enable the Redirect Toggle to add a link to the Flip box that, when clicked, will direct visitors to the desired page.

LayoutHere you will see two options ‘Front’ and ‘Back’. You have the freedom to configure each part separately. Additionally,  simply drag and drop the Flip Box Elements to arrange them in a particular sequence, such as what should come first and second, or you can deactivate a particular element in the section by dragging from the Visible to Disable section.

Title: From the Title section, you can individually change your ‘Front’ and ‘Back’ Title. Enter the text in the title box, and choose an H1, H2, or other tag in the Title Tag section.

IconFrom this section, you can choose Icon from Icon Library or SVG Image. Besides you can set the View in the dropdown for both the front and back icon.

ButtonFrom the Button section you can customize the button for both Front and Back view individually. Select the Type of Button you want in the drop-down list. Put the text you want to appear in the button’s text box. Attach a link to the button so that it can direct viewers to the desired website/page. In the Alignment section, you can additionally align the button to the left, right, center, or justified. Besides, you can control the Icon size, position, and spacing in this section. Additionally, you can put an icon inside the button by choosing an SVG image or an icon from the Library.

ImageSet the desired image for the Front and Back in this section. Upload the image from Media Library or insert the image through the URL. In addition, you can select the image size in the dropdown or select custom in the drop-down to set your preferred width and height of the image.

ContentSet your content here for both the front and back of the Flip Box.

How to add Styles to the Flip Box?

Here we can add styles to each element added in the Flip Box. Let’s see each of them now.

FlipBoxYou can increase the height of the Box by adjusting the slider from left to right and aligning it any way you need it. For the Flip Box’s front and back, you can change the background type, padding, box-shadow, border radius, and border type.

TitleSet the Flip Box’s front and back color for the Title. Additionally, you can change the text’s typography and margin in this section.

Icon In this area, you can customize the ForeColor, Size, Rotate, Border Radius, and Margin for the Front and Back of the Flip Box.

ImageTo alter the image’s size, turn on the Resize toggle. Drag the scroll from right to left to increase the image’s size. Additionally, you may separately change the Background Colour, Image Spacing, Padding, and Border Type for the Flip Box’s Front and Back.

Button:  You can alter the Text Color, Background Color, Border Type, Width, Border Color, Border Radius, Padding, Margin, Typography, and Box Shadow of the button for the front and back of the flip box in this area.

ContentYou can adjust the margin, typography, and font color independently for the Front and Back of the FlipBox.

Don’t let your website be just another online presence. Stand out from the crowd and give your readers a reason to stay. Transform your content from mundane to extraordinary with the power of FlipBox. Elevate your brand, boost engagement, and leave a lasting impression on your visitors. Get ready to flip the script and revolutionize your website today!

Powered by BetterDocs

Enjoy the free pro experience. Help us by sharing our plugin. It will help us add more features in the future. 

Resources
Scroll to Top