Make MSPC variation thumbnail different to the image that is added to the Fancy Product Designer

Posted almost 9 years ago by Luke Breen

Post a topic
Luke Breen

I have set up the Fancy product designer and integrated the Multi Step Product Configuration plugin to create a set up very similar to the Sneakers example on your site.

My set up requires 3 Fabric options for each product. I have set the fabric areas up as separate layers and used the Replace element to make the options change across all views.

My problem is that you can only associate one image with the variations, so the thumbnail and image that is applied to the Fancy Product Designer is always going to be the same. It would be much better if you could add a thumbnail and FPD Layer image for each variation. This would allow me to use a swatch for the fabric thumbnail, and a transparent png with associated colour options on the FPD.

If we were to take this one step further, a third image would also be useful to add an associated texture layer above the previously mentioned FPD layer. This would then allow for a fabric variation to have it's own swatch in the MSPC steps, a transparent png in the FPD with associated colours for that layer, then an associated texture layer to give the visual representation of the fabric selected.

I know this is a lot to ask for, but I'm sure others will come across the need for fabric variations when building custom products.  

7 Votes


Sorted by

sandra susin posted over 8 years ago

hey, I have the same problem. got Tshirt with both front and back sides. and from the MSPC it just doesnt work,

anyone have a solution?


0 Votes


Benjamim Alves posted over 8 years ago

Hi Luke,

I have the same problem, did you get this done?

And I need a tutorial to get this done, someone have one?

Best Regards

0 Votes


Luke Breen posted over 8 years ago

Hi Gregory,

Thanks for that link, I didn't realise the Multi Step Configurator plugin could be edited using the WooCommerce Attributes. I have now experimented with this and it almost does what I'm looking for.

Now the only problem I'm experiencing is...

My Fancy Product has 4 views (Front, Left, Back, Right)

I have set up a range of attributes to deal with the different fabrics available

These fabrics are displayed using the MSPC, I have assigned a thumbnail image and linked the image that replaces an element in the FPD

My problem is...

Each of the 4 views in my FPD needs a different image element replacing dependent on what fabric is selected. There's currently only the ability to replace one image element per attribute. This works great for the front view but the remaining three views have no way of adding a different element.

Is there any way I can achieve the following...

Can an image element be cropped to the shape of an svg or other none square object? (If this was possible I could have one image that appears on all views when the associated attribute is selected. I would then cropped the image differently on each view to achieve the effect).

0 Votes


Gregory posted almost 9 years ago

This is located in Products > Attributes.

Check this out:

0 Votes


Luke Breen posted almost 9 years ago

Hi Rafael,

I'm really sorry but I'm struggling to figure out which screen this option appears on. Please could you give me a little more information about how to get to that option?

I currently have 1 FPD category that has 3 Fancy Products in it. The category is assigned to a WooCommerce Product, I'd simply like to change the thumbnail used for each of these products when you click the "Change Products" button from within the designer.

0 Votes

rady kal

rady kal posted almost 9 years ago Admin

Thats already possible. See attached image. 

0 Votes


Robert Cheung posted almost 9 years ago

this would be great, looking forward to have this soon as well !

0 Votes

Login or Sign up to post a comment