Collection Image Not Updating on Front End

Store Design
1

Not sure if I should post this question here in Design or in Technical Q&A, but since I found the basic idea for collection lists here in Design, I’m posting here.

I use menu lists to show curated lists of collections. Works fine, only if I update the Collection Image (Admin > Products > Collections > (collection name)), the updated image does not ripple through to the front end. It shows up correctly on the back end in both the Collections thumbnail list + on the Collection page.

See screenshots (URLs also supplied below).

Yes, I have cleared browser cache. I’ve also tried other browsers.

The only way I’ve found I can get the image to update is by using an add-on app, Collection Import/Export, to manually edit the collection image. Very annoying to have to pay a monthly extra to update such a simple thing!

Isn’t there a Shopify way to correctly update the collection image?

I do not use the image on front-end collection pages, btw, I use Promoboxes; meaning cannot go to individual front-end collection pages to test if the correct image is loading there.

Site is, obviously, in-progress :slightly_smiling_face:

URLs (two instances not updating; each uses {{ collection.image }}, merely formatted differently.

• row 6 (medium screens on up) of https://dominiquecohen2.myshopify.com/pages/stacks-the-new-black (site pw = gierta) I accidentally originally uploaded the landscape version of the photo I want to use; updated to the square version more than two days ago, yet list doesn’t update

• pics 3, 7, 8, etc (all the ones loading as square rather than landscape) on https://dominiquecohen2.myshopify.com/pages/shop-the-look-gallery (site pw = gierta) (list is in-progress; ignore that some photos are missing; that’s not the issue)

Here are relevant screenshots relating to the …stacks-the-new-black (first URL) instances:

collectStacks-FrontEnd.png
collectStacks-FrontEnd.png2596×2920 1.05 MB

collectAdminThumbList_ed.jpg
collectAdminThumbList_ed.jpg2596×2920 612 KB

collectAdminPg.png
collectAdminPg.png2596×2920 594 KB

imgURLs.png
imgURLs.png2404×2324 603 KB

codeForFrontEndList.jpg
codeForFrontEndList.jpg2778×2596 641 KB

2

ADDENDUM – Sometimes, rather than “replacing” the existing collection image, if I delete it, then save the page, and only then add a new collection image, the frontend updates; other times it does not.

3

Seems to be working better now so long as I delete the old image, save; add the new image, save; then add back in the alt text.

1 Like
4

I had the same experience: you need to delete, save, and then add the new image.

When the image wasn’t updating, I noticed that it was pulling the previous image (with an old filename) from the CDN. The image on the collections page on my website would be from the CDN and the name would be “myfile.jpg” even when I had updated the collection with “myfile_new.jpg.” Some other thread said maybe it is some metadata fields in the file that are used to determine if it is “new” and clearly those metadata fields aren’t always the ones that get updated when a file is changed. Anyway, seems like the delete/save method is a workaround for now.

5

I always use the delete, save, add new image methodology.
The issue appears to be a quirk with our custom template: Shopify Support tested with one of their default templates, and the image updated.

Used to work fine. I’m a few updates behind on our template (highly customized, meaning updating is more than a quick install); will test on my developer account to see if updating the template version cures the problem.