# Display Image Src (in Recent Posts Module) of Module in Post Template

**URL:** <https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877>\
**Category:** CMS Development\
**Created:** [October 5, 2021, 6:32pm UTC](https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877 "2021-10-05T18:32:21Z")\
**Posts on this page:** 7\
**Page:** 1

<div class="post-metadata">

**Author:** ![jestlinbaum](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jestlinbaum/32/68653_2.png) [@jestlinbaum](https://community.hubspot.com/u/jestlinbaum)\
**Post date:** [October 5, 2021, 6:32pm UTC](https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877/1 "2021-10-05T18:32:21Z")

</div>

I have seen this post but am having trouble:

[https://community.hubspot.com/t5/CMS-Development/Pulling-Article-Snippets/td-p/198249](https://community.hubspot.com/t5/CMS-Development/Pulling-Article-Snippets/td-p/198249)

In my single post template I have the following:

`{% module "post_background_image" path="@hubspot/image" label='Select a background image', export_to_template_context=True %}`

This displays an image in the hero of each post. Works fine.

I am making a recent posts module and would like to reference that image in the listing.

```lia-code-sample
{% set tag_posts = blog_recent_tag_posts('default', 'transition', 3) %}
{% for tag_post in tag_posts %}
 <div class="post-tile">
 <div class="post-title">
 {{ tag_post.name }}
 </div>
 <div class="post-image">
 //----How can I reference the image? -----//
 </div>
 </div>
{% endfor %}

```

Any help greatly appreciated.

Thanks!

---

<div class="post-metadata">

**Author:** ![Teun](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/teun/32/28739_2.png) [@Teun](https://community.hubspot.com/u/Teun)\
**Post date:** [October 5, 2021, 7:11pm UTC](https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877/2 "2021-10-05T19:11:29Z")

</div>

Hi @jestlinbaum ,

Do you want to show the featured image of each blog post or the image that has been set in the module you are referencing?

Featured image:

```lia-code-sample
{% set tag_posts = blog_recent_tag_posts('default', 'transition', 3) %}
{% for tag_post in tag_posts %}
 <div class="post-tile">
 <div class="post-title">
 {{ tag_post.name }}
 </div>
 <div class="post-image">
 <img src="{{ tag_post.post_list_summary_featured_image }}" alt="{{ tag_post.featured_image_alt_text | escape }}" />
 </div>
 </div>
{% endfor %}

```

Referenced module using [export\_to\_template\_context](https://developers.hubspot.com/docs/cms/building-blocks/modules/export-to-template-context):

```lia-code-sample
{% set tag_posts = blog_recent_tag_posts('default', 'transition', 3) %}
{% for tag_post in tag_posts %}
 <div class="post-tile">
 <div class="post-title">
 {{ tag_post.name }}
 </div>
 <div class="post-image">
 <img src="{{tag_post.widgets.post_background_image.body.img.src}}" />
 </div>
 </div>
{% endfor %}

```

---

<div class="post-metadata">

**Author:** ![jestlinbaum](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/jestlinbaum/32/68653_2.png) [@jestlinbaum](https://community.hubspot.com/u/jestlinbaum)\
**Post date:** [October 5, 2021, 7:40pm UTC](https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877/3 "2021-10-05T19:40:10Z")

</div>

@Teun thanks for the reply. I’m looking for the export to template reference. This is on a separate custom module to be used on other site pages. When I try {{ widget\_data.post\_background\_image|pprint }}, it just says “null”.

When I pprint on the post template (where the export to template module is listed) it returns all the values on the post page. Which makes sense as the hero image is working fine there.

Not sure why it doesn’t come through in the new module.

---

<div class="post-metadata">

**Author:** ![Teun](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/teun/32/28739_2.png) [@Teun](https://community.hubspot.com/u/Teun)\
**Post date:** [October 5, 2021, 7:47pm UTC](https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877/4 "2021-10-05T19:47:02Z")

</div>

@jestlinbaum ,

Check my updated answer above and what @miljkovicmisa wrote, I made a mistake, should be fixed now.

---

<div class="post-metadata">

**Author:** ![DanielSanchez](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/danielsanchez/32/48193_2.png) [@DanielSanchez](https://community.hubspot.com/u/DanielSanchez)\
**Post date:** [October 5, 2021, 7:15pm UTC](https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877/5 "2021-10-05T19:15:54Z")

</div>

Hi @jestlinbaum ,

Try this:

`{{ post.featured_image }}`

For recently blog posts module, i use this code _(I won’t put the CSS code, I just leave the HTML + HubL to evaluate a structure)_:

```lia-code-sample
 {% set posts = blog_recent_posts('default', 3) %}
 {% for post in posts %}
 <div class="recent-post-blog">
 <a href="{{ post.absolute_url }}" class="recent-header-post" style="background-image: url('{{ post.featured_image }}')"></a>

 <div class="recent-content-post">
 <h3><a href="{{ post.absolute_url }}">{{ post.name }}</a></h3>
 {# TAGS #}
 </div>
 <div class="recent-content-post-footer">
 {{ post.publish_date|datetimeformat('%B %e, %Y') }}
 </div>
 </div>

 {% endfor %} 

```

**Did this post help solve your problem? If so, please mark it as a solution.**

Best! 🙂

---

<div class="post-metadata">

**Author:** ![miljkovicmisa](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/miljkovicmisa/32/86357_2.png) [@miljkovicmisa](https://community.hubspot.com/u/miljkovicmisa)\
**Post date:** [October 5, 2021, 7:28pm UTC](https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877/6 "2021-10-05T19:28:02Z")

</div>

Hello @jestlinbaum , you should put the following snippet right where your comment is:

`<img src="{{tag_post.widgets.post_background_image.body.img.src}}" alt="">`

_ **If my answer was helpful please mark it as a solution.** _

---

<div class="post-metadata">

**Author:** ![Teun](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/teun/32/28739_2.png) [@Teun](https://community.hubspot.com/u/Teun)\
**Post date:** [October 5, 2021, 7:33pm UTC](https://community.hubspot.com/t/display-image-src-in-recent-posts-module-of-module-in-post-template/44877/7 "2021-10-05T19:33:08Z")

</div>

Jup, @miljkovicmisa is right, I forgot that you want to access the module data from the loop.
