Reduce text size on site and on page SEO

Store Design

Topic summary

A Shopify store owner seeks to reduce font sizes across their site, particularly for on-page SEO content and product descriptions on collection and product pages.

Problem Areas:

  • Collection page SEO text appears too large
  • Product description fonts are oversized
  • Overall site text needs to be reduced below 100%

Proposed Solutions:

Two community members provided CSS-based fixes:

  1. First approach: Add custom CSS code in the theme.liquid file, placed above the </body> tag

  2. Second approach: Modify the base.css file by adding targeted CSS rules to reduce font sizes for:

    • Product titles (.product__title h1)
    • Collection hero descriptions (.collection-hero__description)
    • Hero text wrappers

Both solutions involve editing theme code files and applying font-size adjustments with !important declarations to override existing styles. The discussion remains open with no confirmation from the original poster about which solution was implemented or whether the issue was resolved.

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

Hi,

Any idea how I can reduce the text size on my site, under 100% . Especially for this sort of on page seo on this page.. and overall on my product descriptions the font size is so large…

https://fashionfanbase.com/collections/custom-tech-drawings

https://fashionfanbase.com/products/custom-fashion-flat-sketch-custom-fashion-technical-drawing-fashion-design-sketch-tech-pack-drawing-tech-pack-template-made-to-order

Any ideas welcome :slightly_smiling_face:

Screen Shot 2024-09-09 at 8.25.47 pm.png
Screen Shot 2024-09-09 at 8.25.47 pm.png2606×1556 723 KB

Screen Shot 2024-09-09 at 8.25.41 pm.png
Screen Shot 2024-09-09 at 8.25.41 pm.png2032×1726 456 KB

1 Like
2

Hey @Bim39

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-1725885341307.png
Moeed_0-1725885341307.png1159×844 167 KB

Moeed_1-1725885354773.png
Moeed_1-1725885354773.png1153×862 209 KB

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

Best Regards,
Moeed

3

Hi @Bim39

  1. In your Shopify Admin go to online store > themes > actions > edit code
  2. Find Asset > base.css and paste this at the bottom of the file:
.collection-hero__text-wrapper h1 {
font-size: 25px !important;
}
.collection-hero__description.rte {
font-size: 1.2rem !important;
}
.product__title h1 {
font-size: 25px !important;
}
1 Like