CTA/Button

HTML

{% if module.cta.cta_type != 'none' %}
	<div class="btn-wrapper btn-{{ module.cta.cta_style }}-wrapper">
		{% if module.cta.cta_type == 'btn' %}
			<a href="{{ module.cta.link }}" class="cta_button">{{ module.cta.button_text }}</a>
		{% elif module.cta.cta_type == 'cta' %}
			{% cta guid="{{ module.cta.cta }}" %}
		{% endif %}
	</div>
{% endif %}

JSON

{
    "id": "cta",
    "name": "cta",
    "label": "CTA",
    "children": [
        {
            "id": "cta_type",
            "name": "cta_type",
            "label": "CTA Type",
            "required": true,
            "display": "select",
            "choices": [
                [
                    "cta",
                    "HubSpot CTA"
                ],
                [
                    "btn",
                    "Button"
                ],
                [
                    "none",
                    "None"
                ]
            ],
            "type": "choice",
            "default": "btn"
        },
        {
            "name": "cta_style",
            "label": "CTA Style",
            "visibility": {
                "controlling_field": "cta_type",
                "controlling_value_regex": "none",
                "operator": "NOT_EQUAL",
                "access": null
            },
            "display": "select",
            "choices": [
              [
								"primary",
								"Primary"
							],
							[
								"secondary",
								"Secondary"
							],
							[
								"tertiary",
								"Tertiary"
							],
							[
								"white",
								"White"
							],
							[
								"black",
								"Black"
							],
							[
								"outline-primary",
								"Outline Primary"
							],
							[
								"outline-secondary",
								"Outline Secondary"
							],
							[
								"outline-tertiary",
								"Outline Tertiary"
							],
							[
								"outline-white",
								"Outline White"
							],
							[
								"outline-black",
								"Outline Black"
							],
							[
								"none",
								"None"
							]
            ],
            "type": "choice",
            "default": "primary"
        },
        {
            "name": "cta",
            "label": "CTA",
            "visibility": {
                "controlling_field": "cta_type",
                "controlling_value_regex": "cta",
                "operator": "EQUAL",
                "access": null
            },
            "type": "cta",
            "default": ""
        },
        {
            "name": "button_text",
            "label": "Button Text",
            "visibility": {
                "controlling_field": "cta_type",
                "controlling_value_regex": "btn",
                "operator": "EQUAL",
                "access": null
            },
            "type": "text",
            "default": "Learn More"
        },
        {
            "name": "link",
            "label": "Link",
            "visibility": {
                "controlling_field": "cta_type",
                "controlling_value_regex": "btn",
                "operator": "EQUAL",
                "access": null
            },
            "type": "text",
            "default": "#"
        }
    ],
    "type": "group",
    "default": {
        "cta_type": "btn",
        "cta_style": "primary",
        "cta": "",
        "button_text": "Learn More",
        "link": "#"
    }
}