Hi, this is probably much easier than I am making it out to be but I can’t for the life of me figure it out. We have two sections (an image and text) in a custom module that I want to reverse the positions of (it’s currently set up so that the text is on the left and the image is on the right, I’d like it to be image on the left, text on the right). Attached is a screenshot of the module:
I’m also inserting the code for the module in the spoiler tag below, if someone could help that would be greatly appreciated.
Spoiler
<div {% if module.anchorid %}id=“{{ module.anchorid }}”{% endif %} class=“m-module m-visual-content overflow-x-hidden bg-{{ module.style.bg_color }} {% if module.style.min_100_vh %}min-vh-100{% endif %}”>
<div class=“container”>
<div class=“m-vc__inner position-relative”>
<div class=“m-vc__content”>
{% if module.title %}
<h2>{{ module.title }}</h2>
{% endif %}
{% if module.subtitle %}
<h3 class=“h5 text-dark mb-5”>{{ module.subtitle }}</h3>
{% endif %}
{% if module.usp %}
<div class=“d-flex flex-column gap-4 mt-4”>
{% for item in module.usp %}
<div class=“c-bulletpoint__title”>
<svg xmlns=“SVG namespace” width=“36” height=“36” viewBox=“0 0 36 36” fill=“none”>
<path d=“M18.5714 30.0002L30 18.0002L18.5714 6.00024M6 30.0002L17.4286 18.0002L6 6.00024” stroke=“#775BC5” style=“stroke:#775BC5;stroke:color(display-p3 0.4667 0.3569 0.7725);stroke-opacity:1;” stroke-width=“3” stroke-linecap=“round” stroke-linejoin=“round”/>
</svg>
<span class=“h6 text-dark mb-0”>{{ item }}</span>
</div>
{% endfor %}
</div>
{% endif %}
{% if module.cta.text %}
{% set href = module.cta.link.url.href %}
{% if module.cta.link.url.type is equalto “EMAIL_ADDRESS” %}
{% set href = “mailto:” + href %}
{% endif %}
<a href=“{{ href }}” class=“btn btn-{{ module.cta.type }} mt-4”
{% if module.cta.link.open_in_new_tab %}target=“_blank”{% endif %}
{% if module.cta.link.rel %}rel=“{{ module.cta.link.rel }}”{% endif %}>
{{ module.cta.text }}
</a>
{% endif %}
</div>
<div class=“m-vc__image”>
{% if module.image.src %}
{% set sizeAttrs = ‘width=“{{ module.image.width }}” height=“{{ module.image.height }}”’ %}
{% if module.image.size_type == ‘auto’ %}
{% set sizeAttrs = ‘width=“{{ module.image.width }}” height=“{{ module.image.height }}” style=“max-width: 100%; height: auto;”’ %}
{% elif module.image.size_type == ‘auto_custom_max’ %}
{% set sizeAttrs = ‘width=“{{ module.image.max_width }}” height=“{{ module.image.max_height }}” style=“max-width: 100%; height: auto;”’ %}
{% endif %}
{% set loadingAttr = module.image.loading != ‘disabled’ ? ‘loading=“{{ module.image.loading }}”’ : ‘’ %}
<img src=“{{ module.image.src }}” alt=“{{ module.image.alt }}” {{ loadingAttr }} {{ sizeAttrs }}>
{% endif %}
</div>
</div>
</div>
</div>
