Klaviyo Review Carousel Stretched Buttons Issue

Store Design
, , , , , , ,

Topic summary

Klaviyo Reviews carousel buttons on a Shopify homepage appear elongated/warped. The OP provided a site link and a screenshot showing distorted “view more reviews” buttons.

Proposed fixes focus on overriding button styles within the carousel:

  • Add CSS in Assets > styles.css to the .kl_reviews__carousel button selector (repeated for specificity) to reset min-width to auto and padding to 0.
  • Alternatively, add a block in theme.liquid before the tag targeting the same selector, setting min-width to 4% and padding to unset.
  • Another reply also advised inserting code above and shared a screenshot of the corrected result, but the actual snippet content was not visible.

Key details:

  • All solutions adjust button min-width and padding to remove the stretched appearance; the difference is where the CSS is placed (global stylesheet vs. inline in theme.liquid) and the exact values used (auto/0 vs. 4%/unset).
  • Multiple screenshots illustrate both the problem and a desired outcome.

Status: No confirmation from the OP; resolution pending. A responder offered direct support if needed.

Summarized with AI on December 24. AI used: gpt-5.
3

Hey @Taiku

Follow these Steps:

  1. Go to Online Store

  2. Edit Code

  3. Find theme.liquid file

  4. Add the following code in the bottom of the file above tag

RESULT:

Moeed_0-1721637329973.png
Moeed_0-1721637329973.png1448×451 48.7 KB

If I managed to help you then, don’t forget to Like it and Mark it as Solution!

Best Regards,
Moeed