Developer forum

Forum » Ecommerce - Standard features » Image pattern, shop-level

Image pattern, shop-level

Siv Hansen
Siv Hansen
Reply

Hi. A webshop I'm working with, with ecommerce and PIM, are trying to display product images. The images are on the format productnumber-variantcolor, and I'm trying to define an image pattern to apply.

the variant in the shop is called COLOR, and i'm wondering if that's the referral name in which to use in the image pattern.

A typical filename is like this, 1147299-COLOR800.jpg, where the first part is the ERP product number and the second part is referencing a color.

In eCommerce->edit the correct shop->use alternative image patterns, I've chosen the correct folder, where the images resides, and then applied an image pattern of

/{ProductNumber}-{COLOR}.jpg, where color is referencing to the name of the variant group.

However, no Images are shown. Where do I go wrong?


Replies

 
Siv Hansen
Siv Hansen
Reply

I also found the image pattern in the PIM Warehouse, and changed it to match the ecommerce settings. Product images does not show up :(

 
Nicolai Pedersen
Reply

Hi Siv

I cannot see your installation, but I think the image pattern should be something like this: /{ProductNumber}-COLOR{VariantOptionLevel1}.jpg

VariantOptionLevel1 will return the value of the color - i.e. 'blue' if that is what your variant option is called. So the above image pattern will translate into 1147299-COLORblue.jpg which is not exactly what you are looking for...

Maybe try /{ProductNumber}-COLOR*.jpg - that will find any product that starts with 147299-COLOR and ends with *.jpg, 147299-COLOR*.jpg. But that will give you the same list of images for all variants and you will see only the first one - which would be the same image for all variants...

You can see all options for image patterns here:

https://doc.dynamicweb.com/documentation-9/ecommerce/product-catalog/product-images#8210

An alternative is to add a bit of logic in the template to find images based on the color code (Maybe that is your variant option id?).

BR Nicolai

 
Siv Hansen
Siv Hansen
Reply

Thanks. I discovered that my ProductNumber should actually be ProductID (at least that's what the URL of the product says - ref ProductID=2502581 from the URL)

this is what my variant page lookes like

I have a column, Variants ID, which says COLOR800 (example). That's what I want in my image pattern.

this is my image pattern

 

/{ProductID}-{VariantOptionID}.jpg

Nothing :(

 

 

 
Nicolai Pedersen
Reply

According to the docs, there is no parameter called VariantOptionID - so that would not work...

BR Nicolai

 
Siv Hansen
Siv Hansen
Reply

I know, but ref your answer

"An alternative is to add a bit of logic in the template to find images based on the color code (Maybe that is your variant option id?).

BR Nicolai", so I took a guess.

 

What I do want is the identificator of the variant. You said that the VariantOptionLevel1 gives med the values of the colors. I don't want that. I want the identificator of the VariantOptionLevel1 (which is COLOR800) for Red. 

 

 
Nicolai Pedersen
Reply

Yes, I understand that. But currently that information is not available with image patterns...

Sorry, Nicolai

 
Espen Strømsnes
Espen Strømsnes
Reply

Consider it as a feature request to have support for VariantOptionId with image patterns :-)

Best regards,

Espen

 
Nicolai Pedersen
Reply

Hi Espen

Yes, will look into it.

So, you have a product in 2 colors and 2 sizes

Color.Blue = variantoptionid = 800
Color.Red = variantoptionid = 600
Size.Small = variantoptionid = S
Size.Large = variantoptionid = L

For a product you have a variant id for the combination - i.e. 800.S or 600.L

So I guess you would want the VarianOptionIdLevel1 - so it would contain '800' and not '800.S' or similar?

BR Nicolai

 
Espen Strømsnes
Espen Strømsnes
Reply

Exactly. I would like to have the corresponding id value for a variant. I.e VariantOptionIdLevel1 = 800 for VariantOptionLevel1 = Blue, and VariantOptionIdLevel2 = S for VariantOptionLevel2 = Small.

Espen

 

 
Martin Grønbekk Moen
Martin Grønbekk Moen
Reply

Hi Nicolai, is this an hot fix you can magically make within days?
We just need to know, if this takes weeks we need to make some custom code until it is fixed, but if it will be part of an soon to be launched hot fix we can wait :)

 
Nicolai Pedersen
Reply

Hi Martin

Hotfix = we have a bug that needs fixing. This is a new feature request - so we would be extremely nice if we gave this to you in days as part of a hotfix...

Luckily for you I am a kind guy today (happens not often...smiley). Created TFS#62112 - can be merged to 9.6 and released Tuesday.

BR Nicolai

 
Martin Grønbekk Moen
Martin Grønbekk Moen
Reply

Omg... Christmas came early this year!
I'm very happy, you are a legend, but I guess you already know that :P

 
Martin Grønbekk Moen
Martin Grønbekk Moen
Reply

Hi Nicolai!

Was this feature added to DW9.6.4?
Cant see it in the release notes. We have also tested it in admin, but it does not seem to work.

/Martin

 
Nicolai Pedersen
Reply

It should be in Ecommerce package version 1.6.17, and you need to do something like this:

/{ProductID}-color{VariantOptionIdLevel1}.jpg
 
Siv Hansen
Siv Hansen
Reply

I've tried further today, but still nothing.

So, I looked into the database, and this is what I found:

https://www.screencast.com/t/7ybqpfnY

The EcomVariantsOptions have columns for variantoptionid (in my case c103), variantoptiongroupid COLOR and variantoptionname=103, which refers to a color, Navy.

ProductNumber and ProductID are the same in my db.

So, my image pattern would be, if I query the database, {ProductNumber}-COLOR{VariantOptionName}.jpg (there is no need to ask for VariantOptionGroupId, since then the parser would have to look for SIZE as well). 

But - that's not the case either. No images anywhere. I cannot rule out the possibility that DW don't query the DB directly and that views have different names on columns.

My image is called 2472571-COLOR103.jpg

My understanding is that one can set image pattern rules on different levels, where they override eachother - and the levels are

1) product app
2) Shop level/Pim level
3) Settings level

 I tried pattern pattern /{ProductNumber}_COLOR{VariantOptionIdLevel1}.jpg. I also tried the other variant, with {ProductNumber}-COLOR{VariantOptionName}.jpg in both product app, shop level, in pim and in settings, but still nothing.

