Change default body text size and style?

agallia

How can I change the site default body text style, size? Thanks.

Allen

If you are using one theme site wide you can set the font in it.

agallia

Allen wrote: »

If you are using one theme site wide you can set the font in it.

Yes, set font. But no option to set size?

agallia

How to change theme font size/color?
I can change active theme heading and body fonts as well as heading weight. But how do I change the site wide body font size/weight and color for both? Thanks.

denisegoldberg

There are some font customizations on this page - http://www.aaronmphotography.com/Customizations/Fonts-Links.

--- Denise

agallia

denisegoldberg wrote: »

There are some font customizations on this page - http://www.aaronmphotography.com/Customizations/Fonts-Links.

--- Denise

Don't see my issue there. Want to change default body font size for entire site.

Hikin' Mike

agallia wrote: »

Don't see my issue there. Want to change default body font size for entire site.

Site-wide CSS:

body,
.sm-user-ui body {
    font-size: 18px;
    }

agallia

Hikin' Mike wrote: »

Site-wide CSS:

body,
.sm-user-ui body {
    font-size: 18px;
    }

Thank you! Just what I needed

Hikin' Mike

agallia wrote: »

Thank you! Just what I needed, except used 1.2em.

On my old theme I did that:

html,
html.sm-user-ui {font-size: 16px;}

body,
.sm-user-ui body {
    font-size: 1.25rem;
    line-height: 1.5;
    }

WinsomeWorks

Other Font Size or boldness changes, site-wide or in a folder?
I've wondered about some of these same mods as far as text size (& boldness). It seems odd to me that you can set the font colors & styles w/o CSS, but not the size? If that's the case, then could someone define the different terms for various fonts so that I can work on changing some of their sizes with CSS? In other words, what is "body font", & what other font types/locations would I need to know?

One font size I definitely hope to change are parts of the breadcrumb, such as the large part of the breadcrumb that is showing what page I'm on. (guess it would be the title part of it?) I want the title part a bit larger than the rest of the breadcrumb, but not as huge as it is now. I found the CSS below on Aaron's page (which Denise linked); it affects the color of the whole breadcrumb. But I'm not sure how to target only the title-part with color, or the size of only the title-part. Possibly I'd like to make just the title-part of breadcrumb bold. What would make it bold?

/* Change the breadcrumb color */ .sm-breadcrumb-item, .sm-breadcrumb-item a {   color: #00fffb!important; }

For font sizes in my menu (nav) bar, I think the choices in "customize" were only XL, L, M, S, etc. Is there a way to get more increments thru CSS? ( L was too large & M is too small, I think)

Lastly, Agallia mentioned font weight. When I was choosing fonts in my theme, I only found one or two fonts out of the dozens I tried that gave a choice of weight (bold or regular), even tho many looked like there'd be a choice (the "choice" was greyed out). Was something wrong, or is there usually just no choice?

Hikin' Mike

WinsomeWorks wrote: »

One font size I definitely hope to change are parts of the breadcrumb, such as the large part of the breadcrumb that is showing what page I'm on. (guess it would be the title part of it?) I want the title part a bit larger than the rest of the breadcrumb, but not as huge as it is now. I found the CSS below on Aaron's page (which Denise linked); it affects the color of the whole breadcrumb. But I'm not sure how to target only the title-part with color, or the size of only the title-part. Possibly I'd like to make just the title-part of breadcrumb bold. What would make it bold?

This should change the last breadcrumb text:

.sm-user-ui .sm-breadcrumb .sm-breadcrumb-item h1{
     font-size: 24px;
     font-weight: bold;
}

WinsomeWorks

Where to put CSS for Font changes
Thanks so much, Mike! I forgot to ask where it's best to put CSS for font changes that won't affect anything on the homepage. In other words, I don't have a breadcrumb on the homepage of course, but if I want these changes to affect everything else, is it best to go to my All Galleries ( /Browse ) page first, then click Customize, then "Content & Design", then "Theme", then the wrench by my theme? Then what... not sure...

Hikin' Mike

WinsomeWorks wrote: »

Thanks so much, Mike! I forgot to ask where it's best to put CSS for font changes that won't affect anything on the homepage. In other words, I don't have a breadcrumb on the homepage of course, but if I want these changes to affect everything else, is it best to go to my All Galleries ( /Browse ) page first, then click Customize, then "Content & Design", then "Theme", then the wrench by my theme? Then what... not sure...

I put all of my CSS on my theme's CSS.

Allen

WinsomeWorks wrote: »

Thanks so much, Mike! I forgot to ask where it's best to put CSS for font changes that won't affect anything on the homepage. In other words, I don't have a breadcrumb on the homepage of course, but if I want these changes to affect everything else, is it best to go to my All Galleries ( /Browse ) page first, then click Customize, then "Content & Design", then "Theme", then the wrench by my theme? Then what... not sure...

If you are using only one theme and are not going to change you can put it in the themes CSS. But if
you use different themes or are planning to change sometime I'd put it in "entire site.

I think it is a bad idea to put all CSS in the theme. I like to put it were it applies, "entire site", "all folders" or "all galleries". It's much easier to find and know what areas it applies to.

Hikin' Mike

Allen wrote: »

If you are using only one theme and are not going to change you can put it in the themes CSS. But if
you use different themes or are planning to change sometime I'd put it in "entire site.

I think it is a bad idea to put all CSS in the theme. I like to put it were it applies, "entire site", "all folders" or "all galleries". It's much easier to find and know what areas it applies to.

For me, it's easier for me to put it on one CSS sheet (Theme's CSS). Having done a bunch of WordPress sites, that's what they do, so I'm just used to thinking that way.

