We use cookies to ensure that we give you the best experience on our website. If you continue to use this site we will assume that you are happy with it.

Ok, I Agree

WooCommerce product options (not variations)

Home › Forums › Puzzles › WooCommerce product options (not variations)

Viewing 8 posts - 1 through 8 (of 8 total)
  • Author
    Posts
  • 2022-10-19 at 2:07 pm #56677
    omrto
    Participant

    Will puzzles be able to link to additional product options instead of the attributes used for variations in WooCommerce? Essentially, I think this would mean targeting elements in the external product page in WooCommerce. When one of them is selected, say, adding a window to a storage shed, it will be added in the 3D model. Here are a couple of plugins I’m considering using for the options:

    https://codecanyon.net/item/woocommerce-extra-product-options/7908619
    https://yithemes.com/themes/plugins/yith-woocommerce-product-add-ons/

    According to this video (at 11:00) puzzles can target the id of HTML elements. What I’m wondering is if this will work the same way in the WordPress plugin to target elements in a WooCommerce product.

    The big reason this would be important is because products with a lot of different options would create an unmanageable number of variations. Extra product options would not as they can be used across many simple or variable products.

    2022-10-20 at 12:03 pm #56720
    Alexander Kovelenov
    Staff

    Hi, yes you can do this with WooCommerce the same way. If targeting elements by IDs is not sufficient, use the query selector puzzle which allows getting elements by CSS selectors.

    Soft8Soft Tech Chief
    X | FB | LinkedIn

    2022-10-20 at 1:12 pm #56721
    omrto
    Participant

    —

    2022-10-20 at 2:18 pm #56724
    omrto
    Participant

    OK great! Would it be possible for you to provide me an example of interacting with form elements like checkboxes and dropdowns to change elements of a 3D model? Or are there any good apps available I can download to study the puzzles? All the examples I have found only use simple buttons, but I need to be able to know if a checkbox is checked or what is selected in a dropdown in an external page to make changes to my 3D model. I’m a little familiar with JavaScript but not an expert. Thank you in advance for any help you can give.

    2022-10-20 at 2:53 pm #56725
    omrto
    Participant

    Here is a screenshot of one of my attempts to change the spinner model using a checkbox in WooCommerce. The page where the product is at is https://dev.omrto.com/product/spinner/

    It’s not working for me, even if I check “in parent doc.” The puzzle to the right is what I added. I’ve tried it also by adding a X = X comparison under Logic to check the value of the field, be it property = “checked” or value = “20”, but that didn’t work either.

    I was reading this part of the documentation to try and understand how to do this, but I think I need a more detailed example.
    https://www.soft8soft.com/docs/manual/en/puzzles/HTML.html#get_property
    and
    https://www.soft8soft.com/docs/manual/en/puzzles/HTML.html#query_selector

    Attachments:
    You must be logged in to view attached files.
    2022-10-21 at 8:16 pm #56740
    omrto
    Participant

    OK, I got it to partially work. It’s only working on page load, so I need to figure out how to get it to change when the checkbox changes. Basically, I think I need to add an event listener?

    2022-10-22 at 7:31 am #56742
    kdv
    Participant
    omrto wrote:

    Basically, I think I need to add an event listener?

    Puzzles and JS. Fast and expensive.

    If you don’t see the meaning in something it primarily means that you just don’t see it but not the absence of meaning at all.

    2022-10-24 at 1:28 pm #56821
    omrto
    Participant

    Awesome! Thank you! That worked a treat.

  • Author
    Posts
Viewing 8 posts - 1 through 8 (of 8 total)
  • You must be logged in to reply to this topic.