Old thumbnails remain visible after updating image in panel

Kirby 3 Solved ✅
1

Hello. I recently made a Kirby website for a client where they can create product pages with an image for each product:

fields:
  image:
    label: Afbeelding
    type: files
    required: true
    multiple: false
    layout: cards
    size: large
    query: page.images
    image:
      ratio: 1/1
      cover: true

In the template, I display the image, resized as thumbnail:

<?= Html::img(
	$page->image()->thumb('product')->url(),
	[
		'itemprop' => 'image',
		'alt' => $page->title()->value(),
		'srcset' => $page->image()->srcset('product'),
		'width' => 306,
		'height' => 306,
	]
) ?>

However, after the client uploaded a new image to a page in the panel, the old image is still shown on the website.

I have confirmed the following:

  • The new image is present in the content/ folder
  • The old image is also still present (but it has a different name)
  • The new image (UUID) is referenced in the page .txt file
  • The new image is shown when editing the page in the panel
  • The displayed thumb on the website includes the name of the old image
  • The issue is not due to browser caching (I tried different browsers and cleared caches)
  • Other changes (like changing text on the page) do become visible correctly
  • I’m running the latest stable Kirby version (3.9.6.1)

Am I doing anything wrong? Should I somehow manually clear image caches on the server? Or is this a bug?

2

Yes. image() is a native Kirby method, so what you are doing here is fetch the first image in the file system instead of the image from your field. If you use field names that refer to a Kirby method, then you have to fetch it via the content method:

$page->content()->get('image')

Or rename the field, see https://getkirby.com/docs/guide/content/fields#naming-fields

1 Like
3

Thanks so much for your fast reply! All clear now :raised_hands:

I now remember I ran into similar issues before. To be honest, this is quite annoying, since these issues don’t always appear immediately (like in this case) and they can be hard to debug.

Perhaps this is some feedback that can be considered for future improvement? I could imagine that Kirby could give some kind of notice when using names for fields that could cause collisions like this (in development mode)?

4

I think that sounds easier than it is. You can generally prevent such issues by prefixing your field names.

Feature suggestions: https://feedback.getkirby.com

5

Thanks, I’ve added it to the feedback board: Warn when field name is the same as common Kirby methods · Kirby Feedback

6

If I were you (and since I don’t see such a feature being implemented anytime soon) if you run into this more often, and you don’t like prefixed field names, then getting into the habit of always rendering your fields via the content object would be the way to go (as some people already do):

So either

<?= $page->content()->get('image') ?>

Or

<?= $page->content()->image() ?>

Being able to call the fields directly is just a shortcut implemented through a magic method, after all.

1 Like