Divi Show / Hide Button includes an option to make the button link to a target URL, similar to a standard button module in the Divi builder. However, there are a few differences in behavior compared to the standard button module. The option and it's behavior are described in this post.
Setting the Button Link URL
You'll find the option to set the Button Link URL in the module settings at:
Show / Hide Button Settings > Content > Link > Button Link URL

The option is available in Divi Show / Hide Button v1.2.1 onwards.
Linking to a Visible (or soon-to-be-visible) On-Page Element
If you set the Button Link URL to a CSS Id / URL hash such as '#element1' then, when clicking on the Show / Hide button would cause the element with ID 'element1' to be revealed, the browser will scroll to that element.
Linking to a (soon-to-be-hidden) On-Page Element
This is fixed in v1.2.7. A workaround for this in earlier versions is to set the Show / Hide Button's Transition Duration option to '0ms'. This will hide the target element immediately, and prevent the browser from scrolling to the element's former position.
Leaving the Button Link URL Field Empty
If the Button Link URL is left empty then no new page is loaded and no scrolling occurs. This differs from the standard Divi button module, which reloads the page when its URL is empty.
We may earn a commission when you visit links on our website.
Latest Posts
Fade a Divi Image Module Edge into the Background
Want to create a stylish fade effect on your Divi image module—where one side fades smoothly into the background? With a bit of CSS, you can make any edge (or corner) of the image fade out: top, bottom, left, right, or even diagonally.Fade a Divi Image Module Edge...
Hide the Header and Footer in the Hello Elementor Theme
Removing the default header and footer from your Hello Elementor theme allows for a streamlined and distraction-free website design. This is especially useful when creating unique landing pages, full-width layouts, or custom headers and footers with a page builder. In...
Setting up the Divi Password Box Module
Setting up password protection on a page can help you control access to sensitive or private content in WordPress, allowing only authorized visitors to view certain sections. With the Divi Password Box module, you can replace the plain Divi password form with a fully...
Open Divi Social Media Icons in a New Tab
Ensuring your website's social media icons open in a new browser tab creates a seamless user experience and keeps visitors engaged with your site while allowing them to explore your social media presence. This approach prevents users from navigating away from your...
Set Hover Color for Menu Links in the Divi Menu Module
Customizing the hover color of menu links lets you enhance the user experience and maintain visual consistency with your website’s brand. By setting a specific hover color, you can guide visitors' attention and improve navigation feedback. In this guide we show you...
0 Comments