- This topic has 3 replies, 2 voices, and was last updated 3 years, 7 months ago by
.
Hi,
I’m trying to add a button that triggers a mailchimp popup.
I’ve added the following code to my header:
<div class=””>
<div><span class=”enlighter-g1″><</span><span class=”enlighter-text”>script id=</span><span class=”enlighter-s0″>”mcjs”</span><span class=”enlighter-g1″>></span></div>
</div>
<div class=””>
<div><span class=”enlighter-k0″>function</span> <span class=”enlighter-m0″>showPopup</span><span class=”enlighter-g1″>(</span><span class=”enlighter-g1″>)</span> <span class=”enlighter-g1″>{</span></div>
</div>
<div class=””>
<div><span class=”enlighter-text”> !</span><span class=”enlighter-k0″>function</span><span class=”enlighter-g1″>(</span><span class=”enlighter-text”>c,h,i,m,p</span><span class=”enlighter-g1″>)</span><span class=”enlighter-g1″>{</span><span class=”enlighter-text”>m=c.</span><span class=”enlighter-m3″>createElement</span><span class=”enlighter-g1″>(</span><span class=”enlighter-text”>h</span><span class=”enlighter-g1″>)</span><span class=”enlighter-text”>,p=c.</span><span class=”enlighter-m3″>getElementsByTagName</span><span class=”enlighter-g1″>(</span><span class=”enlighter-text”>h</span><span class=”enlighter-g1″>)</span><span class=”enlighter-g1″>[</span><span class=”enlighter-n1″>0</span><span class=”enlighter-g1″>]</span><span class=”enlighter-text”>,m.</span><span class=”enlighter-m3″>async</span><span class=”enlighter-text”>=</span><span class=”enlighter-n1″>1</span><span class=”enlighter-text”>,m.</span><span class=”enlighter-m3″>src</span><span class=”enlighter-text”>=i,p.</span><span class=”enlighter-m3″>parentNode</span><span class=”enlighter-text”>.</span><span class=”enlighter-m3″>insertBefore</span><span class=”enlighter-g1″>(</span><span class=”enlighter-text”>m,p</span><span class=”enlighter-g1″>)</span><span class=”enlighter-g1″>}</span><span class=”enlighter-g1″>(</span><span class=”enlighter-k9″>document</span><span class=”enlighter-text”>,</span><span class=”enlighter-s0″>”script”</span><span class=”enlighter-text”>,</span><span class=”enlighter-s0″>”https://chimpstatic.com/mcjs-connected/js/users/9f0ff62a247e302836e834a77/d986f27b70963c46c0ce59ec7.js”</span><span class=”enlighter-g1″>)</span><span class=”enlighter-text”>;</span></div>
</div>
<div class=””>
<div></div>
</div>
<div class=””>
<div><span class=”enlighter-c0″>//unsetting the cookie</span></div>
</div>
<div class=””>
<div><span class=”enlighter-k9″>document</span><span class=”enlighter-text”>.</span><span class=”enlighter-m3″>cookie</span><span class=”enlighter-text”> = </span><span class=”enlighter-s0″>”MCPopupClosed=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;”</span><span class=”enlighter-text”>; </span></div>
</div>
<div class=””>
<div><span class=”enlighter-k9″>document</span><span class=”enlighter-text”>.</span><span class=”enlighter-m3″>cookie</span><span class=”enlighter-text”> = </span><span class=”enlighter-s0″>”MCPopupSubscribed=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;”</span><span class=”enlighter-text”>;</span></div>
</div>
<div class=””>
<div><span class=”enlighter-g1″>}</span></div>
</div>
<div class=””>
<div></div>
</div>
<div class=””>
<div><span class=”enlighter-k9″>document</span><span class=”enlighter-text”>.</span><span class=”enlighter-m3″>getElementById</span><span class=”enlighter-g1″>(</span><span class=”enlighter-s0″>”show-popup”</span><span class=”enlighter-g1″>)</span><span class=”enlighter-text”>.</span><span class=”enlighter-m3″>onclick</span><span class=”enlighter-text”> = </span><span class=”enlighter-k0″>function</span><span class=”enlighter-g1″>(</span><span class=”enlighter-g1″>)</span> <span class=”enlighter-g1″>{</span> <span class=”enlighter-m0″>showPopup</span><span class=”enlighter-g1″>(</span><span class=”enlighter-g1″>)</span><span class=”enlighter-text”>; </span><span class=”enlighter-g1″>}</span></div>
</div>
<div class=””>
<div><span class=”enlighter-g1″><</span><span class=”enlighter-text”>/script</span><span class=”enlighter-g1″>></span></div>
</div>
<div></div>
<div>As per the instructions on this webpage:</div>
<div></div>
<div>https://rahmanzeb.com/how-to-make-mailchimps-popup-window-appear-with-click-only/</div>
<div></div>
<div>However, I have no idea now how to add the specified “show-popup” ID to one of my buttons so that when I click it, the popup appears.</div>
<div></div>
<div>Can you help please, I’m trying to add it to the “About me” button at the top of the page in the website in the private info field below.</div>
<div></div>
<div>Thanks!</div>
<div></div>The code has not pasted in correctly above, I’ll try in the private information field:
Wow, my first message is now a mess.
So, I’ve added the above code in the private information field into my header so that the mailchimp subscribe popup does not automatically appear.
As per the instructions on this website:
https://rahmanzeb.com/how-to-make-mailchimps-popup-window-appear-with-click-only/
However, I have no idea how to add the specified “show-popup” ID to a button to make it work as you have to add a url link to a button?
Can you help please.
It is for the “ABOUT ME” button at the top of the page on the website in the private information field.
Thanks!
Hi there,
If we understood it correctly then you can add Raw HTML element inside your WPBakery page builder section and inside enter this HTML snippet:
<div id="show-popup"></div>
Let us know if that helps.
Best regards,
Shufflehound team
