CMS Development

andre9000
Contributeur

Display template content conditionally

Résolue

This is probably an easy one, but I can not figure it out how to hide an element if it has no value:

 

<h1>{% text "h1" label='Enter H1', value='This is the H1' %}</h1>  

<style>
{% if "h1" is none or "h1" == "" %}
  h1 {
    display: none;
  }  
{% endif %}
</style>

This doesn't work, H1 never gets "display: none;". 

 

If I try 

{% if h1 is none or h1 == "" %}

instead (no "" around the name), it will hide H1 even if it has a value.

1 Solution acceptée
tjoyce
Solution
Expert reconnu | Partenaire solutions Elite
Expert reconnu | Partenaire solutions Elite

Display template content conditionally

Résolue

@Hello @andre9000 - Your HUBL tags are going to be in a dictionary, so you would inspect the data cominng from your tag by accessing "widget_data". You should combine this with the "export_to_template_context" tag attribute as well.

Shorthand:

{% text "h1" label="Enter H1" value="This is the H1" export_to_template_context="true" %}
{{'<h1>'+widget_data.h1.value+'</h1>' if widget_data.h1.value != ""}}

Or, longhand:

{% text "h1" label="Enter H1" value="This is the H1" export_to_template_context="true" %}
{% if widget_data.h1.value != '' %}
  <h1>{{widget_data.h1.value}}</h1>
{% endif %}

If this answer helped, please, mark as solved 😄


tim@belch.io | forms.belch.io | Design your own Beautiful HubSpot Forms; No coding necessary.

 

Drop by and say Hi to me on slack.

Voir la solution dans l'envoi d'origine

3 Réponses
tjoyce
Solution
Expert reconnu | Partenaire solutions Elite
Expert reconnu | Partenaire solutions Elite

Display template content conditionally

Résolue

@Hello @andre9000 - Your HUBL tags are going to be in a dictionary, so you would inspect the data cominng from your tag by accessing "widget_data". You should combine this with the "export_to_template_context" tag attribute as well.

Shorthand:

{% text "h1" label="Enter H1" value="This is the H1" export_to_template_context="true" %}
{{'<h1>'+widget_data.h1.value+'</h1>' if widget_data.h1.value != ""}}

Or, longhand:

{% text "h1" label="Enter H1" value="This is the H1" export_to_template_context="true" %}
{% if widget_data.h1.value != '' %}
  <h1>{{widget_data.h1.value}}</h1>
{% endif %}

If this answer helped, please, mark as solved 😄


tim@belch.io | forms.belch.io | Design your own Beautiful HubSpot Forms; No coding necessary.

 

Drop by and say Hi to me on slack.

andre9000
Contributeur

Display template content conditionally

Résolue

Awesome, works perfectly. Thank you, good to know!

andre9000
Contributeur

Display template content conditionally

Résolue

a nicer approach of course would be no wrap the element itself in a condition, so it doesn't get into the markup if it's empty. However, this doesn't seem to work, because then it is not possible to set a value for h1 anymore.

0 Votes