To change the size your post and page titles, try this custom CSS, adjusting the number as you like:
.entry-title {
font-size: 50px;
}
To reduce the size of the body text, try something like this:
.entry-content, .entry-summary {
font-size: 16px;
}
Some tips:
Don’t edit the theme files directly, otherwise your changes will be overwritten when the theme is updated.
An easy way to add custom CSS is to install the Jetpack plugin and activate the Custom CSS module. You’ll then add your custom CSS in the new stylesheet editor that’ll appear in your dashboard, under Appearance > Edit CSS.
If you want to make other design tweaks, learning how to target your site’s CSS will help you do that. Here are some very helpful posts that will help you customize your site with CSS:
https://dailypost.wordpress.com/2013/07/25/css-selectors/
http://dailypost.wordpress.com/2013/06/21/css-intro/
http://dailypost.wordpress.com/2013/08/29/css-matched-rule-pane/
If CSS is new to you, here are some resources for learning more about it:
You can learn more about using media queries that target certain screen sizes here:
http://css-tricks.com/snippets/css/media-queries-for-standard-devices/
http://webdesignerwall.com/tutorials/responsive-design-with-css3-media-queries
Let me know how it goes, and if you need help with anything else, feel free to start a new thread.
Thanks — I’ll give this a try.
That worked nicely. One more question, if you don’t mind. What would be the code to reduce the size of the blockquote type?
Again, this is a great theme for my purposes. Thanks.
Try adding blockquote here:
.entry-content, .entry-summary, blockquote {
font-size: 16px;
}
I did, but no effect. For example, this post.
Ah, try this instead:
.entry-content, .entry-summary, blockquote p {
font-size: 16px;
}
Aha, almost there. How do I also keep the indent? (also curious how that extra “p” affected it)
Thanks!
The code above doesn’t affect the indenting, only the font size.
Ryu doesn’t indent blockquotes, as you can see in the demo here.
To add an indent to blockquotes, add this code:
blockquote {
margin-left: 40px;
}
(also curious how that extra “p” affected it)
I used a browser inspector to see that the original style was being applied on the blockquote p element, not just the blockquote.
You may want to have a read of some of the above resources to get a better handle on CSS specificity and inheritance.
p.s. Be sure to erase the previous style, since you replaced it with a new one and now have some duplicate styles.
Old:
.entry-content, .entry-summary, blockquote {
font-size: 16px;
}
New:
.entry-content, .entry-summary, blockquote p {
font-size: 16px;
}
Perfect — many many thanks!
(Resolved)
