How to change text size for Icon with Text

Store Design
, , , ,

Topic summary

A user seeks help reducing text size in an “Icon with Text” section but lacks CSS knowledge. They shared a screenshot showing the element in question.

Solution provided:

  • Navigate to Online Stores > Themes > More Actions > Edit code
  • Open theme.liquid file
  • Insert custom CSS code above the </head> tag
  • Adjust the 20px value to control font size

The CSS targets .icon-with-text__heading with font-size and !important declaration.

Follow-up issue:
Two years later, another user reports the solution didn’t work for them. They haven’t saved changes yet due to concerns about reverting modifications if needed.

Status: The original issue appears resolved, but the newer inquiry about implementation remains unanswered.

Summarized with AI on October 31. AI used: claude-sonnet-4-5-20250929.
1

I want to make this text smaller and can’t seem to figure it out as I’m not good with CSS

switchybits_0-1703626129970.png
switchybits_0-1703626129970.png692×770 37.2 KB

2

Hi @switchybits

This is Richard from PageFly - Shopify Page Builder App

Please add this code to your theme.liquid above the to get this solved

Step 1: Online Stores > Themes > More Actions > Edit code

Step 2: click on theme.liquid and paste the code above the

You can adjust the 20px value to increase/decrease font-size

Hope this can help you solve the issue

Best regards,

Richard | PageFly

2 Likes
3

Hi Richard! I know it’s been two years since you answered this question but I tried what you suggested and my font still hasn’t changed. Is it because I actually need to save it first for it to change? ( a little scared to save as I’m worried I wouldn’t know how to put it back the way it was)

Thank you!