On image Bottom label position covers navigation buttons

  • I love this plugin but I have discovered an issue
    If I select the position of ON IMAGE, LEFT BOTTOM, then on the product page, the label isn’t on the left corner of the main image. Left of my main image is thumbnails of more images of the product and at the bottom of the column of thumbnails are navigation arrows for these thumbnails. So your plugin seems to consider the whole block – main image, thumbnails and navigation buttons as my image, so LEFT BOTTOM label is on top of the navigation arrows!

    I thought, oh well, I’ll just put the label on RIGHT BOTTOM ON IMAGE, but I have found that this label has some kind of invisible thing right across the bottom of my main image and thumbnails block so it still effectively covers the navigation buttons. You can see the buttons fine but they don’t work for products that have label in any of the ON IMAGE – BOTTOM positions.

    By doing R-click and INSPECT in this area I see a block that covers this area. It says “div.advanced-woo-labels.awl-position-type-on-image.awl-label-type-single.awl-align…”

    The workaround solution is that I just don’t use the ON IMAGE, Bottom Left/Right/Centre positions for labels. But is there a way to fix this issue so that I can please?

    The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)
  • Plugin Author ILLID

    (@mihail-barinov)

    Hello,

    Please try to use following code snippet:

    add_filter( 'awl_labels_hooks', 'my_awl_labels_hooks' );
function my_awl_labels_hooks( $hooks ) {
    $hooks['on_image']['single'] = array( 'woocommerce_product_thumbnails' => array( 'priority' => 10, 'js' =>  array( '.woocommerce-product-gallery figure', 'append' ) ) );
    return $hooks;
}

    You need to add it somewhere outside the plugins folder. For example, inside functions.php file of your theme or use some plugin for adding code snippets.

    Regards

    Thread Starter facepaintworld

    (@facepaintworld)

    thanks!

    Thread Starter facepaintworld

    (@facepaintworld)

    Thank you but could you please review the code you gave me?

    I have just installed plugin CODE SNIPPETS in order to add this fix. I successfully added a code snippet for something else but when I copied and pasted your snippet (below) I got this error:

    The code snippet you are trying to save produced a fatal error on line 1:
    syntax error, unexpected ‘&’

    The plugin has function to add snippets as HTML shortcode, CSS snippet or JavaScript snippet. I tried HTML shortcode. Should it be one of the others?

    add_filter( 'awl_labels_hooks', 'my_awl_labels_hooks' );
    function my_awl_labels_hooks( $hooks ) {
    $hooks['on_image']['single'] = array( 'woocommerce_product_thumbnails' => array( 'priority' => 10, 'js' => array( '.woocommerce-product-gallery figure', 'append' ) ) );
    return $hooks;
    }

    Plugin Author ILLID

    (@mihail-barinov)

    Code looks fine. Can you please give me screenshot of this snippet with appearing error message?

    Regards

    Thread Starter facepaintworld

    (@facepaintworld)

    how do I add screenshots please?

    Plugin Author ILLID

    (@mihail-barinov)

    Well you can use any image hosting. For example https://prnt.sc/ .

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘On image Bottom label position covers navigation buttons’ is closed to new replies.