Written By Samar Jamil
So welcome to another new tutorial. And today we’ll see how to make a floating button in Divi using Divi’s Position Options. Now Fixed buttons are very useful to increase sales and conversions. So It’s super simple and let’s get started.
Keep in mind that not only buttons you can make anything floating with Divi’s position options.
So, first of all, open up a page with Divi Builder and go to any button Settings. Then go to the Advanced tab and find Positions Panel click on it so you’ll see something like this.
Now Choose the position type as Fixed.
Now Choose the location for the button on anywhere of the page you want, just click on the box and your button will be fixed at that location on the screen you set.
Now you’ll see that your button is fixed but it might be having an issue that’s passing underneath of the other elements on the page so let’s fix it. For this go the Row Settings where the module is located and then go that Column settings where the module is located and then go to Advanced tab and open up Positions Panel and from there set the z-index to full value.
Now have a look at your button again you’ll see better results. And now let’s add some spacing because it’s at the very end of the screen and doesn’t look good.
Now go to button Module Settings and then open up the Position panel and from there add Vertical Offset as 20px and Horizontal Offset as 30px.
Final Preview
By Samar Jamil
Explore Divi, The Most Popular WordPress Theme In The World And The Ultimate Page Builder
You would also like one from these
Lock/Reveal a Divi Library Layout in Bloom Locked Content Form
Looking for a way to Lock/Reveal a Divi Library Layout after the user subscribes to your Newsletter in Bloom’s Locked Content Form. Try this!
How to create a Fly-In Popup like Elegant Themes in Divi
There’s a Fly-In Popup being used on the Elegant Themes website for more than 2 years and How about we duplicate it for our Divi site as well. If you want to add something more interesting to your site Follow this.
Easiest Way to Create Inline Email Optin Form in Divi
Hey Everyone, what's up? The Newsletter is the best way to communicate with your audience and give them special content that other users may miss but did you ever think that without a beautiful looking Newsletter form you'll not get more Audience and you'll also miss...
Hey! This was a very useful tutorial, I’m implementing it on my site right away! I only have one question: how do you make this element stick to every page on your site?
Hi Livia, You can use the Divi Theme Builder and add the Button to the Global Footer and It will appear on all pages on your site.