# CTA Form (beta) on button click Wordpress site

**URL:** <https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749>\
**Category:** Lead Capture Tools\
**Tags:** professional\
**Created:** [July 5, 2023, 5:04pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749 "2023-07-05T17:04:43Z")\
**Posts on this page:** 10\
**Page:** 1

<div class="post-metadata">

**Author:** ![navroop](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/navroop/32/198931_2.png) [@navroop](https://community.hubspot.com/u/navroop)\
**Post date:** [July 5, 2023, 5:04pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/1 "2023-07-05T17:04:43Z")

</div>

Hi,

We’ve successfully installed the Hubspot plugin for our wordperss site. We have multiple “Schedule a Demo” buttons on our site and wanted to leverage the new CTA (beta) to display a contact form on click.

We created the Form in HubSpot and then Created the CTA and have configured it to only be launched on click. We copied the code from the CTA that should be called on click and then put that into the Custom CSS for the button (at least we believe we did that correctly, per instructions).

On click, the button does not bring up a popup.

We have already disabled the popup form and dynamic action that would call the Gravity Forms button that were in place previously.

Thoughts?

---

<div class="post-metadata">

**Author:** ![Mike\_Eastwood](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/mike_eastwood/32/70075_2.png) [@Mike\_Eastwood](https://community.hubspot.com/u/Mike_Eastwood)\
**Post date:** [July 5, 2023, 10:18pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/2 "2023-07-05T22:18:26Z")

</div>

Hi @navroop

Do you have the [HubSpot WordPress plugin](https://www.hubspot.com/products/wordpress) installed in your site?

Can you share a link to your page so we can see what’s happening?

Cheers

Mike

---

<div class="post-metadata">

**Author:** ![navroop](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/navroop/32/198931_2.png) [@navroop](https://community.hubspot.com/u/navroop)\
**Post date:** [July 5, 2023, 11:06pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/3 "2023-07-05T23:06:16Z")

</div>

We do have the plugin installed. Thanks for the speedy reply. I think we figured it out. There appear to be two distinct places where custom CSS calls can be placed for buttons, and while I would have thought it would work in both, it only works when called from one of them.

Seems to be fine. We just did test submissions and all worked as expected.

---

<div class="post-metadata">

**Author:** ![MaliniP](https://avatars.discourse-cdn.com/v4/letter/m/858c86/32.png) [@MaliniP](https://community.hubspot.com/u/MaliniP)\
**Post date:** [August 4, 2023, 11:39am UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/4 "2023-08-04T11:39:34Z")

</div>

Hi,  
We seem to be facing the same issue. Could you help us with a bit more detail?  
Much appreciated!

---

<div class="post-metadata">

**Author:** ![navroop](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/navroop/32/198931_2.png) [@navroop](https://community.hubspot.com/u/navroop)\
**Post date:** [August 6, 2023, 4:47pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/5 "2023-08-06T16:47:17Z")

</div>

Hi Malini,

Here are screen shots from how we got it to work.

Button on page:

 ![Screenshot 2023-08-06 at 12.41.34 PM.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/3/d/3df81a5c25fdf9561cce773e67bbbb60135b8b53.png)

Under edit button you want to be sure that you don’t have a URL being called on click under “Link”. See below. We set it to #!.

 ![Screenshot 2023-08-06 at 12.41.55 PM.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/d/4d7d7fe1ea6c279293e6f15d936d1647ea71a709.png)

Next you want to put the css embed into the CSS Classes area under Layout on the Advanced Tab under Edit Button. This embed code is different per CTA.

 ![Screenshot 2023-08-06 at 12.42.15 PM.png](https://d2qpr2jzcazej7.cloudfront.net/original/1X/6d4a8a12cd3929a3aaac809d1dee902a7471f9ea.png)

This is not to be confused with the Custom CSS area further down the advanced tab on Edit Button.

 ![Screenshot 2023-08-06 at 12.45.51 PM.png](https://d2qpr2jzcazej7.cloudfront.net/original/2X/a/aeb00b3b419572cb91e8c3aa431dae89a998e087.png)

Hope this helps.

---

<div class="post-metadata">

**Author:** ![MaliniP](https://avatars.discourse-cdn.com/v4/letter/m/858c86/32.png) [@MaliniP](https://community.hubspot.com/u/MaliniP)\
**Post date:** [August 7, 2023, 3:41am UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/6 "2023-08-07T03:41:49Z")

</div>

Hi Navroop,  
Thankyou so much!  
That was very helpful indeed, especially setting # to Link. The path cleared from there on 🙂

---

<div class="post-metadata">

**Author:** ![DWebber](https://avatars.discourse-cdn.com/v4/letter/d/e36b37/32.png) [@DWebber](https://community.hubspot.com/u/DWebber)\
**Post date:** [June 5, 2024, 1:44pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/7 "2024-06-05T13:44:59Z")

</div>

Hi. I have this exact same issue but I’ve done what @navroop did to get it to work and it’s not worked for me. Do you have any ideas how I can proceed?

Here is the [link](https://www.unipartrail.com/construction-maintenance-renewal-machines/) to the page. One of the buttons I’m trying to link to a HubSpot CTA is the one below. It currently links to an Elementor popup, which then redirects to something when the form is filled in. I’m wanting it to rather link to the HubSpot CTA popup.

 ![Screenshot 2024-06-05 at 14.41.55.png](https://d2qpr2jzcazej7.cloudfront.net/original/3X/d/9/d9b54fea157fc71e015b2f45e0304b69ef10e4fd.png)

Any help would really be appreciated.

Thanks!

---

<div class="post-metadata">

**Author:** ![navroop](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/navroop/32/198931_2.png) [@navroop](https://community.hubspot.com/u/navroop)\
**Post date:** [June 5, 2024, 2:53pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/8 "2024-06-05T14:53:46Z")

</div>

Can you post the screenshots from your Wordpress setup? The parts I posted. Sometimes it’s a minor issue there.

---

<div class="post-metadata">

**Author:** ![DWebber](https://avatars.discourse-cdn.com/v4/letter/d/e36b37/32.png) [@DWebber](https://community.hubspot.com/u/DWebber)\
**Post date:** [June 5, 2024, 3:03pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/9 "2024-06-05T15:03:57Z")

</div>

Hi, thanks for the reply.

It actually has worked! It seems it just took a while to make the connection with HubSpot, so when I made the change and immediately refreshed the page and tried, it wasn’t working. I went back a while later and clicked on the button again and it’s worked.

Thanks again.

---

<div class="post-metadata">

**Author:** ![colson](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/colson/32/38114_2.png) [@colson](https://community.hubspot.com/u/colson)\
**Post date:** [December 1, 2023, 4:58pm UTC](https://community.hubspot.com/t/cta-form-beta-on-button-click-wordpress-site/84749/10 "2023-12-01T16:58:19Z")

</div>

Just wanted to say thanks for sharing. Solved this challenge for me, too!
