Posts

How To Create Vertical Text Layouts With Divi 5’s Text Direction Settings

Image
Vertical text used to require custom CSS in Divi. You either had to add a writing-mode snippet, rotate an entire module with transform settings, or fake the effect with an image. Each method worked, but each one also introduced layout issues that usually took more time to fix than the effect was worth. Divi 5 now includes Text Direction settings that let text flow vertically with one click. The text remains real text, the typography controls still work, and the layout can be adjusted visually inside the builder. In this post, we’ll cover where the Text Direction settings live, what each direction mode does, and what changes once text starts flowing vertically. Then we’ll build a full vertical text header step by step and look at two more layout examples that use the same setting at different scales. What Are Text Direction Settings In Divi 5? Text Direction is a typography setting in Divi 5 that controls the axis your text follows. By default, text runs horizontally from left t...
Post a Comment
Read more

How To Build An Email Popup In Divi 5

Image
Email popups are one of the most direct ways to grow your subscriber list. Used well, they catch attention at the right moment, make the offer clear, and get out of the way. Building one that actually looks good and behaves the way you want is the harder part. The popup needs its own design space, the form needs to connect to your email list, the timing needs to feel intentional, and visitors need a clear way to dismiss it. Divi 5 gives you the tools to build that workflow visually. With Canvases , the updated form modules , Interactions , Design Variables, and form field focus styling, you can create email popups without relying on a separate popup plugin or writing custom JavaScript. In this tutorial, we’ll look at why email popups work, which Divi 5 features make them possible, and how to build two popup styles from scratch: a centered modal popup and a minimalist corner popup. Why Are Email Popups Effective? Popups have a bad reputation, and some of that reputation is earned. ...
Post a Comment
Read more

How To Use :focus And :checked Editing In Divi 5

Image
Interactive states can make a form feel more polished, more responsive, and easier to use. The problem is that styling those states usually means writing custom CSS, finding the right selectors, and testing everything on the front end. Divi 5 changes that with new pseudo-class editing modes for form fields. You can visually customize states like :focus and :checked directly inside the builder, using the same design controls you already use for the default state. In this tutorial, we’ll build a modern project inquiry form and use both states to add visual feedback across text fields and checkbox selections. A focused field will become easier to track while the visitor types, and checked options will respond clearly when selected. A Quick Look At :focus And :checked Before jumping into the build, it helps to understand what these two states do. Both live inside Divi 5’s pseudo-class editing modes. You can access them by hovering over a supported design option and clicking the sm...
Post a Comment
Read more