Title: Trigger modal with custom button
Last modified: August 28, 2017

---

# Trigger modal with custom button

 *  [Zoker](https://wordpress.org/support/users/zoker/)
 * (@zoker)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/trigger-modal-with-custom-button/)
 * Hi there,
 * I want to create a custom button, that launches the modal window.
 * Is there any way, to bind an class via jquery to open the modal?
 * Regards,
    Florian

Viewing 4 replies - 1 through 4 (of 4 total)

 *  [blakwid0w](https://wordpress.org/support/users/blakwid0w/)
 * (@blakwid0w)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/trigger-modal-with-custom-button/#post-9463975)
 * Hi Zoker,
 * I believe with their recent update you can specify it to be opened by a class
   name. Meaning you can create buttons with the same class name and it will open
   the modal 🙂
 * Before, I used to create the modal widget then use jQuery on another element 
   to trigger “click” of the modal element.
 * Hope that helps,
    Martin
 *  Plugin Author [Convertful Team](https://wordpress.org/support/users/rsukhar/)
 * (@rsukhar)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/trigger-modal-with-custom-button/#post-9464089)
 * Hello Zoker,
 * Blakwid0w’s right: in the latest update, I added the option to show Modal Popup
   after a custom element is clicked. You can specify the element by its class name.
 * Hope this helps!
 *  Thread Starter [Zoker](https://wordpress.org/support/users/zoker/)
 * (@zoker)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/trigger-modal-with-custom-button/#post-9465872)
 * Hi Ruslan,
 * That’s great news!
    But unfortunately it does not work on my page:
 * Page is here: [https://zkr.io/go/gareis](https://zkr.io/go/gareis)
 * The button is directly placed on the left column on the first section.
 * The only things that happens, is that a dark background appears, but no content
   or anything.
    Also the page reloads after the button click, which should not 
   be the case I guess.
 * Thank you in advance!
 *  Thread Starter [Zoker](https://wordpress.org/support/users/zoker/)
 * (@zoker)
 * [8 years, 9 months ago](https://wordpress.org/support/topic/trigger-modal-with-custom-button/#post-9466426)
 * Ok, so after more testing I found out, that I had to re-create the modal element
   within the vc editor. Now it works.
 * But the link opening issue still exists. So please prevent the button from opening
   the entered link, when the class is the trigger class of the modal (when I add
   an empty link, the page reloads on click, when I add a ‘#’ as link, the page 
   jumps to the top of the page).
 * I got it to work with this code:
 *     ```
       $(".trigger").click(function(e) {
           e.preventDefault();
       });
       ```
   
 * But I don’t want to add this to every modal trigger I create.
    -  This reply was modified 8 years, 9 months ago by [Zoker](https://wordpress.org/support/users/zoker/).

Viewing 4 replies - 1 through 4 (of 4 total)

The topic ‘Trigger modal with custom button’ is closed to new replies.

 * ![](https://s.w.org/plugins/geopattern-icon/codelights-shortcodes-and-widgets_6b7989.
   svg)
 * [Sidebar Widgets by CodeLights](https://wordpress.org/plugins/codelights-shortcodes-and-widgets/)
 * [Frequently Asked Questions](https://wordpress.org/plugins/codelights-shortcodes-and-widgets/#faq)
 * [Support Threads](https://wordpress.org/support/plugin/codelights-shortcodes-and-widgets/)
 * [Active Topics](https://wordpress.org/support/plugin/codelights-shortcodes-and-widgets/active/)
 * [Unresolved Topics](https://wordpress.org/support/plugin/codelights-shortcodes-and-widgets/unresolved/)
 * [Reviews](https://wordpress.org/support/plugin/codelights-shortcodes-and-widgets/reviews/)

 * 4 replies
 * 3 participants
 * Last reply from: [Zoker](https://wordpress.org/support/users/zoker/)
 * Last activity: [8 years, 9 months ago](https://wordpress.org/support/topic/trigger-modal-with-custom-button/#post-9466426)
 * Status: not resolved