make my discover more button less on height

Store Design
,

Topic summary

A user seeks to reduce the height of a “Discover More” button on their Shopify store (swawe.store), noting it appears too large in both width and length.

Solution Provided:

  • Add custom CSS code to the theme.liquid file before the closing </body> tag
  • The CSS targets .rich-text a.button.button--secondary with specific styling:
    • Padding: 10px 40px
    • Font size: 18px
    • Text transform: uppercase
    • Display: flex
    • Font weight: 700
    • Justify content and align items: center

Implementation Steps:

  1. Navigate to Online Store → Theme → Edit code
  2. Open theme.liquid file
  3. Insert the provided CSS code

The solution was marked as accepted, indicating it successfully resolved the button sizing issue.

Summarized with AI on November 7. AI used: claude-sonnet-4-5-20250929.
1

I want the discover more button of my website https://swawe.store/ look like this attached image , big on length and width

Screenshot 2024-08-11 at 11.30.16.png
Screenshot 2024-08-11 at 11.30.16.png2795×163 10.4 KB

2

Hello @attackon

You can add code by following these steps

  1. Go to Online Store → Theme → Edit code.

  2. Open your theme.liquid file

  3. Paste the below code before on theme.liquid

.rich-text a.button.button--secondary { padding: 10px 40px !important; font-size: 18px !important; text-transform: uppercase !important; display: flex !important; font-weight: 700 !important; justify-content: center !important; align-items: center !important; }

niraj_patel_0-1723357147369.png
niraj_patel_0-1723357147369.png1346×200 2.19 KB

Was my reply helpful? Click Like to let me know!
Was your question answered? Mark it as an Accepted Solution.