Home › Forums › Quform WordPress › Open Form in a Popup Using Avada Button
- This topic has 23 replies, 2 voices, and was last updated 4 months, 1 week ago by Ally.
- AuthorPosts
- April 19, 2024 at 9:28 pm #36654indusprayParticipant
I want my form to open in a popup window, while triggered by a standard Avada button.
No success so far, and I’ve tried many suggestions from previous posts (there seem to be so many different approaches and codes, which is a bit unsettling).
I can NEVER get a popup window of any kind to show. At best, I get the form itself displaying *within my page* below the button (with barebones styling), which is obviously not the intent.
(I can’t even get the popup to work while being triggered by a hyperlink… actually, I’m not even sure how to configure a hyperlink to do that.)
My form is a typical “contact” form, with about 7 fields and a file upload option.
The form is currently embedded into a normal full-size page on our website (using Quform shortcode inside a Code Block), where it displays properly, and works properly. We instead want to have the form open in a smaller-size popup window, so that visitors don’t lose their place on our website, plus feel like the form is something special.
The possible options are to use:
– Avada Popover element
– Avada Modal element
– Quform’s built-in popup featureQ: HOW CAN I BEST IMPLEMENT THIS PLEASE?
Looking for the simplest, most robust, and future-proof method — with specific instructions (that a non-coder can follow).
Would like to preserve the form’s display styling. I’m guessing that Quform’s built-in popup feature is the best approach?
Any help hugely appreciated!
NOTES:
A. The shortcodes provided by Quform are:
Standard: [quform id="2" name="quote_request_1"]
Popup: [quform_popup id="2" name="quote_request_1"]Click me[/quform_popup]B. I’m running: Avada V-7.117, Quform V-2.20.0, WordPress V-6.5.2
- This topic was modified 5 months, 2 weeks ago by induspray.
April 20, 2024 at 5:52 pm #36656indusprayParticipantCORRECTION to last line above:
B. I’m running: Avada V-7.11.7, Quform V-2.20.0, WordPress V-6.5.2
- This reply was modified 5 months, 2 weeks ago by induspray.
April 20, 2024 at 6:00 pm #36657indusprayParticipantalso: I’ve seen references to inserting the shortcode into the page and “making it invisible”, but cannot figure out how to do that
EXAMPLE:
“…add the popup form shortcode or block to the page with no trigger content so that it is invisible: [quform_popup id="1"][/quform_popup]”it suggests to put into a Text Block element, but if I do that, the form simply gets displayed on the page, NOT in a popup window (and there’s no sign of any popup window)… I can’t find anyway to make it invisible
I tried DE-selecting all 3 devices to display on (desktop, tablet, etc.), but that setting doesn’t take and always resets to all 3 being selected in blue
Q: how exactly to I insert this code, and how do I make it invisible?
- This reply was modified 5 months, 2 weeks ago by induspray.
April 24, 2024 at 1:32 pm #36662AllySupport StaffYou don't have permission to view this content. Please log in or register and then verify your purchases to gain access.
April 24, 2024 at 7:24 pm #36663indusprayParticipantsome progress…..
I was able to stop the form from displaying on the page by doing what you suggested (“go to Forms – Settings – Performance and make sure that “When to load scripts/styles” is set to “Always””)
did the other things as well, but when I click on the button, NOTHING HAPPENS
Q: is there something else I need to do in the button settings?… eg. do I put something in for the button URL, or anything else?
(PS: could not send you the Avada script zip file, my Gmail is blocking that type of file for security reasons)
thank you!
April 24, 2024 at 10:59 pm #36666indusprayParticipantas a test, I tried using the alternate basic method of triggering the popup form (via plain text link, instead of a button)… using the Avada Text Block element, I inserted this code into the page:
[quform_popup id="2" name="quote_request_1"]Click me[/quform_popup]
it also does NOT work
in the rendered page, I can see the “Click me” text link, but hovering over it shows no target URL, and clicking on it does nothing
note that when I hover over my BUTTON version, yes I do see a target URL displayed, but nothing happens when I click on it… otherwise, the button looks normal, and the rollover effect works
April 25, 2024 at 10:55 am #36667AllySupport StaffYou don't have permission to view this content. Please log in or register and then verify your purchases to gain access.
April 25, 2024 at 5:33 pm #36669indusprayParticipantOK, I’ve privately emailed you a link to a web page with a “test” button/link (that so far are not working)
also, I did try toggling the 3-4 different popup script variations… did not fix
- This reply was modified 5 months, 1 week ago by induspray.
April 29, 2024 at 9:31 am #36675AllySupport StaffYou don't have permission to view this content. Please log in or register and then verify your purchases to gain access.
April 30, 2024 at 3:42 am #36678indusprayParticipantAlly:
you said >> “For some reason the page has some JavaScript code that is effectively making any popup script loaded on the page useless. I don’t know what is loading this code, you could try checking if it is another plugin or the theme using this method: https://support.themecatcher.net/quform-wordpress-v2/troubleshooting/common-problems/plugintheme-conflicts ”
OK, so I did some plugin conflict debugging as you suggested
#1: I tried switching my theme to something other than Avada (I switched to “Astra”)… this did NOT fix (still no popup form)
#2. I deactivated the plugin “FooGallery”, this did NOT fix (still no popup form)
#3: I deactivated the plugin “FooBox HTML & Media Lightbox”, and the popup form FINALLY WORKED!!! (first time ever) *******
the form seemed to display OK (but has no heading or intro text, which would be nice to have) — but it DID actually pop up!… see attached screenshot of the resulting popup form
so now what?
note: we definitely do use the FooBox Lightbox plugin on our website
thanks,
— Paul- This reply was modified 5 months ago by induspray.
- This reply was modified 5 months ago by induspray.
- This reply was modified 5 months ago by induspray.
Attachments:
You must be logged in to view attached files.April 30, 2024 at 10:12 am #36685AllySupport StaffYou don't have permission to view this content. Please log in or register and then verify your purchases to gain access.
May 2, 2024 at 12:11 am #36691indusprayParticipantRE: the fix “The FooBox option Disable Other Lightboxes at FooBox → Settings → Advanced must be turned Off for Quform popup forms to work. The option does not affect normal forms.”
I tried this, but discovered that unchecking that option did NOT work
however, when I also unchecked the next option “Try to deregister other lightbox scripts and stylesheets”, then it DID WORK
so looks like BOTH options must be unchecked for the fix to work (my experience anyway)… see attached screenshot showing both unchecked
I had to disable (uncheck) both of these:
– Disable Other Lightboxes
– Deregister Other Lightbox FilesQ: will unchecking these have any adverse effects?
- This reply was modified 5 months ago by induspray.
Attachments:
You must be logged in to view attached files.May 3, 2024 at 10:55 am #36702AllySupport StaffYou don't have permission to view this content. Please log in or register and then verify your purchases to gain access.
May 3, 2024 at 11:15 pm #36704indusprayParticipantthanks…
now I want to make my popup form wider, to eliminate having to scroll down… basically, I want the form to been seen in its entirety when it pops up
I made a new “wide” version of our existing form, by utilizing a 2-column layout, and rearranging the fields within those columns… however, the displayed form is too narrow (see screenshot)
if I try to modify the column settings, it limits my column widths to a total of 100 pixels, which is far too small (see screenshot)… how can I make this popup form wider please? thanks
- This reply was modified 5 months ago by induspray.
- This reply was modified 5 months ago by induspray.
Attachments:
You must be logged in to view attached files.May 7, 2024 at 9:43 am #36710AllySupport StaffYou don't have permission to view this content. Please log in or register and then verify your purchases to gain access.
- This reply was modified 4 months, 4 weeks ago by Ally.
- AuthorPosts
- You must be logged in to reply to this topic.