WinsomeWorks

"Sorting out" where to put CSS so future theme changes aren't impeded
Ok, I'm trying to sort this out before I do any more customizing. I want to get my CSS into the most logical spots so I don't "have my hands tied" in the future. I'm still rather unclear how themes affect & don't affect site design & vice versa, but with that confession upfront, I'll also add that I'm hoping to make it fairly possible to change the general appearance of my whole site sometime-- changes I'd want could include: overall colors / backgrounds, layout, & most definitely nav bar & logo appearance & location. SO-o-O I'd already plunked some CSS in the days B4 seeing this discussion, by going to "Customize" at top left, then the large right side dialog appears.. ( i.e. I'd followed this instruction from Aaron's customizations) :

1. Click on Customize --> Customize Site.
2. Select "Entire Site" from the menu.
3. Click on the "Theme" tab.
4. Click the wrench next to your "Active Tab" to Edit your Theme.
5. Click on the "Advanced" tab
6. Click on "Edit" next to "Custom CSS"
7. Paste in the following code and modify as required

However, Allen-- I'm not clear if the above is what you mean is best, or not best, if I hope to be able to change themes etc. sometime? (I think you're saying not, but if so, I'm not clear where it should go exactly?) I can move the code I have there now to a different spot if another place is better, since I haven't done a whole lot. So far I've added code for various hover actions (a couple of them affect homepage &/or all folders, such as nav bar & social icons & hover effect for folders' feature photos displays.) I've changed some font-colors & font-sizes on folder title overlays & breadcrumbs using CSS too.

I'm about to add some code to affect lightbox displays, and am also trying to find something to make my menu items change color when hovered. (thought I'd done that, but the item only changes color according to what page I'm on, not hovering) So I'd like to put that CSS in the "right" spots, where it won't all go awry if I change my theme or bkgrd or general layout. Warning: I will need step-by-step like Aaron gave to find the "right spot", cuz the choices in the dialogues are daunting. Thank you, men-- I'm sure you'll settle this for me w/o coming to blows! :lurk :giggle

Allen wrote: »

If you are using only one theme and are not going to change you can put it in the themes CSS. But if
you use different themes or are planning to change sometime I'd put it in "entire site.

I think it is a bad idea to put all CSS in the theme. I like to put it were it applies, "entire site", "all folders" or "all galleries". It's much easier to find and know what areas it applies to.

Allen

Wherever you put CSS make sure to put comments tags around each or group of rules. We can quickly forget just
what the reason was for the CSS rule.

Allen

A lightbox CSS rule is a funny one because lightbox is used all over the place, not just galleries, but widgets
and even in Organizer. I'd keep them in "entire site".

WinsomeWorks

Yes, Al-- I've been making sure to comment on all my CSS. However, I am more & more confused about the placement of CSS. You didn't say whether the instructions I pasted from Aaron were already taking me to the 'correct" place in your eyes, as far as placing CSS when one thinks one may in the future want to modify one's theme.

As I explain in this post to Lille Ulven just now, I seriously cannot find any other place to put CSS, no matter what page I'm on when I first hit "Customize"... frustrating. I feel so stupid. What am I missing? How/where else can I get to a CSS box? http://dgrin.com/showpost.php?p=2014029&postcount=3 (Last paragraph)