widget_data value in blog listing

[matttunney]

Hi,

I've created a setting for each blog post to set the perferred width on a listing page.

{% choice "post_width" label='Blog - preferred listing width', value='8', choices='[[\"4\", \"small\"], [\"8\", \"Medium\"], [\"12\", \"large\"]]', export_to_template_context=True, no_wrapper=True %}

This is custom hubl inside the blog post content.

Is there a way to access this value for each post in the listings view?

Thanks

[TRooInbound]

Hi @matttunney,

You can access this value for each post in the listings view by using below code.

{{ content.widgets.post_width.body.value }}

It will give you the value you set for the blog post in blog listing page

Hope it works for you 🙂

Team TRooInbound

[matttunney · Accepted solution]

Thanks for the reply -

I've managed to get this working. Written a loop to update the column span{{width}} class based on the provided  value, but with a default value if the  blog post item doesn't have the module listed within 'content.widgets'

The loop calculates the sum of the widths and rounds down the last item to ensure the total is always 12 before creating a new .row-fluid-wrapper>.row-fluid container. See below.

In the below example the blog-post-width value is set using a custom hubl module.

Is that the best approach or can I just add some custom hubl to the page template?

Thanks

<section class="post-listing{% if simple_list_page %}-simple{% endif %}">
  <div class="row-fluid-wrapper">
      <div class="row-fluid">

      {% set count = 0 %}
      {% set max = 3 %}
      {% set total = 0 %}

      {% for content in contents %}
          
          {% if not simple_list_page %}
          
            {% if content.widgets.module_151618187561037.body.blog_post_width is defined %}
                {% set width = content.widgets.module_151618187561037.body.blog_post_width / 4 %}
            {% else %}
                {% set width = '1' %}
            {% endif %}

            {% set total = total|add(width) %}

            {% if total > max %}
                {% set width = max -(total - width) %}
            {% endif %}
            
            <article class="post-item span{{ width|multiply(4)|round(0, 'floor') }}">
                {#
                pref width {{ content.widgets.module_151618187561037.body.blog_post_width }}
                count: {{ count }}
                total: {{ total }}
                adjusted width: {{ width|multiply(4)|round(0, 'floor') }}
                 #}
                <header class="post-header">
                    <h2><a href="{{content.absolute_url}}">{{ content.name }}</a></h2>
                    <p id="hubspot-author_data" class="hubspot-editable post-meta" data-hubspot-form-id="author_data" data-hubspot-name="Blog Author">
                        Posted 
                        {%if content.blog_post_author %}
                            by <a class="author-link" href="{{ group.absolute_url }}/author/{{ content.blog_post_author.slug }}">{{ content.blog_post_author.display_name }}</a>
                        {% endif %}
                        on {{ content.publish_date_localized }}
                    </p>
                </header>
                <div class="post-body">
               {% if content.post_list_summary_featured_image %}
                    <div class="hs-featured-image-wrapper">
                        <a href="{{content.absolute_url}}" title="" class="hs-featured-image-link">
                            <img src="{{ content.post_list_summary_featured_image }}" class="hs-featured-image" alt="{{ content.featured_image_alt_text | escape }}">
                        </a>
                    </div>
                {% endif %}
                    <div class="post-summary">                                    
                        {{ content.post_list_content|safe }}
                    </div>
                </div>
                {% if content_group.show_summary_in_listing %}
                    <a class="more-link hs-button outline" href="{{ content.absolute_url }}">Read More</a>
                {% endif %}
                <footer>
                <div class="custom_listing_comments" class="post-meta">
                    {% set comments_number =  content.comment_list|length %}
                    {% set comments_label = "Comment" if comments_number == 1 else "Comments" %}
                    {{ comments_number }} <a href="{{content.absolute_url}}#comments-listing">{{ comments_label }}</a>
                </div>
                {% if content.featured_post %}help{% endif %}
                {% if content.topic_list %}
                     <p id="hubspot-topic_data" class="post-meta"> Topics:
                        {% for topic in content.topic_list %}
                            <a class="topic-link" href="{{ group.absolute_url }}/topic/{{ topic.slug }}">{{ topic.name }}</a>{% if not loop.last %},{% endif %}
                        {% endfor %}
                     </p>
                {% endif %}    
                </footer>
            </article>

            {% if total >= max %}
                {% set count = 0 %}
                {% set total = 0 %}

                </div>
            </div>
            <div class="row-fluid-wrapper">
                <div class="row-fluid">

            {% endif %}

            {% set count = count + 1 %}
          {% else %}
            <article class="post-item" >
                <h2 class="post-listing-simple"><a href="{{content.absolute_url}}">{{ content.name }}</a></h2>
            </article>
          {% endif %}    

      {% endfor %}
      </div>
  </div>
</section>

[roisinkirby]

Hey @matttunney can you share a link to the blog you are working on?

@Jsum @TRooInbound have you seen this done before?

[Jsum]

I had a really detailed answer to this but seeing past posts is a feature that we lost when the forum design changed.

Basically though it has to do with using "content." before "widget_data" when trying to access the value from inside your for content in contents loop.