Jump to content

Changing Mobile font size on a single page

Recommended Posts

I’m looking for some help to change the mobile font size on a single page on a website.  I have CSS code changing the font size for all mobile pages, which is perfect, but now I need to further modify the mobile font on a single page without impacting the font size at the other page breaks.  I also don’t want the CSS to impact font size on any other page.  Any help would be appreciated!

Link to comment
  • Replies 5
  • Created
  • Last Reply

If you're using Squarespace 7.0 (NOT 7.1):

  • Use Chrome browser and use it to install the following Chrome extension - https://chrome.google.com/webstore/detail/squarespace-collectionblo/bggpdfnccodbnmcndckmeehdjkjojkde
  • Visit the page you want to modify the text on and click the extension's icon image.png.45e20e59014a9a458e6f62f8d7005e38.png
  • An overlay will appear showing all of the permanent collection and block ids on the page
  • Click the top left, collection overlay item and it will copy to your clipboard image.png.7ec3d6a7225d92a3a922762056c234bd.png
  • Now take a copy of your existing font color code and prefix it with the collection id. Paste the copy *after* the code you already have. That sets up the css so that it tweaks the color for everything and then applies the second color tweak only to relevant collection. 

Without seeing your code it's difficult to give a specific code example but it's probably something like 

@media only screen and (max-width: 640px) {
	#something .something {
		color: red;

You would modify it with the collection ID as follows

@media only screen and (max-width: 640px) {
	#collection-535e7627e4b0140e264640b8 #something .something {
		color: blue;

NB - Above I use a collection ID from a page on  my site - you need the one from your page. 

If you're looking for a Squarespace Developer, drop me a line. 

Link to comment
  • 4 weeks later...
1 hour ago, Gui said:

Hello, Can someone help me with this? Im trying to change the font on these product pages without affecting the rest of the website. Can someone help? 

The font im trying to chnage is the small reading one Its my P font

Thank you!


please share access password.

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment


This topic is now archived and is closed to further replies.

  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.