Displaying images in blog post thumbnails using image URLs

Store Design

Topic summary

A user seeks to display images in blog post thumbnails using image URLs in their Shopify store, currently using the Dawn theme but open to alternatives.

Solution Provided:

Two approaches were offered for implementing blog thumbnails in Dawn:

  • Option 1: Extract and display the first image from blog post content using Liquid code (extract_image filter)
  • Option 2: Use custom metafields by creating an image_url field in Settings > Custom Data > Blog posts, then referencing it in article-card.liquid

Both solutions involve adding Liquid code snippets to theme files. The user confirmed the solution was helpful. The discussion appears resolved with the implementation guidance provided.

Summarized with AI on October 29. AI used: claude-sonnet-4-5-20250929.
1

I would like to know how to display images in the thumbnails of blog posts using image URLs.
I’m using the Dawn theme, but if it’s possible to do it with another theme, I’m happy to change.

Thank you.

1 Like
2

Hi @ShoFeu ,

Show Blog Thumbnails in Dawn Theme (Using Image URL)

Option 1: Use first image in blog content

{% assign image = article.content | extract_image %}
{% if image %}
  
{% endif %}

Option 2: Use custom image URL (metafield)

  1. Go to Settings > Custom Data > Blog posts, create a metafield (e.g. image_url).

  2. Add your image URL in each blog post.

  3. In article-card.liquid, add:

{% if article.metafields.custom.image_url %}
  
{% endif %}
1 Like
3

Thank you so much!

4

Thank you so much!

1 Like