Hide Blog Featured Image in the post

Highlighted
New Member
1 0 0

Hello! I would like to stop the featured image from being shown in the blog posts, but keep it in the blog list for my Home page. I've tried some of the other solutions on the forum but with no luck. Anyone got a suggestion I could try?

I'm using the District theme and my site is wildspiderdesigns.com

Thanks for looking!

0 Likes
Highlighted
Shopify Staff
Shopify Staff
351 39 79

Hi, @Toni_Wilderspin!

My name is Lilith, I'm on the Social Care team at Shopify.

Although I'm unable to support third-party themes or changes, I did take a peek at Chrome's developer tools to see if there is a code that you can hide in your theme code templates.

Remember that any third-party themes may be coded differently than others so what works for one may not work for this one. It's akin to having different recipes for different dishes, one ingredient may work for one dish, but might not work for another. if you hide the image altogether, you might accidentally hide it on the blog list, which you mentioned isn't what you're looking for.

For this theme, you might have several areas that the article image may be found in, but to hide it from the article page you can try the steps below as one of the many options!

 

 

What to look for

Chrome developer tool says that the image inside the blog article itself is called article-image.

 

23-24-f6vzz-dfysb

 

 

Theme file to find

You'll want to find the file named article-template.liquid.

This file may be found by logging into your admin and follow the steps here to find it:

 

1. Go to Online Store > Themes

2. Expand the folder called Sections

3. Open the file article-template.liquid

 

 

Code to modify

Once you have the template open, the code you might be looking for may similar to the example below:

            <div class="article-image">
              <a href="{{ article.url }}" class="card__image-wrapper">
                <img class=".....">
                <noscript>
                  <img class="card__image" src="{{ image | img_url }}" alt="{{ image.alt | ..... }}">
                </noscript>
              </a>
            </div>

The first line in my example above shows <div class="article-image"> and the last line </div> are the ones you'll be adding code to. These will look the same in your theme code. Everything else in between might be a little bit different.

Right before the first line, I indicated in my example, you will add {% comment %}.

Immediately after the last line, I indicated above you will add {% endcomment %}.

What these do is to hide the element from your site while keeping it in your code in the event you need to show it again or change anything.

 

 

Notes

A few quick notes!

I don't always recommend going into the theme.scss.liquid file of your theme if you're not too familiar with HTML/CSS and Liquid. Modifying that specific file is permanent, there is no way to roll it back so you'll want to be extra careful when making any changes in that file and remember exactly what you changed and where. There are some ways to modify this code to achieve what you're looking for, but without seeing your theme code first-hand I can't make an accurate recommendation.

Other files like the sections where the templates live will have the ability to roll them back anytime if you make a mistake or something isn't working. Just click on "older versions" in these files to revert them to a previous time.

Finally, you can also choose to get some help from an Expert or the direct theme developers. I highly recommend hiring one of our partners to help you with this. You can find a suitable Shopify Partner in the Experts Marketplace or request a quote by following this guide here.

Let me know how you do with the information above! I'm happy to answer any questions you think of as you work on your business.

Lilith | Social Care @ Shopify
 - Was my reply helpful? Click Like to let me know! 
 - Was your question answered? Mark it as an Accepted Solution
 - To learn more visit the Shopify Help Center or the Shopify Blog

0 Likes
Highlighted
Shopify Partner
3151 686 839

@Toni_Wilderspin 

Can you please provide a screenshot of which image you would like to hide? 

That will be helpful. Let me know.

I will check and try to provide a solution here.

Thanks!

If helpful then please Like and Accept Solution.
Do you need custom changes on store ? Hire me.
Feel free to Contact me on dmw.webartisan@gmail.com
Follow us on Instagram @dmw.webartisan
0 Likes