# Solution: Making a smart module completely invisible

**URL:** <https://community.hubspot.com/t/solution-making-a-smart-module-completely-invisible/153543>\
**Category:** Tips, Tricks & Best Practices\
**Tags:** tips\
**Created:** [July 20, 2026, 2:11pm UTC](https://community.hubspot.com/t/solution-making-a-smart-module-completely-invisible/153543 "2026-07-20T14:11:27Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![MyaRiley](https://avatars.discourse-cdn.com/v4/letter/m/fbc32d/32.png) [@MyaRiley](https://community.hubspot.com/u/MyaRiley)\
**Post date:** [July 20, 2026, 2:11pm UTC](https://community.hubspot.com/t/solution-making-a-smart-module-completely-invisible/153543/1 "2026-07-20T14:11:27Z")

</div>

I’ve found a way to completely hide smart modules, without awkward spaces left behind.

You can use Design Manager to create a custom reusable email module that is invisible (including padding) unless you flip a toggle. The process:

1. Create the custom module using the settings and code below.
2. Add the module to your email. It will be invisible by default.
3. Make the module smart and add your segment rule.
4. Leave the toggle off for the default version.
5. Switch to the segment-specific version, turn the toggle on, and add your content.

Because the content **and padding** are wrapped inside the visibility condition, the default audience won’t see the module or any empty space where it would have appeared.

**Creating the Module**

1. Create a new email module (Design Manager \> Create a new file \> Module \> Emails \> Local module)
2. Add two fields (see screenshots):
  1. A Boolean field named `show_module`, with the toggle off by default.
  2. A rich-text field named `block_content`, with placeholder text as the default.

3. Paste this code into the coding space:

```auto
{% if module.show_module %}
<table role="presentation" 
width="100%"
cellpadding="0"
cellspacing="0"
border="0"
style="width: 100%; border-collapse: collapse;"> 
<tr> 
<td style="padding: 10px 20px;"> 
{{ module.block_content }}
 </td>
 </tr> 
</table>
 {% endif %}

```

1. Adjust the padding to your specifications; I typically use 10 on the top and bottom and 20 on either side so that’s what you see here. Look for this line in the code to adjust: `<td style="padding: 10px 20px;">`

You can also add other styling if you want (I used ChatGPT to write it for me), including background colors that won’t show up in the default! Just make sure it’s all inside the `{% if module.show_module %}` condition.

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/b/e/beb051bd0a902707535917a225c37ba4f6314df2.jpeg)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/5/4/54e8ca090a095f1ef590d3d35cb23cdcf64774d8.png)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/3/6/363cad93a0cb35a5ca46effdf36ac23b138a1b9b.png)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/a/0/a05675b5a034934d817ba4371508f5bddee8a83a.png)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/1/7/1723ac697300cfc999e146a646025fe99ab91571.png)

---

<div class="post-metadata">

