Clickable Survey Popup
-
How do I insert my popup survey onto the clickable button on my website? It doesn’t seem to be explained at all.
The page I need help with: [log in to see the link]
-
Dear @dawnanawilliams,
Thank you for the topic.
As far as I understand, you want the popup survey to be opened by clicking on a button.
If yes, then we have special options for this.You can choose the On Click Popup Trigger and write the corresponding selector for the CSS selector(s) for trigger click option.
Please check this and let us know if you have any further questions.
Thank you.
Yes, thank you. I did get that far on the instructions and online tutorials. But “write the corresponding selector for the CSS selector(s) for trigger click option” doesn’t tell me what to link into my button or how. Could you please explain it in non-coding terms?
Dear @dawnanawilliams,
Thank you for your reply.
I want to clarify that selectors are used to identify a specific element or a group of elements on a webpage.
They allow you to apply CSS styles to those elements or perform actions with JavaScript.You can find more detailed information on selectors in the following links:
https://w3schools.com/css/css_selectors.asp
https://developer.mozilla.org/en-US/docs/Learn/CSS/Building_blocks/SelectorsFor example, in the screenshot below we created a button and assigned it a class name, test_button.
See the screenshots below:If you want to open the popup when clicking the button, the selector should be written as follows: .test_button
See the screenshot below:Please give this a try and let us know if it works as expected.
Thank you.
Hi, many thanks for your patience and screenshots. I followed them and it doesn’t yet work. Theoretically it should.
Can you see anything I should be doing differently?
<!-- wp:buttons {"layout":{"type":"flex","justifyContent":"center"}} -->
<div class="wp-block-buttons"><!-- wp:button {"className":".survey_button"} -->
<div class="wp-block-button .survey_button"><a class="wp-block-button__link wp-element-button">Online Classes: Survey of Interest </a></div>
<!-- /wp:button --></div>
<!-- /wp:buttons -->Dear @dawnanawilliams,
Thank you for your reply.
We’ve forwarded your case to our development team for further review.
After looking into it, we noticed that the class name in your HTML is incorrect.
It should be written without the dot, like this: class=”wp-block-button survey_button”>When targeting the element that has this class in the plugin, you should use the dot before the class name, like this: .survey_button.
See the screenshot below:
Additionally, we’ve noticed that you have caching enabled.
See the screenshot below:After making the necessary changes, kindly clear your caches and check again to see if everything is working properly.
Please don’t hesitate to reach out if you encounter any issues.
Thank you.
Thank you; I followed your instructions and problem has been fixed! However, it doesn’t fully display on my Chrome browser. I believe it’s a browser issue with Java-script which I have unsuccessfully tried to troubleshoot it in the past.
Dear @dawnanawilliams,
Thank you for your response.
Kindly attempt to access the page on a different device and in incognito mode to determine if the issue persists, and please share the results with us.
Additionally, please let us know where the survey is placed and the event on which it is triggered, so we can investigate further.
Looking forward to your reply.
Thank you.
Dear @dawnanawilliams,
We’re closing this ticket for now as we last heard from you 1 week ago.
If the query is unresolved, drop us a line and we’ll get back to you at the earliest and the ticket will be re-opened.
For a new query, feel free to open a new topic. Our Customer Care Specialists will be happy to help you.
Thank you.
The topic ‘Clickable Survey Popup’ is closed to new replies.