# Displaying an image\_src module on single blog post and post listing

**URL:** <https://community.hubspot.com/t/displaying-an-image-src-module-on-single-blog-post-and-post-listing/73864>\
**Category:** CMS Development\
**Created:** [January 26, 2023, 8:00pm UTC](https://community.hubspot.com/t/displaying-an-image-src-module-on-single-blog-post-and-post-listing/73864 "2023-01-26T20:00:27Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![JBoylan0](https://avatars.discourse-cdn.com/v4/letter/j/b5ac83/32.png) [@JBoylan0](https://community.hubspot.com/u/JBoylan0)\
**Post date:** [January 26, 2023, 8:00pm UTC](https://community.hubspot.com/t/displaying-an-image-src-module-on-single-blog-post-and-post-listing/73864/1 "2023-01-26T20:00:27Z")

</div>

I’m trying to add a option for a custom banner image to our blog posts. Reading through the widget documentation, it seems like that would do the trick:

> **[export\_to\_template\_context - HubSpot docs](https://developers.hubspot.com/docs/cms/reference/modules/export-to-template-context)**
>
> Export\_to\_template\_context is a parameter that makes a module's parameters available to the template environment without actually rendering the module. This parameter can be used all HubL module tags. The widget\_data tag is used to retrieve these...

I’ve added an image\_src widget to our single post template, which correctly displays an image selector when editing a post.

However, when I try to print the value in the single post or banner template, it’s empty.

**Post Template:**

```lia-code-sample
{% module "blog_listing_featured_image"
 path="@hubspot/image_src",
 label="Listing Featured Image",
 export_to_template_context=True,
 no_wrapper=True
%}
<div style="display:none">{{ content.widgets.blog_listing_featured_image.body.value }}</div>

```

**Banner Module Template:**

```lia-code-sample
{% set topic_posts = blog_recent_topic_posts( 'default', 'featured', 1 ) %}
<header class="banner {% if is_listing_view %}{% else %}banner--single-post{% endif %}"
 {% if topic_posts and is_listing_view %}
 {% for topic_post in topic_posts %}
 {% if topic_post.widgets.blog_listing_featured_image.body.value %}
 style="background-image:url('{{ topic_post.widgets.blog_listing_featured_image.body.value }}')"
 {% else %}
 style="background-image:url('https://website.com/hubfs/Banners/Blog%20Default%20Banner%20Image_02.png')"
 {% endif %}
 {% endfor %}
 {% elif module.banner_image.src %}
 style="background-image:url('{{ module.banner_image.src }}')"
 {% else %}
 style="background-image:url('https://website.com/hubfs/Banners/Blog%20Default%20Banner%20Image_02.png')"
 {% endif %}>
 ...
</header>
...

```

Any help would be appreciated!

---

<div class="post-metadata">

**Author:** ![Anton](https://d10pqhm3lwygmk.cloudfront.net/user_avatar/community.hubspot.com/anton/32/103167_2.png) [@Anton](https://community.hubspot.com/u/Anton)\
**Post date:** [January 27, 2023, 9:15am UTC](https://community.hubspot.com/t/displaying-an-image-src-module-on-single-blog-post-and-post-listing/73864/2 "2023-01-27T09:15:54Z")

</div>

Hi @JBoylan0,

you don’t really need an image-widget/function for displaying featured images in posts (or pages) since it’s already build in 😉 (Unless you want to have more control)

to use it simply write your post code like this

`<img src="{{ content.featured_image }}" alt="{{ content.featured_image_alt_text }}" class="postFeaturedImage">`

you can find a detailed list of all possible variables for blogs [here](https://developers.hubspot.com/docs/cms/hubl/variables#blog-variables).

also I recommend to delete

`style="display:none"`

from your div

best,

Anton

_Moderator note: While this solution may not address the original poster’s specific situation, it could be helpful for other community members facing similar challenges._

---

<div class="post-metadata">

**Author:** ![JBoylan0](https://avatars.discourse-cdn.com/v4/letter/j/b5ac83/32.png) [@JBoylan0](https://community.hubspot.com/u/JBoylan0)\
**Post date:** [January 27, 2023, 1:59pm UTC](https://community.hubspot.com/t/displaying-an-image-src-module-on-single-blog-post-and-post-listing/73864/3 "2023-01-27T13:59:15Z")

</div>

Thanks for the reply Anton.

Yes, I know we can use the featured image, we’re already using it in a different context in the single post template. We need a custom banner image in addition to the featured image.

The display none is only set to demonstrate that I’m unable to pull the widget image url into the single post template. We don’t intend to display it in the single post template. That div should have the image URL printing to it, but {{ content.widgets.blog\_listing\_featured\_image.body.value }} is empty.

It seems like it should work, according to the docs, and according to other threads I’ve read.

Any insight into why the widget is not working, or what I’m missing would be helpful.

Thanks,

-Jake
