Jump to content

How do I change the font size used in the caption of image blocks?

Recommended Posts

  • Replies 13
  • Views 47k
  • Created
  • Last Reply

If you want this to be applied site wide, then you should use the custom CSS section, and will only have to add the CSS once -- if you want to control image captions on a single page, then you can use per page code injections and style tags.

For a single, site wide adjustment, go to 'Change Style' (paintbrush) > 'CSS' (hit confirm) and copy / paste this:


.sqs-block.image-block .image-caption-wrapper p { font-size: 16px; }

And then 'Save' in the CSS window, and 'Save' again in the 'Style Editor' slide-out.

If you want to control it on a page-per-page basis, you would instead go to the page in question, then go 'Manage Site' (gear icon) > 'Page Settings' > 'Advanced' > and paste this into the 'Page Header Code Injection' section (be sure to include style tags):


<style>
  .sqs-block.image-block .image-caption-wrapper p { font-size: 16px; }
</style>

You would need to do this on any page you wanted the CSS applied.

Link to comment
  • 1 month later...
  • 1 year later...
  • 3 months later...
  • 11 months later...
  • 3 months later...

I've been looking for a way to increase the font size on individual pages, for what seems like hours! Thanks to your code, @kale, I've been able to come up with a solution! By putting the code below into the CSS injection on an individual page, using the Five theme, I've been able to adjust the font size, for example, of text on my blog page. Thanks!


<style>
   .body p { font-size: 20px; }
</style>



Link to comment
  • 1 year later...
  • 2 years later...

Archived

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.