Support community for TTG plugins and products.
NOTICE
The Turning Gate's Community has moved to a new home, at https://discourse.theturninggate.net.
This forum is now closed, and exists here as a read-only archive.
You are not logged in.
I saw a reference to custom css in a posted response of another TTG user using an earlier version. Don't know what it is. I'm looking to increase the font size of my copy on my Contact and About pages. Both are located under Page Settings>Page Copy in Pages>About or contact> Design
[split to new topic by moderator]
Offline
Custom css (Cascading Style Sheets) is a way to change styling (colors, fonts, display properties.....).
Matt can't include every possible design option, so for those that need to go beyond what the template controls can do, there's custom css.
You have two options.
You can create a custom css file (http://backlight.theturninggate.net/doc … tylesheets) and target your changes to the Contact and About page in the custom css file using the body classes that are part of each page.
(this option is probably the least amount of work)
Or you can write your text using html in each of those pages and include the styling inline.
(this option means you don't need to create, upload, and use a custom css file. But you do have to write your text using html)
let us know which option you think you'd like to try. If option one, include a link to your site so we can see what body classes are being used on those pages. And also much bigger you want your font size to be. We can help you with the code.
Actually, include a link either way. A link to your site always helps.
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline
Let's give option 1 a try. In Backlight Standard Page I enabled custom style sheet. I chose the file backlight.css and the others did not seem to apply. Here's my site: http://martinjenichphotography.com/. My goal is to increase the font size of my page copy in the About and Contact tabs.
Offline
In your custom css file, add this:
.slug-about p, .slug-contact p {
font-size: 1.2em;
}this targets the paragraph elements on the about page (.slug-about) and contact page (.slug-contact) only.
you can use px, em, or rem for the font-size
the base font size is 16px, so 1.2em makes that about 19px. Or you can use a pixel size, like 18px
More on the font-size property: https://www.w3schools.com/cssref/pr_font_font-size.asp
and here: https://www.w3schools.com/css/css_font.asp
Rod
Just a user with way too much time on his hands.
www.rodbarbee.com
ttg-tips.com, Backlight 2/3 test site
Offline