Changing font-size in Backlight

Update: As of Backlight 3.2 you can now change the fonts size in the page template. Look in your page template under Content > Main Copy. You’ll see Font-size and Line-height options that will let you increase or decrease the value for each setting. There is also a Custom option that will allow you to enter a value in pixels.

But if you’re still on an earlier version, read on….

In Backlight, the standard body font size is 16px. That’s baked in and there is no control to change it. Everything else is based from that using em or rem. Except specific areas where we have control over font size.

It looks like the .the__copy selector controls the main copy areas (1em) and .widget controls the pallets (0.875em)
(note that there are two underscores in .the__copy)

So you can use those selectors in your custom css to adjust the size. If you wanted 18px fonts for the main copy, you can do either this:

.the__copy {
font-size: 18px;
}

Or

.the__copy {
Font-size: 1.125em;
}

I think that .the__copy should be specific enough. If you only want to make the change to specific sections of a page, you can write the copy in html and add the styling inline:

</pre>
<p style="font-size: 1.25em;">Your text....</p>

You can also target specific pages or page or album or album set templates by using classes found in the body tag.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.

About this site

This site is: a repository of time-savers and best practices from a user's perspective, picked up from several years of using TTG plugins.
This site is not: a support site.
Read more here.

Subscribe to new posts

Tip Jar

If this site has saved you some time, kept your hair attached, or otherwise prevented you from tossing the mouse through the monitor, feel free to donate.

Categories


Highly recommended. This is my go-to Lightroom book. Click on the book image. (affiliate link)

Affiliate link!

Current TTG versions

Backlight  4 & 5

See the Backlight Modules page on your site for latest Backlight and module versions and changelogs.

You’ll also find the latest version number and download link for the Lightroom Publisher plugin.
(BL 3 and later)

 

Backlight 1 Versions

Backlight 1.2.4
Pages module 1.2.4
Cart Add-on 4.1.7
Client Response Add-on 7.1.3
Theater Add-on 1.2.6
Galleria Add-on 1.0.0
WordPress Add-on 1.2.6
Publisher 3.2.3

Backlight 1 has seen its end of life. See this post.

CE4 Versions

note: CE4 is no longer being developed or sold. See this post.

TTG-BE: 2.0.5a
Autoindex: 7.0.8
Cart: 3.1.4a
CRG: 6.1.3a
Gallery: 6.1.10
Pages: 7.0.15
Publisher: 2.3.3
Stage: 6.1.6
Theme for WordPress: 3.1.2