CMS Development

EdCupaioli
Contributor

Image src slashes removed

SOLVE

Background

Created a repeating field group and I have an image as one of the fields. 

What I would expect

I would expect my image field src object to populate with the URL to the image containing slashes for each section of the URL path.

What I see

The image field src object is populated in the image src attribute with spaces replaced in the slashes:

Screenshot 2024-02-29 at 5.31.57 PM.png

I printed out the src object as a string and it populates correctly: 

Screenshot 2024-02-29 at 5.32.04 PM.png

Here is my code for full context:

 

 

<div class="team-grid">
  {% for item in module.team %}
  <div class="team-member>
    {% if item.team_image.src %}
      {% set sizeAttrs = 'width="{{ item.team_image.width }}" height="{{ item.team_image.height }}"' %}
      {% if item.team_image.size_type == 'auto' %}
        {% set sizeAttrs = 'width="{{ item.team_image.width }}" height="{{ item.team_image.height }}" style="max-width: 100%; height: auto;"' %}
      {% elif item.team_image.size_type == 'auto_custom_max' %}
        {% set sizeAttrs = 'width="{{ item.team_image.max_width }}" height="{{ item.team_image.max_height }}" style="max-width: 100%; height: auto;"' %}
      {% endif %}
       {% set loadingAttr = item.team_image.loading != 'disabled' ? 'loading="{{ item.team_image.loading }}"' : '' %}
      <img src="{{ item.team_image.src }}" data-image="{{ item.team_image.src }}" alt="{{ item.team_image.alt }}" {{ loadingAttr }} {{ sizeAttrs }}>
    {% endif %}
		<pre>{{ item.team_image.src }}</pre>
    <h4>
      {% inline_text field="team_name" value="{{ item.team_name }}" %}
    </h4>
    <p>
      {% inline_text field="team_role" value="{{ item.team_role }}" %}  
    </p>
  </div>
{% endfor %}  
</div>

 

 

0 Upvotes
1 Accepted solution
EdCupaioli
Solution
Contributor

Image src slashes removed

SOLVE

sigh....folks, always close your quotes. 

 

I didn't close the quote on the item wrapper and that's where I goofed. VS Code had it red too but I just thought that was because of the HubL. image.src works as it should, my eyes on the otherhand...

View solution in original post

0 Upvotes
1 Reply 1
EdCupaioli
Solution
Contributor

Image src slashes removed

SOLVE

sigh....folks, always close your quotes. 

 

I didn't close the quote on the item wrapper and that's where I goofed. VS Code had it red too but I just thought that was because of the HubL. image.src works as it should, my eyes on the otherhand...

0 Upvotes