This all started out with the idea of turning a Divi module into a 3D css flipcard (flipper, flipbox or whatever you call it). After figuring out how do code up a flipcard at codepen with great and easy success, I tried to apply the lesson to various Divi modules without success. Giving up early after somebody suggested to use a shortcode, I decided to create a Divi Licious Flipper shortcode.
This exercise went pretty well until I started over complicating it by adding in various options one would expect users to want/need. Take size for example. Not everybody is going to want a pre-set flipper size. Then consider whether to use a graphic or solid color for the front and or back of the flipbox. Then comes text, both title and content text sizes and color.
Does it need a read more link or not. I decided yes, and hard coded it it. Later I decided no and made it an option, discovering in the process that I lost the ability to exactly position it at the bottom of the content, so I put it back in. a better developer would have made it optional and I was going to go that direction until I took a peek at codecanyon and found these:
And more! Those cost money. This is free to do whatever you feel like with it.
<h1 style=”text-align: center;”><span style=”color: #993300;”>Baseball</span></h1>
<h4 style=”text-align: center;”><span style=”color: #008080;”>We count on winning. And if we lose, don’t beef. And the best way to prevent beefing is – don’t lose.</span></h4>[ /dl-flipper ]
Subscribe for Divi Freebies
Plugin update notifications :: stay abreast of new and or updated items by opting in to my very occasional email newsletter. I swear by all that is right and holy your email address will never be shared, sold, traded or otherwise abused and I seriously doubt you'll see anything more than plugin/code update notifications when they are of the utmost importance.