Support » Fixing WordPress » Single product layout trouble

Viewing 13 replies - 1 through 13 (of 13 total)
  • The second link gives a page-not-found error.

    Essentially it just has all the product options stacked on the right side going vertically. I want the options to be displayed horizonally across the entire page.

    Need to see it please.

    It looks like you are using a plugin to get that layout, if so which one?

    To stand a chance of restyling it, please could you post a link to the live page so the markup and styles can be examined with browser tools.

    Okay, looking at the inspect element feature, it looks like I somehow need to change: class=”composite_form small_width legacy_width” to: class=”composite_form full_width”

    Where would I do that?

    I can’t see that class, but to make a change like that you would need to find the lines that generate it in the plugin code. Any alteration to the plugin code would essentially make a new plugin, making updating difficult.

    I think the text needs to be dropped down below the image, so there is more room for the options to show side by side. Try this in your custom css:

    .product .images
    {float:none}
    .product .summary.entry-summary
    {margin-left:0}
    ul.component_option_thumbnails_container li.component_option_thumbnail_container
    {width: 30% !important}

    If you have more than 3 options elsewhere, reduce the 30% accordingly.

    If your theme does not have a setting where you can enter custom css, you can use a plugin like this one:
    https://wordpress.org/plugins/simple-custom-css/

    That worked! Thank you very much! Is there any way that I can have that only apply to a specific product? Right now it applies to every product, but I would like it to just apply to that specific product.

    Yes, you will need to look at the body tag and get the post id class: “postid-5994” or whatever, and use that as a selector.

    .postid-5994 .product .images
    {float:none}
    .postid-5994 .product .summary.entry-summary
    {margin-left:0}
    .postid-5994 ul.component_option_thumbnails_container li.component_option_thumbnail_container
    {width: 30% !important}

    You are the man. Last thing, I have scenarios set up for that product so that when you select a certain base model, you can only have access to specific nozzles. Click on change base model and choose the first option “SMP.” Then go to “Nozzles” and you will see that the first few pages are full of “grayed out” options. I would like those to be hidden instead of grayed out so the customer does not have to skip to page 3 before he can actually choose an option. I have tried this: https://gist.github.com/franticpsyx/4db5769fb449be8ab18e#file-woocommerce-composites-hide-incompatible-component-options-php

    and it has not worked for me. Do you have any suggestions?

    The filter was added in plugin version 3.2.0 published 31/07/15, so make sure you have that version or later.
    http://dzv365zjfbd8v.cloudfront.net/changelogs/woocommerce-composite-products/changelog.txt

    In the code snippet, try say 50 instead of the 10 for the third parameter of add_filter(). This corresponds to later execution, in case anything else has used the 10 spot.

    You can choose to not display the disabled options with:

    .component_option_thumbnail.disabled {display:none}

    however this is no good because the disabled ones still exist and must be paginated-through, unless you can display all the options on one page, without pagination?

    If it still won’t work, press Woo support for help. Support for commercial products is included in the price.

    Awesome, you have been very helpful. Thank you so much!

Viewing 13 replies - 1 through 13 (of 13 total)
  • The topic ‘Single product layout trouble’ is closed to new replies.