Rounded Edges on Product Page

Store Design
, , , ,

Topic summary

Main issue: round the edges of an element on a Shopify product page, illustrated with before/after screenshots.

Recent update: A community member provided step-by-step theme changes.

  • Navigate to Online Store > Edit Code.
  • Open the theme.liquid file.
  • Add custom code just above the closing tag.

Context: The store link was shared to show the target product page. Screenshots are central to understanding the desired rounded look. A code snippet was referenced, though the exact CSS/markup is not visible in the conversation.

Technical notes: theme.liquid is the main layout file in a Shopify theme. The tag is the HTML closing tag where site-wide scripts or styles can be injected.

Outcome: The original poster confirmed that both suggested methods worked. The issue appears resolved, with no remaining questions or disagreements.

Status: Resolved; no further action items indicated.

Summarized with AI on January 2. AI used: gpt-5.
1

Hi,

How to round the edge of this:

Opera Instantâneo_2024-03-27_104317_tudoconexao.com.png
Opera Instantâneo_2024-03-27_104317_tudoconexao.com.png397×240 29.4 KB

Like this:

Opera Instantâneo_2024-03-27_104335_tudoconexao.com.png
Opera Instantâneo_2024-03-27_104335_tudoconexao.com.png331×450 105 KB

Store: tudoconexao.com

2

Hi @Dawenn

Follow these Steps:

  1. Go to Online Store
  2. Edit Code
  3. Find theme.liquid file
  4. Add the following code just above tag

theycallmemakka_0-1711552003733.png
theycallmemakka_0-1711552003733.png1567Ă—353 225 KB

If you require further help to optimize your store, please don’t hesitate to reach out. If you find this information useful, a Like would be greatly appreciated. And if this solves the problem, please Mark it as Solution!

Best Regards,
Makka

1 Like
3

Both methods worked! Thank you!

@hustlewithdream @theycallmemakka