CMS Development

hipya
Member

How to set the size field of an image?

SOLVE

I am trying to create a template as explained in the academy videos but my images are not resized correctly.

  {% dnd_area "body_dnd_area" label="DND Area" %}
    {% dnd_section 
      max_width=1000,
      vertical_alignment='MIDDLE',
      label="DND Section"
    %}      
      {% dnd_column width=8 %}
        {% dnd_row %}
          {% dnd_module path='@hubspot/rich_text', label="Rich Text" %}
            {% module_attribute "html"%}
              <h3>This text should be linked to the image ---></h3>
              <p>Here you can tell visitors more about it.</p>
            {% end_module_attribute %}
          {% end_dnd_module %}
        {% end_dnd_row %}
      {% end_dnd_column %}
      {% dnd_column width=4, offset=8 %}
        {% dnd_row %}
          {% dnd_module "image" path="@hubspot/image" %}
          {% module_attribute "img" %}
            {
              src: "../images/tesla_model3.png",
              alt: "Tesla model 3",
            }
          {% end_module_attribute %}
          {% end_dnd_module %}
        {% end_dnd_row %}
      {% end_dnd_column %}
    {% end_dnd_section %}
  {% end_dnd_area %}

I am looking to set the field of size to automatic but was not able to find it anywhere. What I mean is this option in the editor:

editorSreen.png

 

Hope anyone can help me and have a good one. 🙂

0 Upvotes
1 Accepted solution
alyssamwilie
Solution
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

How to set the size field of an image?

SOLVE

@hipya The attribute you want is size_type, set to auto (or auto_custom_max if you want to set a maximum width and height).

{
  src: "../images/tesla_model3.png",
  alt: "Tesla model 3",
  size_type: "auto"
}

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.

View solution in original post

0 Upvotes
2 Replies 2
alyssamwilie
Solution
Recognized Expert | Elite Partner
Recognized Expert | Elite Partner

How to set the size field of an image?

SOLVE

@hipya The attribute you want is size_type, set to auto (or auto_custom_max if you want to set a maximum width and height).

{
  src: "../images/tesla_model3.png",
  alt: "Tesla model 3",
  size_type: "auto"
}

If this answer solved your question, please mark it as the solution.

Alyssa Wilie Profile Image

Alyssa Wilie

Web Developerat Lynton

Learn HubL | Get Marketing Insights

HubSpot Elite Solutions Partner
Lynton's HubSpot theme Rubric now available. Click to download.
0 Upvotes
hipya
Member

How to set the size field of an image?

SOLVE

Thank you. 🙂

0 Upvotes