Conditional display of field based on Woo:product-type

Working from the newly supplied archive layout, I’m stuck on defining the correct woocommerce field. I’m trying to achieve the display of a specific field based on the woo: product type: “simple” or “variable”.
In case of a variable product type, the “add to cart” button should not display, but instead, a newly created “select options” button should be displayed.

I tried many combinations of the marked attribute as shown below.

I’m missing the correct reference to the woocommerce fields and syntax to use. Or is what I’m trying to achieve simply impossible?

Some insights please.

Hi Ruud,

The Custom Attribute and the value will help you to add an attribute to the specific elements. In the case of the Simple product the Add to Cart button will be shown whereas the Select Options are shown in Variable products, and that is the way WooCommerce products are shown. Please let us know if you are getting any different output. Any screenshot marked with the issue or any video that helps us to recognize the problem.

Thanks

Thanks for your response @tristup.

I know how Woocommerce handles simple and variable products. The issue is with the newly supplied archive layout, This only contains an add to cart button, not a select options button. Trying to create an extra select option button, I got stuck.

On the specific product, there has to be a condition that discriminates which button to display. That is where the custom attributes come up right? What I need is the exact syntax to distinguish which button to display. The marked custom attribute is something I tried but does not seem to work…

Hello Ruud,

Instead of using the Add to Cart button element, please use the Add to Cart Form element.

This element will display the variations of your product along with the add to cart button.

Hope this helps.

Hello Rue, nice suggestion but unfortunately not a solution for using in archives. Our categorized products display simple and variation products side by side as shown below:

The result when using the add to form in an archive is as shown here:

Resulting in overstretched products with the selected options being displayed at the archive level. We prefer the customer to select these at the product level.

At the archive level, we “only” need a different button instead of add to cart, a select options button. Although this is “standard” Woo behavior it seems quite troublesome to create this with the new layout builder…?

Also any kind of styling options are missing for the add to cart form… Resulting in a minimal display of black/white selection options as shown above.

Hello Ruud,

You can edit your custom archive layout and set a condition to your “Add to Cart” button that it will only be hidden if the product has options.

You can then insert another button that links to the product page and this time, this button will have an opposite condition from the other button.

You will have a set of conditions like this:


Hope this makes sense.

YES Rue, that is exactly what I was looking for! Thanks for these suggestions. I have implemented 2 buttons now and they show perfectly on their conditions. So, I’m on the right track but not quite there yet.

The next thing that is need is a replacement for the “?add-to-cart={{dc:woocommerce:product_id}}” command since the select button should select the “options product layout” What would be the syntax for this? How can this be activated by the button?

Also, the product price in the archive should have the same logic. But instead of the {{dc:woocommerce:product_price}} a from-to range should be displayed as in lowest-highest options pricing (see the above images). Which Woo fields can be used here?

Then a 3rd button is required for composite products. Creating the button is simple, but the conditions lack criteria…


Any idea how to solve this?

Nevermind the above, I found that out myself. In the link url of the button simply use {{dc:woocommerce:product_url}}

Awesome, @ruudvanbeek! Thanks for letting us know and for sharing your resolution here. Always appreciated!

@kory Always happy to help those who help :slight_smile:

Still, this was only 1 part of the question. Can you or one of your colleagues share their vision on the remaining please?

Hey, @ruudvanbeek, as for a condition to only show when a product is a “Composite,” we do not currently have something in for this, but we are planning on looking into adding more WooCommerce conditions as time goes on and we have a chance to audit things more. Perhaps you can help me a little more with this to understand what you’re looking to do when adding an item to your cart. If at all possible, are you able to take a recording of your desktop while you walk through / explain what you’re attempting to wire up on the index, as I’m not entirely following the concept at the moment. If you have an example site you know of that is already using WooCommerce and doing this, that would be great to see as well. Once we can understand a little more what you’re trying to wire up, we can help point you in the right direction, or look to adding this functionality in a future release.

Ok @kory , we have an implementation in our live store for you to get the concept:
Composite example 1 - Composite example 2
The idea is that we supply products with “empty” slots where the customer can select modules to fill these slots. As a result not only the basic product is added to the basket, but also the chosen module. Basket/checkout registers all details as a composite product.

To let Woo handle this we use this: Composite Products Plugin

All resulting in our store handling 3 types of products:

  1. simple product
  2. variable product
  3. composite product

Because of the different kind of processing (other product form layout) we need to distinguish between these different types from the product archive layout.

Just let me know if you need more information.

Howdy, @ruudvanbeek! Thanks for that, that’s just the information we needed. :slight_smile: So after looking into this a bit more, we were able to setup a Product Type condition that will be able to output a hardcoded condition for the basic WooCommerce types that come stock with the plugin, which includes:

  • Simple
  • Grouped
  • External
  • Variable
  • Variation

However, WooCommerce does not have a way for us to automatically enumerate over the various types that may or may not be registered by a 3rd party plugin (“Composite” in your case). That being said, there are a couple of ways you can extend this list or leverage our new Element Condition Expressions with the next release…it really comes down to how you’d like to manage things.

First, if you would like for your “Composite” Products to show up in the Conditions list by default along with the previous types listed above, you can easily extend that list using a filter that will be available in the next release. To do this, you would just need to add the following code to your child theme’s functions.php file:

add_filter( 'cs_conditions_wc_product_types', function( $types ) {
  $types[] = [ 'value' => 'composite', 'label' => 'Composite' ],
  return $types;
});

This will have that new type registered in the list for you to easily access. You could even reach out to the plugin developer and see if they would prefer to put this in their core code so that it’s just part of the product for anyone using Pro moving forward.

The other method would be to use the new {{dc:woocommerce:product_type}} Dynamic Content string, which will be available in the next release. You can use this with an Element Condition Expression operating on a String to see if it matches your type, like so:

This will effectively perform the same action, it really comes down to which you prefer to setup and manage. Again, this will all be available in the next release. Once that’s out, you should be able to setup the conditions that you need. Hopefully this helps to get you moving in the right direction…cheers!

Great! Many thanks @kory

Both of the suggested options will work for us. Now I almost don’t dare to ask… any timeline on a next release :sweat_smile:

Hi @ruudvanbeek,

Later today! We’re working on a few more things but should have it out later.

Wow, you guys are really great!
Thanks @alexander

No problem, happy to help! :smiley:

@kory, just installed the latest version; works like a charm :+1:

Great News!
If there is anything else we can help you with, please do not hesitate to open another thread.

This topic was automatically closed 10 days after the last reply. New replies are no longer allowed.