isotropic-2022
Share
Blog
Search
Menu

Quick And Dirty Way To Toggle An Oxygen Builder Modal Based On URL Parameter

By James LePage
 on December 24, 2020
Last modified on January 7th, 2022

Quick And Dirty Way To Toggle An Oxygen Builder Modal Based On URL Parameter

By James LePage
 on December 24, 2020
Last modified on January 7th, 2022

If you need a quick and easy way to toggle and Oxygen Builder modal on what a URL contains, use the code and steps in this article.

First, here's what this code does. Say your URL contains the parameter example.com/?toggle-modal=yes. We're going to set up a simple code block that will toggle a modal to pop up if the url contains that text.

First, add a code box and button to your page. Note the buttons ID, then go to Advanced -> Layout, and hide it.

Now, go to the modal, select the trigger type "show when user clicks element", and paste in the button id.

Make a code block (anywhere on the page works), and paste this code into the JS section.

(function($) { 
 $(document).ready(function() {
     if (window.location.href.indexOf("URL-Paramater") > -1) {
 document.querySelector('#buttonID').click();
     }
   });
 })( jQuery );

Essentially, it sees that your url contains the parameter needed to toggle the modal, and clicks the (hidden) button, triggering the modal to pop up.

This is great if you're redirecting visitors to a page, sending them from an email, or just want to toggle an Oxygen Builder modal from a URL Paramater.

Subscribe
Notify of
guest
1 Comment
Oldest
Newest Most Voted
Inline Feedbacks
View all comments
Wendy
1 year ago

Oooh... my mind is spinning with the possibilities

Article By
James LePage
Contributors/Editors
notloggedin
James LePage is the founder of Isotropic Design, a digital agency that builds WordPress websites. I read, write and design constantly!
We're looking for new authors. Explore Isotropic Jobs.
Close
🇺🇸 English
Save posts, access exclusive content, join members-only communities and more.
Dark Mode Toggle
linkedin facebook pinterest youtube rss twitter instagram facebook-blank rss-blank linkedin-blank pinterest youtube twitter instagram