Divi Flip Cards plugin guide

I bet you’ve seen those amazing dynamic flip cards and are looking to implement it on your website.

Sure you can find the code snippets and get your hands dirty tweaking some HTML and  JS to get the desired result but why do that when you can simply use a simple plugin that will give you the ability to create beautiful animated blurb flip card in seconds?

In this article, I am going to guide you through the Divi Flip Cards plugin with a brief overview of how you can use it in your Divi website.

Contents

What is Divi Flip Cards and How much does it Cost?

Divi Flip Cards Walkthrough

  • How do I install and activate it?
  • How do I integrate the Divi Flip Cards module?

Divi Flip Cards Settings Overview

  • Content Settings
  • Design Settings
  • Advanced Tab

Divi Flip Card Important FAQs

My Final thoughts on Divi Flip Cards

What is Divi Flip Cards and How much does it Cost?

Divi-Flip-intro

Divi Flip cards is an intuitive plugin that makes it easier for Divi developers to create custom animated blurbs in a matter of seconds.

The plugin comes from B3 multimedia who have been developing plugins for a long time and are trusted and used by many Divi enthusiasts.

The Divi Flip cards Features Overview:

3D Boxed Mode:

box mode

This feature lets you create a seamless 3D box effect for your blurbs that give your website a dynamic effect. You also have the ability to control and customize the effect with more animation.

Visual Builder Integration:

flip box 2

A plugin that doesn’t work with Divi’s visual builder is redundant for it’s going to be extremely time-consuming to make changes and get them to look right on the backend. Fortunately, Divi Flip Card is well integrated with Divi’s visual builder allowing you to make changes on the front-end and see the flip go live within a few clicks.

Highly Customisable

The plugin makes customizing and styling your blurbs a breeze with settings that give you the ability to customize the front and back of the card to a great extent.

Customize the front and Back Blurb

divi flip box 6

Creating Animated Blurbs is a highly complex and time-consuming process because you have to style both the front and back of the card which means getting your hands dirty in some JS and Html. However, with the Flip cards plugin, you have the ability to customize both sides of the animated blurb in a matter of a few clicks!

So How much does Divi Flip Cards cost?

Divi Flip cards is a premium Divi plugin but it’s priced pretty low for the time and hassle it saves you. It is available for sale via two license options:

Regular License – €25.00

flip cards price

Used in one project for either personal and commercial use.

Extended License – €85.00

Used in unlimited projects for either personal and commercial use.

Note: Although both licenses have lifetime updates the regular license API will not work on more than one websites so make sure you to get the extended license if you’re going to use it on more than one website.

Divi Flip Cards Walk-through

How do I install and activate it?

install divi flip cards

You install it like every other plugin by simply going to your WordPress Dashboard then Plugins > Add New > Click Upload Plugin

How to Activate Flip Cards Plugin:

flip cards activation

After Installation doesn’t forget to activate the plugin or you won’t get any updates for this you need to go to Settings > Flip Cards Activation and then enter your API key and email associated with your B3 multimedia account.

How do I integrate the Divi Flip Cards module?

flip cards docs

After installation, you will see a new module in the Divi called “Flip Cards”. Using Divi Flip cards is the same adding a DIvi module into a section.

You simply click “Add new module” in a Divi Section than in the  “Insert Module”  menu select the “Flip Cards” module.

Note: Unlike many other Divi plugins, Divi Flip cards is well integrated with the visual builder so feel free to add it via both the front-end and back-end builder.

Divi Flip Cards Settings Overview

Content Settings

content settings

Divi Flip Cards makes it super easy to develop beautifully animated blurbs in Divi and has intuitive settings specifically for the front and back card.

In the content settings you have the following options:

  • Typography settings for heading and body
  • Icon and Button customizations
  • Stylize backgrounds for both front and back

Content Settings for Front Card:

All the settings in relation to the content but specifically for the front card of the Divi Flip animation.

“Front Card” Content

front card content

Here you add the Content i.e typography, icon, images etc. to the front of the animated blurb

“Front Card” Background

front background

Here you customize the front card background with a color, image or gradient.

Content Settings for Back Card:

All the settings in relation to the content but specifically for the back card of the Divi Flip animation.

“Back Card” Content

back card

Here you add the Content i.e typography, icon, images etc. to the front of the animated blurb

“Back Card” Background

back card background

Here you customize the back card background with a color, image or gradient.

Design Settings

design settings

The Design tab of the plugin is for the more visual customizations for the different blurb elements like texts, icons, card appearance, padding, animation and much more.

Once again the Design settings are divided specifically for the front and back side of the Blurb.

Front Card and Back Card Design Text options:

flip card settings

In this section, you can customize the typography style i.e change the color, Font, size alignment, shadow etc.

Front Card and Back Card Image/Icon Options:

front image icons

This lets you customize the icon and image i.e color, shape, shadow etc.

Front Card and Back Card Style options:

front card styles

This lets you add box shadow and border to the card.

Flip Animation Options:

flip animations

This is one of the core features in the Divi Flip cards plugin that lets you choose the effects (up to 4) to the flip animation effect with over 8 directions for the animation.

You also have the option to add the 3D title Effect for the back card with a glare

Image Filter Options:

image filters

If you have used an image instead of an icon to the animated blurb this section will allow you to add a filter to that image.

Sizing Options:

flip card sizing

This will let you control the image, content and module width with further customization to the alignment.

Box Filters:

box filters

This lets you choose a filter to the entire blurb animation card.

Advanced Tab

flip cards advanced settings

This tab is mainly for making custom advanced CSS changes to the element like adding a CSS ID and custom CSS to the different elements of the blurb.

Divi Flip Card Important FAQs

Error whilst activation:

Most errors are client sided and this fatal error on activation is mostly due to an outdated WordPress client of PHP server (minimum PHP 5.6)

Can I use the Regular Licence on more than one Website?

Like I’ve mentioned before Divi Flip cards updates via an API linked to your account so if you have the regular license you can have it activated only on one website. You most definitely need to opt-in for the extended license if you want to use this on more than one website.

Can I move the Regular License to another Domain?

Yes If you want to transfer license you have to deactivate the license on the current domain before transferring it to the new domain.

How do I receive support for the Plugin?

B3 Multimedia Solutions follows a ticket based support system which is accessible in your Accounts Section.

Divi Flip Cards round-up

If you are a freelancer or a Divi Enthusiast that’s constantly developing and keeping up to the industry standard of clean UI/UX friendly dynamic websites then Animated blurbs will give your websites a nice modern look.

Sure you can save money and spend time customizing the HTML code to develop custom Divi flip card but if you’re going to do it more than once you’re going to end up having to do the process a lot of times and this means a lot of time that can be saved if you just used Divi Flip card plugin.

Spending a couple of euros to save hours of time and hassle in the future is a no-brainer which is why you will love this plugin.

Let me know if you have any queries by leaving a comment below!

And if you have a plugin you would like added to the blog on Divi Theme Examples, just drop me a line.

Affiliate disclosure: Links on this page may contain affiliate code which means the owner of this website will be paid a commission on any sales that result from purchases made via these links. If you choose to purchase via links on Divi Theme Examples you will never be charged any extra and you will be helping to keep this website a forever free resource for the Divi community.

Pin It on Pinterest

By continuing to use the site, you agree to the use of cookies. more information

The cookie settings on this website are set to "allow cookies" to give you the best browsing experience possible. If you continue to use this website without changing your cookie settings or you click "Accept" below then you are consenting to this.

Close