CMS Development

hannalofving
Colaborador | Partner nivel Platinum
Colaborador | Partner nivel Platinum

Embed CTA in blog post template

I would like to edit my post template for one of our blogs to include a CTA-picker that presents a CTA in the bottom of the blog post.

 

I have added this code to my template. First I create the CTA at the top of my template like this:
{% cta 'my_cta' label='Välj CTA', guid='14e89f20-dc26-4e8e-ba93-01741014f967', image_src='
https://no-cache.hubspot.com/cta/default/2636281/14e89f20-dc26-4e8e-ba93-01741014f967.png' %}

My problem is when I'm trying to present the CTA, this is what I have tried the latest:
{{ widget_data.my_cta.embed_code}}
But nothing is presented.

I have tried to extract other things from my "my_cta" but without success. I have tried all the from this page
https://designers.hubspot.com/docs/hubl/hubl-supported-tags#hs_cos_wrapper_widget_2808334243

And I have also tried to instead of a CTA in the beginning created a text object and using that text object to create a new CTA directly in the code where I want my CTA.
But I don't know how to nest the variables and the functions.

 

This is my line as I tried it:
{{ cta(' {{ widget_data.cta_guid.value }}') }}

Which method is best for me? Can anyone help me with the correct code for the best method?

(Note that I have 4 different blog types, hence the if group.id)

Here are my declarations, I have tried using CTA and TEXT fieldsHere are my declarations, I have tried using CTA and TEXT fieldsHow can I get the CTA and present it?How can I get the CTA and present it?

0 Me gusta
3 Respuestas 3
lscanlan
Exmiembro de HubSpot
Exmiembro de HubSpot

Embed CTA in blog post template

Hi @hannalofving,

 

To get the module's data into the widget_data dictionary, you'll need to add the export_to_template_context=true parameter to the module tag. That parameter is documented here: https://designers.hubspot.com/docs/hubl/export-to-template-context. So in your case that would look something like this:

 

{% cta 'my_cta' label='Välj CTA', guid='14e89f20-dc26-4e8e-ba93-01741014f967', image_src='https://no-cache.hubspot.com/cta/default/2636281/14e89f20-dc26-4e8e-ba93-01741014f967.png', export_to_template_context=true %}

 

That will prevent the actual CTA module from being printed into the HTML. And instead the module data will be exported into the widget_data dictionary. I'd also suggest taking a look at this article about using the Developer Info tab: https://designers.hubspot.com/docs/hubl/how-to-use-developer-info-on-cos-pages/. That will make it easier to see how to access values in HubL, like within widget_data for example.

 

You also could probably build a custom module for this, where the blog post author would have a field(s) for enntering in the value they need. I wrote up a sort of tutorial on how to access module data through HubL here: https://community.hubspot.com/t5/Share-Your-Work/How-to-add-Featured-Video-functionality-to-a-blog/m....

 

If you're still having trouble, could you link me to the blog you're working on? I'll be happy to take a closer look.

Leland Scanlan

HubSpot Developer Support
0 Me gusta
hannalofving
Colaborador | Partner nivel Platinum
Colaborador | Partner nivel Platinum

Embed CTA in blog post template

@lscanlan Thanks for your reply!

However, I made a quick fix and removed my cta as for now, but will test your suggestion when I have time to look in to the problem again.

0 Me gusta
lscanlan
Exmiembro de HubSpot
Exmiembro de HubSpot

Embed CTA in blog post template

Ok, sounds good! If you run into questions next time, feel free to reply here and I'll take a look then.

Leland Scanlan

HubSpot Developer Support
0 Me gusta