Configurable products, problems

Hi, it’s me again. I’ve got few problem with configurable products. If it is ok I would like to keep this thread for a while as new problem come up quickly and often are hard to deal with :wink:.

So first let me describe the procces of how I made my configurable products which I will call them A and B. Both of them have 3 attributes but while A has around 100 combination total B has only 25. Also A has different images for each position in option 1.

Here is how I create them:
I create a new configurable product > fill in everything I need > go to “create configurations” > add attributes I need for this product > choose what I need, upload images > create it > I add some “customizable options”, upload product image > create/update attribute set > save

So at this point I have few issues:

  1. The reason I created attributes in “create configurations” and not before is that not all of those premade were avaliable to me while creating configurations. It has a drawback, the attributes added in “create configurations” are limited to “dropbox”, “visual swatch” and “the third one i cannot remember” while creating them in Store > Attribute > Product gives you more options. So the question is, did I miss an optoion which enables/disables attribute from using it to create configurations?

  2. Now the weird inconsistency I came across. As mentioned before I have product A and B. The only difference in process of making them is in how much combinatinos there are and in the fact that A has images bound to each position in option 1 while B has one set of images. So after I created those products, the dropboxes to configure them in product page appear differently. I think that iamges will show it better:

A

B

So basically, the font looks different, the B ones have red stars (field required) the A ones don’t (they are required as well), bars have different widths. And the most important one. In product B you have to choose option 1 > option 2 > option 3. While in product A you can go like option 2 > option 1 > option 3. Frankly I like product B better but I cannot find reason why that is and how to possibly change it. Also funny hting is you can in screenshot A that while option created by using attributes have no red stars the option created with “Customizable Options” do.

  1. Is there a way to set default product combination? I mean when you go into product page, instead of all the dropboxes being “choose an option” to be already chosen by default.

  2. When setting product image it also appears in every combination which does not suit me especially in product A which has couple sets of images. When I hide the image making it only the “small” it replaces it whith Magento logo image both in every combination as well as base image when no option in chosen. Is there a way of fixing it? That’s not a big problem, I can just add another image which suits all the sets and make it “base” and “thumbnail” but I’d rather skip those.

Thats it for now. I hope you can find some time to get through this. I am trying things out myself, but they often to lead to me messing it up :wink:. So the help is very much appreciated. Thanks a lot :slight_smile:

I often find that being able to talk about a problem with someone is enough to trigger new ideas or thoughts in my own head that lead to solving problems.

Give me some time to digest this and I’ll come back to you… Also, do you have a link to share so I can Inspect Element on the product page.

Is there a way to share the code only? The website is in the maintenance mode with a “work in progress” page showing up and I’d rather not disable it untill it’s somewhat ready. Any specific elements that are interesting?

Add my VPN IP (185.44.79.217) to your Maintenance Mode Exception. Then only connections I make via this IP can see it.

Alright, added.
Here is my site address: https://seampress.pl/
The products you can find under “sklep”. The ones I used as an example were “Beachflag carbon” and “Roll - up”.

Cool. I’m going out in a few minutes so I’ll check back in later :+1:

According to the Official Magento Documentation: “A configurable product allows the shopper to choose options from drop-down, multiple select, visual swatch and text swatch input types. Each option is actually a separate, simple product.”


This may be affected by the Position you have the Attributes set to (under Product Attributes > Storefront Properties)

Ok, so looking at the Source Code the “Swatched Attributes” have a different styling to the Dropdown. Is this by design or an oversight - Who knows?

The following CSS tweaks should make the Swatch Attributes match everything else:

.swatch-opt { margin: 0; }
.swatch-attribute-label { font-weight: 600; }

Depending on your theme, you might have an Override CSS option in its settings. Otherwise, you’ll just need to find out where to amend it in the CSS source.


Again, under Product Attributes > Properties there is an option to make one of the selections “Is Default”


Not sure. All of my Configurable Variations (Simple Products) have one image with everything set to it (i.e. Base, Small and Thumbnail)


Not sure if I answered all of your questions. There was a lot to take in :slight_smile:

Okay, so I tried few things here.

This one is not really helping as I set all of my attributes to something by default and none of them is chosen when going into product page. Not sure why, perhaps it has something to do with not creating attributes before products?

About the CSS styling I will probably get there when I will install my template later on, so I’ll pass it for now.

As for the image situation I just added couple images that are realted to all products, which is not ideal solution but I think it works well enough at least as the placeholder :wink:

So the question is, what can I do to make dropboxes either being all active from the beggining or force user to go through them one by one, as this one probably my biggest problem right now. And as always, thank you for your time :slight_smile:

I’ll do some experimenting when I get a chance and get back to you. By-the-way, when you say " make dropboxes either being all active from the beginning" do you mean pre-selected? And can you give me an example (e.g. SKU/URL and the options you’d want selected by default).

Is the problem that people are adding Configurable Products to their basket before actually configuring them? Could you not resolve that by making attributes “Mandatory” - Then they’d see “This is a required field” when they try to checkout without setting anything first.

required

Not really, (I mean, that’s also what I want just not what I meant there) what I meant is that in one product:
https://seampress.pl/beachflag-carbon.html
you can pick any option you want any time (e.g. you can choose “material” then “ksztalt” and at last “wymiary”), while in this one:
https://seampress.pl/roll-up.html you have to pick first one (option called “kaseta”) and only then you can proceed to choose “szczerokosc” and “material”, those options are inactive until you pick a first one. I hope it somewhat makes sense now.

And when we come into default options for products, all I want is the first option in every attribute to be pre-selected. So in this scenario: https://seampress.pl/beachflag-carbon.html it would be “ksztalt: standard”, “wymiary: 60x220”, “material: polystretch”.

Ah, and I just thought of something. When we go to my products, this one for example: https://seampress.pl/beachflag-carbon.html we have planty of options inactive depending on others we choose. E.g. You pick “ksztalt: standard” and in “wymiary” you can only pick either “60x220”, “80x340” or “90x450”. The rest is light grayish and inactive. Is it possible to make them them dissapear instead of changing colour? Probably not from backend but maybe in some .css files?

No, I probably did not explain everything correctly there. All of those attributes are as you called it “mandatory” so that’s not the problem I have fortunately :slight_smile:

Gotcha. I’ll try take a look later.

I’m not 100% convinced this can be done without a custom or 3rd party module.

Try this:

.swatch-select option.disabled {
    display: none;
}

They are Mandatory in https://seampress.pl/roll-up.html but not https://seampress.pl/beachflag-carbon.html

Hmm, that’s weird. Can you confirm you can add item to basket without picking them? I am aware that they are not showing as if they were mandatory but when ingoring them and adding item to the basket I get the “This is a required field.” label underneath those options.

I will, thanks :slight_smile:

Well, that’s shame but I’ll deal with it.

I really appreciate your help :slight_smile: