Flipping your Blurb
Not updated for CUSTOM MODULES yet
Hi guys, thanks for stopping by. I haven’t updated this post yet to accommodate front-end accessibility. I’m working on it and hope ti have it updated soon.
Sincerely,
Rebekah
Divi and the Blurb
Again with the Blurb? I know, I know. I am a little obsessed. This time we’re making it flip. Right now card style layouts are all the rage. This is tutorial will incorporate another wonderful tutorial from Tymapnus. There are many styles to chose from but, I am using #7 with some modifications. I want mine to turn to the right instead of turn down. Example below:

A Flipping Blurb

A Flipping Blurb

A Flipping Blurb
Necessary Notes!
The Code
Of course, you can find the files on github. The first thing we are going to do is create a new file for our custom modules folder. The file is going to be creatively called, card_blurb.php. In this file we are going to add our custom module data. The real changes happen around line 401 with the changing of the output.
[crayon-6467e7b0ac751886541578/]
[crayon-6467e7b0ac75a893323783/]
Now, the Card Blurb will be a new module.

[crayon-6467e7b0ac75c329607691/]
That’s it, you should be ready to rock. This effect can be rather tricky. Because of the absolute positioning of several elements, a fixed height is required. In this example, it’s 300 X 300. This may or may not work for you. You can change the size in the last line of the css. You can play with the transform values and change the direction that the blurb rotates. It can be both fun and frustrating to figure out. You could also incorporate a different Tymapanus example that have the same structure.