Lead Capture Tools

SSahabandu
Membro

Adding a new CTA on a custom module

resolver

Hi, I have managed to edit the custom code to add a new CTA to a dynamic page on our website.

However,

1. I can't get the new CTA linked to the form.

2. I now have all CTAs stuck together with no buffer space.

 

Can someone help me identify the mistake I have made with the edited code.

 

The website page in concern is 

https://www.floorworld.com.au/product-detail/signature-purity-timber?product_name=Purity%20-%20Timbe...

 

The 03 CTA's now look like below;

SSahabandu_0-1676603667293.png

The new CTA added was 'Request Samples', which does not link to the form created.

I am not sure if I have used the right coding to replicate this CTA. I am not even sure why custom modules were developed for this in the first place.

 

Please let me know how I can get my CTA linked to the form created and get this page to work as intended please.

Thank you.

0 Avaliação positiva
1 Solução aceita
alyssamwilie
Solução
Especialista reconhecido(a) | Parceiro Elite
Especialista reconhecido(a) | Parceiro Elite

Adding a new CTA on a custom module

resolver

The link is working now, but it looks like https://www.floorworld.com.au/request-samples doesn't exist. You would need to create and publish a /request-samples page. If it's going to be just a form like the https://www.floorworld.com.au/get-a-quote page you could just clone that page and switch in the form you want.

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.

Exibir solução no post original

0 Avaliação positiva
7 Respostas 7
alyssamwilie
Solução
Especialista reconhecido(a) | Parceiro Elite
Especialista reconhecido(a) | Parceiro Elite

Adding a new CTA on a custom module

resolver

The link is working now, but it looks like https://www.floorworld.com.au/request-samples doesn't exist. You would need to create and publish a /request-samples page. If it's going to be just a form like the https://www.floorworld.com.au/get-a-quote page you could just clone that page and switch in the form you want.

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
0 Avaliação positiva
SSahabandu
Membro

Adding a new CTA on a custom module

resolver

thank you for your help!

0 Avaliação positiva
alyssamwilie
Especialista reconhecido(a) | Parceiro Elite
Especialista reconhecido(a) | Parceiro Elite

Adding a new CTA on a custom module

resolver

Seeing as the {{ dynamic_page_hubdb_row.request_samples_link }} variable seems to be the only part not being populated in the link my first thought is : did you add a request_samples_link column to the HubDB table the page is pulling data from and add a link path to the column for each row?

Also, the Get a Quote CTA isn't using a table variable for its path so is a variable really necessary for the Request Samples CTA path? 

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
0 Avaliação positiva
SSahabandu
Membro

Adding a new CTA on a custom module

resolver

Yes, I did add the link before, but it was not working. 

 

I changed the code as follows;

 


<!-- <a href="/get-a-quote?product_name={#{ dynamic_page_hubdb_row.name }}&brand={{ final_category|join(',') }#}">GET A QUOTE</a> -->
<a href="/get-a-quote?product_name={{ dynamic_page_hubdb_row.name }}&brand={{ dynamic_page_hubdb_row.brand[0].name }}&product_category={{ final_category|join(',') }}&website_lead_form_filled=Get A Quote">GET A QUOTE</a>

<!-- <a href="/request-samples?product_name={#{ dynamic_page_hubdb_row.name }}&brand={{ final_category|join(',') }#}">REQUEST SAMPLES</a> -->
<a href="/request-samples?product_name={{ dynamic_page_hubdb_row.name }}&brand={{ dynamic_page_hubdb_row.brand[0].name }}&product_category={{ final_category|join(',') }}&website_lead_form_filled=REQUEST SAMPLES">REQUEST SAMPLES</a>
{% endif %}

{% if dynamic_page_hubdb_row.room_button_label %}<a href="javascript&colon;void(0)" id="trigger-modal" class="see_room">{{ dynamic_page_hubdb_row.room_button_label}}</a>{% endif %}

</div>
</div>
</div>

 

and now it goes to a 404 error page. 

 

Could it be that my form is not done correctly?

 

Also the CTA's now look like this. I did want them on a horizontal like but this is good too.

Thank you!

0 Avaliação positiva
SSahabandu
Membro

Adding a new CTA on a custom module

resolver

Also, if we can do without the variables being pulled form the HubDb file for the 'Request samples' form, how should I go about with the code to link the CTA to the form created?

0 Avaliação positiva
alyssamwilie
Especialista reconhecido(a) | Parceiro Elite
Especialista reconhecido(a) | Parceiro Elite

Adding a new CTA on a custom module

resolver

Can you show us the code for that CTA section? It's not really possible to tell why the link isn't being filled in by just looking at the site. (If the page is dynamic that's exactly the reason custom modules were built; HubSpot CTAs do not have dynamic capabilities not to mention they load incredibly slow)

As for the spacing you would need to add some CSS:

.cta-wrap a + a {
  margin-left: 5px;
}

 

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
0 Avaliação positiva
SSahabandu
Membro

Adding a new CTA on a custom module

resolver

Hi, Thanks so much for your reply. I will try the spacing now. 

the code for the 03 CTAs you see in the pic is below. The text in Red is the code related to the CTA that is not connected correctly to the form.

 

</div>
<div class="cta-wrap">
{% set final_category = [] %}
{% for product_category in dynamic_page_hubdb_row.product_category %}
{% do final_category.append(product_category.name|lower) %}
{% endfor %}

<!-- <a href="/get-a-quote?product_name={#{ dynamic_page_hubdb_row.name }}&brand={{ final_category|join(',') }#}">GET A QUOTE</a> -->
<a href="/get-a-quote?product_name={{ dynamic_page_hubdb_row.name }}&brand={{ dynamic_page_hubdb_row.brand[0].name }}&product_category={{ final_category|join(',') }}&website_lead_form_filled=Get A Quote">GET A QUOTE</a>

<!-- <a href="/request-samples?product_name={#{ dynamic_page_hubdb_row.name }}&brand={{ final_category|join(',') }#}">REQUEST SAMPLES</a> -->
<a href="{{dynamic_page_hubdb_row.request_samples_link}}?product_name={{ dynamic_page_hubdb_row.name }}&brand={{ dynamic_page_hubdb_row.brand[0].name }}&product_category={{ final_category|join(',') }}&website_lead_form_filled=REQUEST SAMPLES">REQUEST SAMPLES</a>
{% endif %}

{% if dynamic_page_hubdb_row.room_button_label %}<a href="javascript&colon;void(0)" id="trigger-modal" class="see_room">{{ dynamic_page_hubdb_row.room_button_label}}</a>{% endif %}

</div>
</div>
</div>

0 Avaliação positiva