Is there a way to reveil what the parser is trying to display (i assume there is a <if there is no image with file name x.jpg, display the no-image-provided-file>). So far, this debugging process is like being blindfolded.
 

 
Nicolai Pedersen
Reply

Then try this one: 

/{ProductID}-color{VariantOptionLevel1}.jpg
 
Siv Hansen
Siv Hansen
Reply

Ok, couple of more questions:

Where is the correct place to use image patterns (Pim/shop/app)? I'd guess Pim, but just double checking.

Second: will the changes occur immediately? (if so, that is not working either). I also tried with capital letters in COLOR (since my image files are named like that and DW might be case sensitive (is it?))

 
Nicolai Pedersen
Reply

I would do it on shop level.

Maybe I should get the URL and your permission to set it up....?

BR Nicolai

 
Siv Hansen
Siv Hansen
Reply

I sent the information you need to support@dynamicweb.dk

 
Nicolai Pedersen
Reply

Ok, been lookin at this.

  1. In your product list template you insert the image from a tag called "Product.ImageCustom", see dump #1. That is not a Dynamicweb specific image tag and seems to be a custom product field (which does not exist). You would want to use a tag called "Ecom:Product.Image*" - using Large, i.e. @GetString("Ecom:Product.ImageLarge.Default.Clean"). Each image pattern has a name - and those names needs to be referenced in the template.
  2. The other problem is that you in the product list only show master products, but uses an image pattern like this: /{ProductID}-color{VariantOptionLevel1}.jpg. This means that since the master product is not a variant, it will not match the pattern which looks for the variant. So therefore use one image pattern for the list and another one for the detail, or maybe use a wildcard like this: /{ProductID}-color{VariantOptionLevel1}?.jpg which might work for the master

Add a couple of image patterns and use @TemplateTags("image") to see what is returned of image tags and values and choose the right one for the job.

Feel free to reach out to the service desk - they can implement this for you by the hour if needed.

BR Nicolai

Capture.PNG
 
Martin Grønbekk Moen
Martin Grønbekk Moen
Reply

Hi Nicolai

We know that the frontend template is using a custom template tag, so please do not look at this.
The issue is that the image is not shown in PIM admin either, we need to start there, and get to see the images in PIM admin before we add it to front end.

Front end we can manage our selves.

 
Nicolai Pedersen
Reply

ok, then it is bullet no 2.

In the product list, it show masters and you have only variant images, so no image is found when using the variant pattern for a master product.

There are 3 ways to solve that.

  1. Set a default variant on all products - then the image will come from the default variant dimension 1.
  2. Add images without color code, i.e. 1000253-COLOR.jpg instead of 1000253-COLOR830.jpg
  3. Use 2 image patterns - one with a wildcard to find the first and the best of the variant images and use that for the master.

I've implemented 3 in the solution - see dumps.

BR Nicolai

Capture.PNG Capture1.PNG

 

You must be logged in to post in the forum