woocommerce gallery (4 posts)

  1. VIVA Design
    Posted 3 years ago #

    Hi there

    I was wondering if anyone could help me, as I am new to wordpress.

    This is my website http://www.choobee.co.uk/product/polka-dots when you click on the product the product is enlarged, however at the bottom there are some thumbnails when you hover over the enlarge picture. I want to remove it.

    I have tried the following code
    .pp_gallery {display:none;}

    But it does not work any help will be appreciated.

  2. bcworkz
    Posted 3 years ago #

    .thumbnails {display: none;} will do it, but could cause undesirable side effects elsewhere in elements with the same class descriptor.

    Where it is placed will also have say on whether it works or not. It will work as inline element or page style, but involves template editing. Editing templates or other CSS files mean your change will be lost during an update. The best place for this is in a child theme, if it works. Sometimes adding !important will do the trick. Another approach is to start a new CSS file and include it with wp_enqueue_style() .

  3. VIVA Design
    Posted 3 years ago #

    I used that but then it removes the thumbnails on the page, I want to remove the thumbnails on hover only!

  4. bcworkz
    Posted 3 years ago #

    Ah, I see now. Sorry for my confusion. This isn't a straight CSS solution, as javascript or probably jQuery is changing the visibility on the rollover event. You would need to find where in the script the event handler is assigned and comment it out.

    To confuse things, most of the script is minified, you will need to dig into the development version to find the code, make the change, then reference the altered file instead of the minified one on your template. You still would want to protect your changes as mentioned above.

Topic Closed

This topic has been closed to new replies.

About this Topic