Jump to content
Search In
  • More options...
Find results that contain...
Find results in...
Advanced Search
  • 0

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


mvandertol
Go to solution Solved by kale,

Question

  • Answers 13
  • Created
  • Last Reply

Top Posters For This Question

Top Posters For This Question

Popular Posts

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

How do I change the font size used in the caption of image blocks for Beatrice template? Do I need to inject the same code on each page I use the image block on?

13 answers to this question

Recommended Posts

  • 12

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 post
  • 0
Guest

is there a way to place the text against a white rectangle block as the image description - similar to marquee template?

Link to post
  • 1

I tried this and it only worked on the first image on my page. I'd like it to work on all images and I have multiples on the page. Anyone know the code for that?

Link to post
  • 0

I just applied this to my Aviator template - works great. Now how can I reduce the size of the padding between the images and the captions? The default is ridiculously wide..

Edited by Lostcoast
Initial Revision
Link to post
  • 0

I just applied this to my Aviator template - works great. Now how can I reduce the size of the padding between the images and the captions? The default is ridiculously wide..

Link to post
  • 0

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 post

Create an account or sign in to comment

You need to be a member in order to leave a comment


×
×
  • Create New...