**Author:** ![chighsmith](https://avatars.discourse-cdn.com/v4/letter/c/77aa72/32.png) [@chighsmith](https://community.hubspot.com/u/chighsmith)\
**Post date:** [July 20, 2026, 2:14pm UTC](https://community.hubspot.com/t/solution-making-a-smart-module-completely-invisible/153543/3 "2026-07-20T14:14:12Z")

</div>

Hi @MyaRiley,

This is such a clever workaround! Thank you for taking the time to document it so thoroughly! The step-by-step breakdown and screenshots make it really easy to follow. The fact that it eliminates the empty space issue is a game-changer for anyone working with smart content in emails. 🙌

Happy HubSpotting!

Cassie, Community Manager

---

<div class="post-metadata">

**Author:** ![MyaRiley](https://avatars.discourse-cdn.com/v4/letter/m/fbc32d/32.png) [@MyaRiley](https://community.hubspot.com/u/MyaRiley)\
**Post date:** [July 21, 2026, 6:47pm UTC](https://community.hubspot.com/t/solution-making-a-smart-module-completely-invisible/153543/4 "2026-07-21T18:47:31Z")

</div>

Update: I played around with Design Manager and ChatGPT more and created a version of the disappearing block that allows for **full design control from inside the marketing email drag-and-drop editor, including adding a button** , instead of having to hard-code the design every time.

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/8/b/8b75298a3d180dfd3e15a59ce9fa9fec0e7af9ff.jpeg)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/4/e/4e550c1c34af747aaa7d823d9ca3d167871ffbd5.jpeg)

## **Making a Fully Customizable Disappearing Block w. Optional Button**

### Step 1: Build the Fields

You’re going to use two types of fields:

**1. Fields:**

1. A Boolean field named `show_module`, with the toggle _off_ by default.
2. A rich-text field named `block_content`, with placeholder text as the default.
3. A Boolean field named `show_button`, with the toggle _off_ by default.
4. \*A text field named `button_text`, with placeholder text as the default.
5. \*A link field named `button_link`.

**2. Style Fields:**

1. A color field named `background_color`.
2. A number field named `corner_radius`, with the suffix “px”, a minimum value of 0 and a maximum of 50.
3. A field group\*\* named `border_controls`, with 1 field inside:
  1. A border field named `border_field`.

4. A field group\*\* named `padding_controls` with 2 fields inside:
  1. A spacing field named `external_padding`. (This controls the padding _outside_ of the smart block’s custom background color, if you use a color.)
  2. A spacing field named `internal_padding`. (This controls the padding _inside_ the smart block’s custom background color.)

5. \*A field group\*\* named `button_styling`, with 4 fields and 2 field groups inside:
  1. A color field named `button_background_color`.
  2. A font field named `button_text_style`.
  3. A number field named `button_corner_radius`, with the suffix “px”, a minimum value of 0 and a maximum of 50.
  4. An alignment field named `button_alignment`.
  5. A field group\*\* named `button_border_controls`, with 1 field inside:
    1. A border field named `button_border`.

  6. A field group\*\* named `button_padding_controls`, with 2 fields inside:
    1. A spacing field named `button_external_padding`. (This controls the padding _around_ the button.)
    2. A spacing field named `button_internal_padding`. (This controls the padding _inside_ the button.)

\* A single asterisk in front means I turned on that field/field group’s optional display condition so it only appears when the “show button” toggle is on. It makes the settings cleaner. See last screenshot below for those settings.

\*\* Field groups make the settings cleaner & easier to work with. Each group will appear as an accordion block in the editor (see screenshots above). To make a field group, first make the field(s) that go inside it. Then click “Actions” at the top of the Style Fields section, and then choose “Group”. Select the field(s) you made and click “Create group”. Name the group and set any display conditions.

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/f/2/f2558f3274db001b2b7c9f642da9a473aeb3ab92.jpeg)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/2/5/2585fe67cb23c0a6d39595b33f4a0af1a7807d4d.png)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/2/d/2d7084ffc5907f9100e76124b631a6eae3e22303.png)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/a/d/adac53c793eee56020112aff8e5414b9834ad872.png)

 ![image](https://d2qpr2jzcazej7.cloudfront.net/original/3X/5/c/5c33495bd74d9ccd6a135f29984a8aedb0538923.png)

### Step 2: Paste the Code

Paste the following code into the code space:

**Note:** ChatGPT said that margins render less effectively than padding, which is why there are fields for both internal and external padding. I couldn’t get rid of the margin option in the editor, but I updated the code to only read the padding instructions. If you want to use margins as well as padding, you should update the code.

```plaintext
{% if module.show_module %}

<table role="presentation"
       width="100%"
       cellpadding="0"
       cellspacing="0"
       border="0"
       style="width: 100%; border-collapse: collapse;">
  <tr>
    <td style="
      padding-top: {{ module.style.padding_controls.external_padding.padding.top.value }}{{ module.style.padding_controls.external_padding.padding.top.units }};
      padding-right: {{ module.style.padding_controls.external_padding.padding.right.value }}{{ module.style.padding_controls.external_padding.padding.right.units }};
      padding-bottom: {{ module.style.padding_controls.external_padding.padding.bottom.value }}{{ module.style.padding_controls.external_padding.padding.bottom.units }};
      padding-left: {{ module.style.padding_controls.external_padding.padding.left.value }}{{ module.style.padding_controls.external_padding.padding.left.units }};
    ">

      <table role="presentation"
             width="100%"
             cellpadding="0"
             cellspacing="0"
             border="0"
             style="
               width: 100%;
               border-collapse: separate;
               border-spacing: 0;
               border-radius: {{ module.style.corner_radius }}px;
               overflow: hidden;
             ">
        <tr>
          <td bgcolor="{{ module.style.background_color.color }}"
              style="
                padding-top: {{ module.style.padding_controls.internal_padding.padding.top.value }}{{ module.style.padding_controls.internal_padding.padding.top.units }};
                padding-right: {{ module.style.padding_controls.internal_padding.padding.right.value }}{{ module.style.padding_controls.internal_padding.padding.right.units }};
                padding-bottom: {{ module.style.padding_controls.internal_padding.padding.bottom.value }}{{ module.style.padding_controls.internal_padding.padding.bottom.units }};
                padding-left: {{ module.style.padding_controls.internal_padding.padding.left.value }}{{ module.style.padding_controls.internal_padding.padding.left.units }};
                {{ module.style.border_controls.border_field.css }}
                background-color: {{ module.style.background_color.color }};
                border-radius: {{ module.style.corner_radius }}px;
                overflow: hidden;
              ">

            {{ module.block_content }}

            {% if module.show_button %}

              {% set button_url = module.button_link.url.href %}

              {% if module.button_link.url.type == "EMAIL_ADDRESS" %}
                {% set button_url = "mailto:" ~ button_url %}
              {% endif %}

              <table role="presentation"
                     width="100%"
                     cellpadding="0"
                     cellspacing="0"
                     border="0"
                     style="width: 100%; border-collapse: collapse;">
                <tr>
                  <td align="{{ module.style.button_styling.button_alignment.horizontal_align|lower }}"
                      valign="{{ module.style.button_styling.button_alignment.vertical_align|lower }}"
                      style="
                        padding-top: {{ module.style.button_styling.button_padding_controls.button_external_padding.padding.top.value }}{{ module.style.button_styling.button_padding_controls.button_external_padding.padding.top.units }};
                        padding-right: {{ module.style.button_styling.button_padding_controls.button_external_padding.padding.right.value }}{{ module.style.button_styling.button_padding_controls.button_external_padding.padding.right.units }};
                        padding-bottom: {{ module.style.button_styling.button_padding_controls.button_external_padding.padding.bottom.value }}{{ module.style.button_styling.button_padding_controls.button_external_padding.padding.bottom.units }};
                        padding-left: {{ module.style.button_styling.button_padding_controls.button_external_padding.padding.left.value }}{{ module.style.button_styling.button_padding_controls.button_external_padding.padding.left.units }};
                        text-align: {{ module.style.button_styling.button_alignment.horizontal_align|lower }};
                        vertical-align: {{ module.style.button_styling.button_alignment.vertical_align|lower }};
                      ">

                    <table role="presentation"
                           cellpadding="0"
                           cellspacing="0"
                           border="0"
                           align="{{ module.style.button_styling.button_alignment.horizontal_align|lower }}"
                           style="
                             border-collapse: separate;
                             border-spacing: 0;
                             border-radius: {{ module.style.button_styling.button_corner_radius }}px;
                           ">
                      <tr>
                        <td align="center"
                            bgcolor="{{ module.style.button_styling.button_background_color.color }}"
                            style="
                            {{ module.style.button_styling.button_border_controls.button_border.css }}
                            background-color: {{ module.style.button_styling.button_background_color.color }};
                            border-radius: {{ module.style.button_styling.button_corner_radius }}px;
                           text-align: center;
                           overflow: hidden;
                         ">

                          <a href="{{ button_url }}"
                             style="
                               padding-top: {{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.top.value }}{{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.top.units }};
                               padding-right: {{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.right.value }}{{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.right.units }};
                               padding-bottom: {{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.bottom.value }}{{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.bottom.units }};
                               padding-left: {{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.left.value }}{{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.left.units }};
                               {{ module.style.button_styling.button_text_style.css }}
                               display: inline-block;
                               background-color: {{ module.style.button_styling.button_background_color.color }};
                               border-radius: {{ module.style.button_styling.button_corner_radius }}px;
                               line-height: 1.2;
                               text-decoration: none;
                               text-align: center;
                             "
                             {% if module.button_link.open_in_new_tab %}
                               target="_blank"
                             {% endif %}
                             {% if module.button_link.rel %}
                               rel="{{ module.button_link.rel }}"
                             {% endif %}>
                            {{ module.button_text }}
                          </a>

                        </td>
                      </tr>
                    </table>

                  </td>
                </tr>
              </table>

            {% endif %}

          </td>
        </tr>
      </table>

    </td>
  </tr>
</table>

{% endif %}

```

---

<div class="post-metadata">

**Author:** ![MyaRiley](https://avatars.discourse-cdn.com/v4/letter/m/fbc32d/32.png) [@MyaRiley](https://community.hubspot.com/u/MyaRiley)\
**Post date:** [August 10, 2026, 10:00pm UTC](https://community.hubspot.com/t/solution-making-a-smart-module-completely-invisible/153543/7 "2026-08-10T22:00:48Z")

</div>

Another update! I’ve made the disappearing smart block work with images as well as buttons. Now, you can have any combination of image, rich text, and button in your disappearing module.

I’ve also discovered that you can use smart modules to make a multi-column section disappear, as long as you have no padding in the section itself and all of the modules have the same smart rule.

![Disappearing Smart Block GIF](https://d2qpr2jzcazej7.cloudfront.net/original/3X/f/5/f5e2ae1adafc4c22a37614f894272ebe11d5f423.gif)

How to do it:

To your fields, you’re going to add:

1. A Boolean field named `show_text`, with the toggle _off_ by default.

2. A Boolean field named `show_image`, with the toggle _off_ by default.

3. \*An image field named `block_image`

4. \*A link field named `image_link`

5. A choice field named `content_order`with the following options:

To your style fields, you’re going to add:

1. A field group named `image_styling` containing:
  1. A number field named `image_corner_radius`, withthe same settings as the other radius fields.
  2. A field group named `image_padding_controls` containing:
    1. A spacing field named `image_spacing`

Here’s the updated code:

(The code ensures that if neither the text, button, or image is turned on, the module will be invisible, regardless of the “show module” toggle’s position. This prevents an empty rectangle from appearing.)

```auto
{# ---------------------------------------------------------
   Determine which content elements actually contain output
---------------------------------------------------------- #}

{% set has_image =
  module.show_image
  and module.block_image.src
%}

{% set has_text =
  module.show_text
  and module.block_content
%}

{% set has_button =
  module.show_button
  and module.button_text
%}

{# ---------------------------------------------------------
   Image
---------------------------------------------------------- #}

{% macro render_block_image() %}

  {% if has_image %}

    {% set image_url = module.image_link.url.href %}

    {% if module.image_link.url.type == "EMAIL_ADDRESS" %}
      {% set image_url = "mailto:" ~ image_url %}
    {% endif %}

    <table role="presentation"
           width="100%"
           cellpadding="0"
           cellspacing="0"
           border="0"
           style="
             width: 100%;
             border-collapse: collapse;
           ">
      <tr>
        <td style="
          padding-top: {{ module.style.image_styling.image_padding_controls.image_spacing.padding.top.value }}{{ module.style.image_styling.image_padding_controls.image_spacing.padding.top.units }};
          padding-right: {{ module.style.image_styling.image_padding_controls.image_spacing.padding.right.value }}{{ module.style.image_styling.image_padding_controls.image_spacing.padding.right.units }};
          padding-bottom: {{ module.style.image_styling.image_padding_controls.image_spacing.padding.bottom.value }}{{ module.style.image_styling.image_padding_controls.image_spacing.padding.bottom.units }};
          padding-left: {{ module.style.image_styling.image_padding_controls.image_spacing.padding.left.value }}{{ module.style.image_styling.image_padding_controls.image_spacing.padding.left.units }};
        ">

          {% if image_url %}
            <a href="{{ image_url }}"
               style="
                 display: block;
                 text-decoration: none;
                 border: 0;
               "
               {% if module.image_link.open_in_new_tab %}
                 target="_blank"
               {% endif %}
               {% if module.image_link.rel %}
                 rel="{{ module.image_link.rel }}"
               {% endif %}>
          {% endif %}

            <img src="{{ module.block_image.src }}"
                 alt="{{ module.block_image.alt|escape_attr }}"
                 width="{{ module.block_image.width }}"
                 style="
                   display: block;
                   width: 100%;
                   max-width: 100%;
                   height: auto;
                   border: 0;
                   border-radius: {{ module.style.image_styling.image_corner_radius }}px;
                 ">

          {% if image_url %}
            </a>
          {% endif %}

        </td>
      </tr>
    </table>

  {% endif %}

{% endmacro %}

{# ---------------------------------------------------------
   Rich text
---------------------------------------------------------- #}

{% macro render_block_text() %}

  {% if has_text %}
    {{ module.block_content }}
  {% endif %}

{% endmacro %}

{# ---------------------------------------------------------
   Button
---------------------------------------------------------- #}

{% macro render_block_button() %}

  {% if has_button %}

    {% set button_url = module.button_link.url.href %}

    {% if module.button_link.url.type == "EMAIL_ADDRESS" %}
      {% set button_url = "mailto:" ~ button_url %}
    {% endif %}

    <table role="presentation"
           width="100%"
           cellpadding="0"
           cellspacing="0"
           border="0"
           style="
             width: 100%;
             border-collapse: collapse;
           ">
      <tr>
        <td align="{{ module.style.button_styling.button_alignment.horizontal_align|lower }}"
            valign="{{ module.style.button_styling.button_alignment.vertical_align|lower }}"
            style="
              padding-top: {{ module.style.button_styling.button_padding_controls.button_external_padding.padding.top.value }}{{ module.style.button_styling.button_padding_controls.button_external_padding.padding.top.units }};
              padding-right: {{ module.style.button_styling.button_padding_controls.button_external_padding.padding.right.value }}{{ module.style.button_styling.button_padding_controls.button_external_padding.padding.right.units }};
              padding-bottom: {{ module.style.button_styling.button_padding_controls.button_external_padding.padding.bottom.value }}{{ module.style.button_styling.button_padding_controls.button_external_padding.padding.bottom.units }};
              padding-left: {{ module.style.button_styling.button_padding_controls.button_external_padding.padding.left.value }}{{ module.style.button_styling.button_padding_controls.button_external_padding.padding.left.units }};
              text-align: {{ module.style.button_styling.button_alignment.horizontal_align|lower }};
              vertical-align: {{ module.style.button_styling.button_alignment.vertical_align|lower }};
            ">

          <table role="presentation"
                 cellpadding="0"
                 cellspacing="0"
                 border="0"
                 align="{{ module.style.button_styling.button_alignment.horizontal_align|lower }}"
                 style="
                   border-collapse: separate;
                   border-spacing: 0;
                   border-radius: {{ module.style.button_styling.button_corner_radius }}px;
                 ">
            <tr>
              <td align="center"
                  bgcolor="{{ module.style.button_styling.button_background_color.color }}"
                  style="
                    {{ module.style.button_styling.button_border_controls.button_border.css }}
                    background-color: {{ module.style.button_styling.button_background_color.color }};
                    border-radius: {{ module.style.button_styling.button_corner_radius }}px;
                    text-align: center;
                    overflow: hidden;
                  ">

                <a href="{{ button_url }}"
                   style="
                     padding-top: {{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.top.value }}{{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.top.units }};
                     padding-right: {{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.right.value }}{{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.right.units }};
                     padding-bottom: {{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.bottom.value }}{{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.bottom.units }};
                     padding-left: {{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.left.value }}{{ module.style.button_styling.button_padding_controls.button_internal_padding.padding.left.units }};
                     {{ module.style.button_styling.button_text_style.css }}
                     display: inline-block;
                     background-color: {{ module.style.button_styling.button_background_color.color }};
                     border-radius: {{ module.style.button_styling.button_corner_radius }}px;
                     line-height: 1.2;
                     text-decoration: none;
                     text-align: center;
                   "
                   {% if module.button_link.open_in_new_tab %}
                     target="_blank"
                   {% endif %}
                   {% if module.button_link.rel %}
                     rel="{{ module.button_link.rel }}"
                   {% endif %}>
                  {{ module.button_text }}
                </a>

              </td>
            </tr>
          </table>

        </td>
      </tr>
    </table>

  {% endif %}

{% endmacro %}

{# ---------------------------------------------------------
   Module container
---------------------------------------------------------- #}

{% if module.show_module and (has_image or has_text or has_button) %}

  <table role="presentation"
         width="100%"
         cellpadding="0"
         cellspacing="0"
         border="0"
         style="
           width: 100%;
           border-collapse: collapse;
         ">
    <tr>
      <td style="
        padding-top: {{ module.style.padding_controls.external_padding.padding.top.value }}{{ module.style.padding_controls.external_padding.padding.top.units }};
        padding-right: {{ module.style.padding_controls.external_padding.padding.right.value }}{{ module.style.padding_controls.external_padding.padding.right.units }};
        padding-bottom: {{ module.style.padding_controls.external_padding.padding.bottom.value }}{{ module.style.padding_controls.external_padding.padding.bottom.units }};
        padding-left: {{ module.style.padding_controls.external_padding.padding.left.value }}{{ module.style.padding_controls.external_padding.padding.left.units }};
      ">

        <table role="presentation"
               width="100%"
               cellpadding="0"
               cellspacing="0"
               border="0"
               style="
                 width: 100%;
                 border-collapse: separate;
                 border-spacing: 0;
                 border-radius: {{ module.style.corner_radius }}px;
               ">
          <tr>
            <td bgcolor="{{ module.style.background_color.color }}"
                style="
                  padding-top: {{ module.style.padding_controls.internal_padding.padding.top.value }}{{ module.style.padding_controls.internal_padding.padding.top.units }};
                  padding-right: {{ module.style.padding_controls.internal_padding.padding.right.value }}{{ module.style.padding_controls.internal_padding.padding.right.units }};
                  padding-bottom: {{ module.style.padding_controls.internal_padding.padding.bottom.value }}{{ module.style.padding_controls.internal_padding.padding.bottom.units }};
                  padding-left: {{ module.style.padding_controls.internal_padding.padding.left.value }}{{ module.style.padding_controls.internal_padding.padding.left.units }};
                  {{ module.style.border_controls.border_field.css }}
                  background-color: {{ module.style.background_color.color }};
                  border-radius: {{ module.style.corner_radius }}px;
                  overflow: hidden;
                ">

              {# Image → Text → Button #}
              {% if module.content_order == "image_text_button" %}

                {{ render_block_image() }}
                {{ render_block_text() }}
                {{ render_block_button() }}

              {# Image → Button → Text #}
              {% elif module.content_order == "image_button_text" %}

                {{ render_block_image() }}
                {{ render_block_button() }}
                {{ render_block_text() }}

              {# Text → Image → Button #}
              {% elif module.content_order == "text_image_button" %}

                {{ render_block_text() }}
                {{ render_block_image() }}
                {{ render_block_button() }}

              {# Text → Button → Image #}
              {% elif module.content_order == "text_button_image" %}

                {{ render_block_text() }}
                {{ render_block_button() }}
                {{ render_block_image() }}

              {# Button → Image → Text #}
              {% elif module.content_order == "button_image_text" %}

                {{ render_block_button() }}
                {{ render_block_image() }}
                {{ render_block_text() }}

              {# Button → Text → Image #}
              {% elif module.content_order == "button_text_image" %}

                {{ render_block_button() }}
                {{ render_block_text() }}
                {{ render_block_image() }}

              {# Safe fallback if Content Order has no value #}
              {% else %}

                {{ render_block_image() }}
                {{ render_block_text() }}
                {{ render_block_button() }}

              {% endif %}

            </td>
          </tr>
        </table>

      </td>
    </tr>
  </table>

{% endif %}

```