Home › Forums › WoodMart support forum › Display Issue with Third-Party Review Integration (Overlap & White Space)

Display Issue with Third-Party Review Integration (Overlap & White Space)

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • May 15, 2025 at 6:09 pm #661003

    lost.hinata
    Participant

    Hello Woodmart Support,

    I’ve successfully integrated a third-party automatic review system (used widely in France), and everything is working perfectly from a technical point of view.

    However, I’ve noticed a display issue on some product pages.

    As shown in the screenshots and admin links I’ve provided (in private content), there is:

    Content overlapping with other elements.

    A white space that appears unexpectedly below the review block.

    Could you please take a look and let me know:

    If there’s a way to fix this via CSS?

    Or if it’s something I should adjust in the theme settings or back-office?

    Thanks in advance for your help!

    Best regards,
    Cédric M.

    Attachments:
    You must be logged in to view attached files.
    May 16, 2025 at 6:14 am #661060

    Hung Pham
    Keymaster

    Hi lost.hinata,

    Thanks for reaching to us.

    Please add the below Custom CSS code to Theme Settings > Custom CSS > Global Custom CSS:

    div.steavisgarantisStar {
    width: 100%;
    max-width: 100%;
}

    Regards,

    May 20, 2025 at 6:40 pm #661958

    lost.hinata
    Participant

    Hello Woodmart Support,

    It seems there’s a problem with the current CSS applied to the product grid.

    While the style works as expected on the product listing grid, it also affects the badge area on the single product page.

    As a result:

    The box that contains the product reviews is unexpectedly expanding.

    And an extra review star appears outside the intended area.

    This is likely due to a shared class or rule that’s applying globally instead of just on the product grid.

    Could you please help me identify the issue or provide a fix so that the CSS applies only to the product grid and not the single product layout?

    Thanks in advance for your help!

    Best regards,
    Cédric M.

    May 21, 2025 at 4:53 am #662014

    Hung Pham
    Keymaster

    Hi lost.hinata,

    Please remove above code and try below one:

    .wd-grid-col div.steavisgarantisStar {
    width: 100%;
    max-width: 100%;
}

    Regards,
    Hung PD

    May 21, 2025 at 5:07 pm #662295

    lost.hinata
    Participant

    The previous fix works well in general — thank you for that.
    However, I’m still noticing an issue specifically on product pages:
    there’s a layout shift that causes an extra grey star to appear, which doesn’t belong there.

    It seems to be caused by the same CSS rule.
    Could you please help me adjust the code so that it only applies to the product grid, and not to the product page layout?

    Thanks again for your help!

    May 21, 2025 at 5:12 pm #662300

    Hung Pham
    Keymaster

    Hi lost.hinata,

    Please remove above code and try below one:

    body:not(.single-product) .wd-grid-col div.steavisgarantisStar {
    width: 100%;
    max-width: 100%;
}

    Regards,
    Hung PD

  • Author
    Posts
Viewing 6 posts - 1 through 6 (of 6 total)