Title size and color change?

jasonbeardadventure · Member · Jan 19, 2017 at 7:52 pm
Copy link

Add topic to favorites
Hello
I need help with a CSS change to the title of my page.
I would like the Title to be about 3 times larger and this color #9c151a; but I cannot figure out how to make the change.

The blog I need help with is: (visible only to logged in users)
seasonschangecc · Member · Jan 19, 2017 at 10:44 pm
Copy link
Hi!

Try adding this Custom CSS:
```
.site-branding .site-title a {
    color: #9c151a;
}

.wf-active .site-branding h1.site-title {
    font-size: 2.7em;
}
```
You can play with the font-size number. 3em looked a little too big to me, but it’s your site!

To access the CSS editor, first launch your site customizer then click on the CSS tab to access the CSS editor.

Hope this helps and let me know if you have any questions!
jasonbeardadventure · Member · Jan 19, 2017 at 11:02 pm
Copy link
Thanks so much for the help!
The color change worked but not the font change.
jasonbeardadventure · Member · Jan 19, 2017 at 11:07 pm
Copy link
I can get the font size of the title to change on the Inspect Element here:

h3, blockquote cite, .pique-template-testimonials .pique-testimonials article .entry-content cite, .site-branding .site-title, .widget-title {
font-family: Karla, Arial, sans-serif;
font-size: 2.7em;
font-weight: 700;
letter-spacing: 1px;
margin-bottom: 20px;
padding-bottom: 10px;
text-align: left;
text-transform: uppercase;
}

However, I can’t get the right CSS combination to permanently change the site. The only change that seems to happen is the Read More button gets really big.
seasonschangecc · Member · Jan 19, 2017 at 11:30 pm
Copy link
Which title are you wanting to make bigger: “Jason Beard Adventure” and/or “Jan 2017 2-Day Snow wheeling”?

The code I gave you above was to make the “Jason Beard Adventure” title bigger.

Also, I’m not seeing the color changes in your site’s CSS. Are you playing with browser dev tools before you save the CSS changes?

No items found.