Olá! Nós temos uma Comunidade em Português!

Get an image source from a blog post's banner module into the listing template

resolver
Sachkundiger

Hi,

 

I have an image field within our blog posts teamplate banner module. I can get this displaying fine within the module template using {{ module.banner_image.src }} however I'm unsure how I would get this image on the listing template within the loop. I'm assuming I need to reference the specific module and then the field followed by srcbut I'm just not sure what the syntax is for this, I have tried

 

{{ content.widget.mobile_thumbnail.src }}

 

but no luck

 

Thanks

1 Solução aceita

Soluções aceitas
Top Advisor | Gold Partner

@benji_thecroc - Right, you can do that using the image src HUBL tag. Put it right into your blog template code. Then read that value in your listing template. 

Here's a similar question with a solution I have to this question: https://community.hubspot.com/t5/Content-Design-Questions/Pulling-Article-Snippets/td-p/198249

8 Respostas 8
Top Advisor | Gold Partner

@benji_thecroc - does the banner image have export_to_template_context=true? then you can do widget_data.banner_img.src

 


If this answer helped, please, mark as solved Smiley muito feliz


tim@belch.io | forms.belch.io | Design your own Beautiful HubSpot Forms; No coding necessary.

 

Drop by and say Hi to me on slack.

Responder
0 Avaliação positiva
Sachkundiger

Hi,

 

Unfortunately it's not added to the module via HubL so I can't add in that attribute it seems, I've attached some screenshots. The image field is added to a custom module and it's then just displayed via HubL language. It's not implemented purely through HubL.

 

So we have a custom module acting as a blog posts banner. We then wanted a method of uploading a thumbnail image to be used as a mobile version of the featured image as the desktop versions aren't suitable for the mobile layout due to featured images have a landscape orientation and no amount of positions or cropping will make those suitable for a 1;1 ratio square on mobile. So I implemented an additional 'mobile_thumb' field within the custom banner module. I was hoping we could pull the field from the custom module and display in the listing view.

 

Screen Shot 2018-08-22 at 13.40.17.pngBanner Module TemplateScreen Shot 2018-08-22 at 13.37.52.pngImage Field options

Responder
0 Avaliação positiva
Top Advisor | Gold Partner

@benji_thecroc - ahh, you can't really share context between modules. Your best bet is to bake the banner right into the blog template with HUBL instead of using the custom module.

Responder
0 Avaliação positiva
Sachkundiger

But the banner needs to have different images based on the blog post.

 

All we really need is a way to upload a thumbnail to a blog post that isn't the featured image and only show that image on the listing template.

Responder
0 Avaliação positiva
Top Advisor | Gold Partner

@benji_thecroc - Right, you can do that using the image src HUBL tag. Put it right into your blog template code. Then read that value in your listing template. 

Here's a similar question with a solution I have to this question: https://community.hubspot.com/t5/Content-Design-Questions/Pulling-Article-Snippets/td-p/198249

Sachkundiger

The blog post template is built using the template builder. I'm assuming I would I clone the template to HTML then add in the image src HUBL tag.

 

The only issue I can see here is how would a user then add this image in when creating a post if this image is hidden/not viewable on the post page itself. This image is used purely for the post listing template but should be specific to each blog post.

Responder
0 Avaliação positiva
Top Advisor | Gold Partner

@benji_thecroc - You could actually add that HUBL code to the head or footer of your template and when the blog creator is creating a post, there will be a module in the left column where they can change this image.

Then, in your blog listing template, just add the extra info in the loop to find that HUBL widget data.

Hope that makes sense.

Highlighted
Sachkundiger

@tjoyce

 

Not to worry, I've checked out the related issue and that's put me on the right track. Thank you for your help.