In this video, we’ll show you how to add sale tabs to any module, row, or section using the Divi Theme. Whether you're working with a Divi module, row, or section, this tutorial walks you through the simple steps to create attention-grabbing sale tabs that can boost your conversions. With the power of Divi and some easy CSS code, you'll learn how to enhance your site’s layout with stylish sale tabs that can be applied across any part of your website.
If you want to make your sale announcements stand out, this video is perfect for you! By adding sale tabs to your Divi sections, rows, or modules, you'll catch the eye of your visitors and encourage more engagement. This technique is beginner-friendly, and no advanced coding knowledge is required. Watch the video now and follow along to elevate your website design with striking sale tabs that can be customized to fit any section of your site!
CSS CODE:
PUT IN ADVANCED>CSS>MODULE ELEMENTS>BEFORE
- content: "SALE";
- position:absolute;
- background-color:red;
- padding:15px 60px;
- top:20px;
- right:-40px;
- z-index:1;
- color:white;
- font-weight:bold;
- transform:rotate(45deg)
THEN GO TO ADVANCED>VISIBILITY>HORIZONTAL OVERFLOW------------------->CHANGE TO HIDDEN
Sale Tabs
Your content goes here. Edit or remove this text inline or in the module Content settings. You can also style every aspect of this content in the module Design settings and even apply custom CSS to this text in the module Advanced settings.