Author nathaniell
2010
4
Premium
Ambassador
Rank 4
Unfollow

Don't freak out, but there's a bit of code the sort through for this tutorial.

Sometimes you get a really great theme, but the font is teeny-tiny, making it hard for visitors to read, and it may even affect CTR or sales. The solution of course is to get a bigger font size, but not all themes allow you to go in an easily change it.

You can definitely change the font size in the Wordpress code, but you need to be brave if you've never done it before.

Luckily, this is one thing that's relatively easy to do if you are patient, and take precautions to prevent total disaster ie breaking your site. Watch this tutorial video, and decide if this is something you want to try.

This is how I first got started customizing my WP themes, and it could be the same for you. Once you figure out where certain bits and pieces are, you can change things to your liking without worrying about being a code-master.

Check it out and tell me what you think.
Join the Discussion
Write something…
Recent messages
MozMary Premium
ok found it in Marion's training except now that the text is a decent size the links look teeny weeny in the menus!

was playing with the Hiero theme, hard to see anything in there and font size often given as 1.2em not px

also wonder if those changes stay after the next wp update?
Reply
MozMary Premium
couldn't find where the text pixel size was in the Hiero theme...?
Reply
eosegueraf Premium
You are right Nathaniel:
Code is like learning to write in a different way, that is all. You only need to be careful about where exactly to edit what has already been written.
Greetings from México.
Reply
SergioRmm Premium
Just Great!! Thanks so much
Reply
VeronicasLuv Premium
Hey Nathaniel,

I've been in desperate need of changing the font to my site...it's too darn small. I'm okay with having to add codes as long as I have step-by-step instructions.

Your video is perfect, but being that I'm using a different theme (Easterstop Lite) I'm having a challenge in finding the right location. Ther is a section "Blog Page Layout Styles" so that seems to be the right location, but whenever I make a change in the font-size, update and refresh, the font is exactly the same.

Any help will be appreciated.

Veronica
Reply
Kksb0711 Premium
Hello,

There is only one post on my site that has a very small font. I tried changing it like you showed, but it did nothing.

How can I change it on just that post? I tried doing the same thing you showed with the text version, but there is not font-size in the text...
Reply
DeeHesa Premium
Hi Nathaniell, I have been struggling the last few hours trying to change the title of my website. I have tried everything including watching your video "change font size in word press". I went into code and altered the pixel size of the site title but that made no difference. My theme is Omega, please advise
Reply
DeeHesa Premium
What a great video. Thank you for making it and taking the time to explain
Reply
ObiSeanKenob Premium
Thanks so much. This video was incredibly helpful. A lot of the site feedback I have been receiving was complaints about my font size or the default color of my font size... This is exactly what I needed. Thank you.
Reply
minitrio Premium
Thank you Nathaniell :)
I am unable to find this information in my WP, could be outdated information.
Reply
Simowatto Premium
there is NO PX SIZE AFTER ENTRY CONTENT IT MOVES TO BORDERS AND META HEEEEEEEEELLLLLLLPPPPPPP :( oop no caps lol
Reply
FFinch Premium
In my Hiero theme css file, my entry content looks like this:

.entry-content margin: 0 0 20px; "This stands alone all by itself"

The fonts are super small. I changed it to 40px updated the file and no changes took place. Fonts are still tiny.

I like the theme but I'm not liking that I can't change the font size.

Any suggestions from someone using the "Hiero theme" would be great.

Thanks, Forrest
Reply
CindyT1008 Premium
Very helpful! Thank you....following you.
Reply
JeffBoivin Premium
Thanks for this training, very usefull ! Cheers, Jeff
Reply
msnix Premium
Hi Nathan.. I followed your video and there is no font size code for my theme. Sad :(
Reply
Very interesting.I would probably need to watch this more than once though.
With all the training,do we get told how to creat and build our website.Also what version of wordpress do I need to download.
Thanks
John
Reply
shermand2268 Premium
I can't seem to find in the editor page where I can change the font for the menu drop-down items. ??
Reply
JasonGB Premium
WordPress dashboard, customise. Then editor is at the bottom of the customise options.
Reply
3chas80 Premium
Hi Nathan,
I am running the WordPress Expound theme and it doesn't like me in the editor typing font-size. Apparently I am doing it wrong, or Expound won't allow it? I have been using wp edit, but changing the theme font would be much nicer! Could it be because it is considered a responsive theme? I have no clue?
Chas
Reply
nathaniell Premium
It won't be because it's responsive...every theme is different, so the code just may be organized in a different way. Sometimes, it's just easier to change themes rather than trying to edit too much of the code on a free theme.
Reply
3chas80 Premium
I see! Is their any way that I can edit the font in the home page display by using wp edit? Otherwise, I like expound, but the only type I can't change is the home page display. Thanks Nathan your help is greatly appreciated!
Chas
Reply
ZeeA Premium
Hi Nathan,

Can I change the font for only a specific part of the content?
Reply
nathaniell Premium
You should use a plugin like WP-Edit for those types of font changes.
Reply
ZeeA Premium
I did a little search and found one that works well. Thanks for the feedback!
Reply
idobarnoam Premium
Hi Nathaniell,

This solved my problem perfectly.
Thanks!
Reply
TechniSmart Premium
Hi Nathaniell,

I have Sydney Theme by AThemes and want to make the top menu font larger as the Site Feedback people suggested it. I cant see which font-size changes the text size and menu font-size. It's different yet again to the 2 themes examples you used. Any ideas?

http://www.TechniSmart.com - any other comments welcome.

Michael

Thank you in advance for caring enough to LIKE :)
Reply
nathaniell Premium
I don't think the menu font is controlled by any CSS code, so you would have to change each individual menu item using HTML in the menu spot (use custom link in your custom menu area)
Reply
Ayden Tyrol Premium
Hi Nathaniel!
I found this page while doing a google search on "change iconic theme list font size."

I was surprised to see a WA site in the #2 slot for this keyword. But that is not really what I'm looking for.

Maybe you can help me.

I need to change the font size for items listed with bullet points. I have everything else sorted out.

I tried the method in the video, but to no avail.
Reply
nathaniell Premium
Sorry for late response bro. Bullet points are coded with either "ul" or "ol", and you can also check for "ul li" and see if there's any font code below it you can play with.
Reply
lindasea Premium
Hey there, Nathaniell!

I'm pecking around for a means to change the color of my font in a black footer on my site's front/home page and found this helpful tutorial from you.

I'm going to go and check out my site for this now and see how it could punch things up a bit more for me. Then I'll go back to see how to change the color with another tutorial that likely exists somewhere in our material.

Thanks for all you do!

Linda
Reply
nathaniell Premium
Hm, for changing font color in the footer, you may have to locate the footer code in your stylesheet! Do ctrl+f "footer" and see if that turns anything up.
Reply
lindasea Premium
Thanks. Will give a try tomorrow.
Reply
LookingUp Premium
Thanks for another great tutorial, Nathaniell. Unfortunately it's not working for me. I suspect it may be some invisible coding issue. Does anyone have any advice or should I consider switching themes?
Reply
nathaniell Premium
Sometimes there are parts of the font code that overwrite other parts. Unfortunately, I'm not that good of a coder to be able to figure it out all the time!

But from the looks of it, it looks like you are changing the right stuff.
Reply
LookingUp Premium
Thanks for your reply. Appreciated. :) I really didn't want to switch themes, but maybe I will.
janet
Reply
siamjerry Premium
Hi Nathan, thanks for the advice. I was able to enlarge my font in Iconic-one some time ago after some trying. Thing is, now it went back to its old settings seemingly just like that and the same method did not work. I can remember that in between I had to update the theme. Can this be a factor? Are there other ways to resolve this? You can take a quick look at my site and see that the font is a bit small: http://chardonnayfans.com. Cheers, Jerry
Reply
siamjerry Premium
Nathan, Can you advise me on this? Thanks, Jerry
Reply
nathaniell Premium
Yes. Updating the theme will erase your code. You need to create (or have created) a "child theme" so that your theme updates do not erase your code. You can probably hire someone on Fiverr.com to do it for $5!
Reply
siamjerry Premium
Thanks Nathan!
Reply
JeanL Premium
Nathan, I have been trying to change my h1 font, I change it to a smaller px and it does nothing. Any advice?
Reply
nathaniell Premium
There may be other code overwriting it. Search for other instances of h1 and see if you find an appropriate one you might want to change. Sometimes, it's just kind of maze!
Reply
JoCam Premium
I'm confused. I looked at the coding on my style.css and tried to change the font this way but I couldn't find any where font size under entry-content. Could this be because of my theme?
Reply
SabrinaF Premium
Very likely. No two themes are created equal!!
Reply
sharoncl Premium
really want to say thank you, been trying to find some way of changing my font size without having to install a plugin. Works perfectly, thank you
Reply
geowanda Premium
Always enjoy your videos Nathaniell.
One quick question, would it be better to update the font of a child theme? What happens if WP has an update for my theme after I've made font coding changes? Any chances of boo boos and I have to go back and add changes to parent theme?
Thanks again
Lynn
Reply
nathaniell Premium
Doing it on a child theme is always better, but to be honest, I don't know how to make a child theme, and I think that would confuse most people. Theme updates may erase your changes if you change stuff on the parent theme.
Reply
geowanda Premium
Got it. Thanks!
Reply
KKlyver Premium
Thanks Nathaniell! I don't have a togglebar. I think a plugin messed it up. Your info would help a lot! As I have tried evrything to no avail. Somehow I may be able to copy and paste an "adminphp" file from a fresh install of wordpress. Yeah, this might be dangerous for me. Your solution might get me by in a pinch. Thanks again!
Reply
TaraWrites Premium
Great training...but I need a hand.

So I got all confident and found this (see below), and then tried changing 87.5% to 90% and nothing happened. I changed it back. Any suggestions?

Thanks! Tara

body {
font-size: 87.5%;
line-height: 1.5;
font-family: PT Serif, Georgia, serif;
color: #797979;
-webkit-font-smoothing: antialiased; /* Fix for webkit rendering */
-webkit-text-size-adjust: 100%;
-ms-word-wrap: break-word;
word-wrap: break-word;
Reply
Gregory57 Premium
hello Tara. What you see is called. Cascade Style Sheets. I guess you want to change your fontsize. You editted your WP theme editor. In this case your fontsize is coded in %. It has alot to do with your font-family (PT Serif). Most of the times the font-size is coded as px(pixel). There are 2 things you can do. Try and change the % into pxs. OR use this link: it is plugin and perhaps less "dangerous" https://wordpress.org/plugins/styles/
Reply
TaraWrites Premium
Thanks! I'll try this option. Appreciate your help.
Reply
Gregory57 Premium
Let me know if you succeed. U r welcome
Reply
nathaniell Premium
Yeah, this is where my skillset breaks down. If you changed it to 90 and nothing happened, try something crazy like 200%. The change from 87.5 to 90 may have been imperceptible.

That is the number I would change, but there may be another bit of code that's over-riding it!

Another thing you can try is to make sure you refresh your browser after changing. Delete your cookies too. Sometimes the browser will save old versions of the site, meaning you made changes, but it's not showing them yet.
Reply
TaraWrites Premium
Hi again, I decided to go the "purist" route and successfully manipulated the code as Nathaniell instructed below. It worked. And nothing broke!
Reply
TaraWrites Premium
Don't speak so soon. Your skills prevailed. 93.5% did the trick. Thanks!
Reply
nathaniell Premium
Haha. Glad it worked.
Reply
TaraWrites Premium
Me!
Too!
Reply
doug52 Premium
Wonderful video!
Reply
rufat Premium
great tutorial
Reply
meandmypup Premium
Hi Nathaniell! My problem is: I have the Twenty Twelve theme. I really like it but I would like to change the head/title font. I have gone into the Editor and tried literally everything. Can you please help?
Reply
IMc Premium
A very nice plugin to try which will make your life a whole lot easier is https://wordpress.org/plugins/styles/

I use it on one on a couple of my sites which use the Twenty Fourteen theme. it enables you to do a lot of customisations, including all font types and sizes very easily. Give it a try. No need for any editing of files or technical knowledge.
Reply
meandmypup Premium
Thank you so much! You are a life saver!
Reply
GwynnGriffin Premium
Thanks, Nathaniell! As always, very well done and easy to understand. Such a great teacher you are =] Gg
Reply
LondonLeigh Premium
Thank you Nathaniell. If I find a theme I like, but discover that the font size is too small, is it possible to use this method before I start writing much content, say just after I had written a few words?
Brandon
Reply
rwood Premium
If you do this it will change anything you have already written and all new.
Reply
LondonLeigh Premium
Many thanks for the info. I suspect it will be better to consider altering the font after just typing the first few words of content, so for my next site I will give it a try.
All the best,
Brandon
Reply
olivingstone Premium
Thanks a mill, I really want to change my font size. Still can't find it in the coding for my theme but I'll get there. Thanks again. Olive
Reply
one4 IM Premium
Thanks Nathaniell, I totally get it. Will probably rethink my theme choice though, before becoming a "code master" lol
Reply
VickiB58 Premium
WOOHOO!! Nathaniell!! I did it!
I only messed up the "header" thing which isn't bold now, but hey, the text is legible - nice and big!! THANK YOU!!
Reply
nathaniell Premium
Excellent!
Reply
Jim-WMP Premium
Hi Nat, my theme is Catch Box and I just can't make it work. Tried WP Edit had to adjust all the time. I changed the entry content, default is 10, but it's not working.
.entry-content th,
.comment-content th {
color: #666;
font-size: 10px;
font-weight: 500;
Do you think you could help? Thanks in advance.
Reply
nathaniell Premium
Sometimes there are font things going on in the functions.php file but be SUPER CAREFUL there because one wrong tweak and you can bust your whole site. In fact, I would say that if your font is bugging you that much, you might want to change your theme.
Reply
Jim-WMP Premium
Success....still had to re-size all the posts make some minor changes but on the plus side I'm an expert on this now lol.
Love my new HUGE FONTS! Thanks for your time.
I guess the best to Fetch all urls again ?
Reply
nathaniell Premium
I don't think you'll need to do that if all you did was change the font size. It won't affect how your site is indexed in Google.
Reply
Jim-WMP Premium
Thanks indeed already showing up in Bing and on
Google Page Speed Insights which is really neat is it new or just me?
BTW my site looks AWESOME! Only if I had more content on it.
Reply
KristieK Premium
Watching this now...was curious about this! Thank you!
Reply
JoAnnBass Premium
Thank you so much for this. This was exactly what I was looking for tonight. :)
Reply
tmaltz Premium
thanks for the great tutorial
Reply
Dance2heal Premium
What if I did the control-f and searched font-size and in my theme no such thing exists? I like the theme, I just want bigger font.

I also looked into changing the theme and found another one I want, but it seems to come set with pictures and I want to choose my site pictures. Help?
Reply
MmmmBalf Premium
You will be able to change the set pictures in the Theme settings.
Reply
Expression01 Premium
less scary lol
Reply
Expression01 Premium
Success!!!! I finally got it done!
Reply
nathaniell Premium
Awesome. Glad to hear it worked for you. Code isn't that scary after all, huh?
Reply
Expression01 Premium
Thanks Nathaniell
Reply
drew0688 Premium
Thanks nathaniell
Reply
goldennuel Premium
thanks for this video infact i had to even change my theme to Quintus
Reply
nathaniell Premium
Good theme, huh :)
Reply
Fezd Premium
I see that this is made some months ago, but I guess I'll just ask here. Do you know how to change font type also?
I found a good theme, but the font types kind of make my heading 5 and heading 3's hard to read.

Thanks for great info Nathaniell!
Reply
nathaniell Premium
The font type code will be in the same area as shown in this video. I haven't had as much success with font changing as I have with font size. There are some fonts which don't work in some browsers, and every theme has a different font assigning system so it can be a bit complicated. Usually what happened to me is that I would change the code but the theme didn't actually change font!

Still, if you want to change the font, look in the code as show in the video and you'll see it near the top of the page around the area I have shown you here. Hope this helps.
Reply
Fezd Premium
Thanks Nathaniell, I could not figure it out. And when I looked for the font size, it did not show in px, it was something i've never seen. 1.3em. I tried to figure it out on the internet, but everyone kinda said something different about "em" and I am no CSS specialist :D

Do you know how many pixels 1.3em are? and if so, how many px should my website have? 14 or 16?
Reply
nathaniell Premium
em is a way to measure font size. It's actually "better" than pixels due to some browser resizing issues. I would just increase it until you are satisfied with the size. If you do small increases you might not notice the change, so play around with it just to check. I think 2.0 might be good, but that's just a guess.

But honest, if you are having trouble with both font size and style, I would choose a different thing. Code can be confusing, and a theme update could erase your changes. I would try to find a theme that you like right out of the box.
Reply
Fezd Premium
Okey, I will try to find a different theme. However, will my posts etc get deleted or something if I just change themes?

Will my rankings in the serps get penalized if I do a major change like this?
Reply
nathaniell Premium
Nah, the theme won't affect anything. If you are using a paid theme and use any special features, sometimes those features don't copy over well, but on a free theme you won't have any issues.

You might see some menus get messed up or some widgets disappear, but just put them back in place and you'll be fine. There's always something wonky that happens when changing themes, but it won't affect your rank or anything in the SERPs
Reply
Fezd Premium
Okey thanks again!
Reply
rickyjay Premium
This had been driving me mad - But yet again yourself and WA had the answer - great service :) Thank you Nathaniell
Reply
Animate Premium
Thank you Nathaniel - great! Very clear instructions. I must have been lucky, I found the font size for my site pretty well straight away (under heading 'GLOBAL' - Theme: Engrave (Lite))
Reply
MattMartin Premium
Anyone know where the font stuff is for customizr theme?
Reply
Thanks, Nathaniell! Just what I was looking for. My first try with the Simplo theme font-size did not work but at least I now know which "drawing board" to go back to! Went from 13px to 16px, saw "no" change. Tried changing it to 36px just to see if I was in the right spot. No change. Obviously this is not the correct place spot. Any suggestions?

body{
font-weight:normal;
font-family:Arial, Helvetica, sans-serif;
font-size:16px;
color:#333;
line-height:135%;
}

Thanks,
Sherry M
Reply
nathaniell Premium
It might be that there are other parts of the code that overwrite this code here. This was a very good guess event though it was wrong. Do a search (press ctrl+f) for "font-size", and see if you can find another good guess.

Actually, this looks like part of the general styles declarations, which means it's likely that a little lower down, you will probably find more stuff to try. You can also search for "13px" and see what you find. Let me know if you find it.
Reply
nathaniell Premium
I just tested the theme. I see that this IS the code you need to change. Try to refresh the page or revisit your site after 20 or 30 minutes. See if the code changed. Sometimes, I don't know why, your browser will not detect the changes right away.

People have told me you need to 'delete your browser's cache', which I tried, and it did not help. You are welcome to try that and see if you get the changes to register faster.

But anyway, I installed the theme and was able to change the font size doing as you have done here, so this is the correct way.
Reply
I will make the change and leave it for a while. Each time it did not work I went back in and undid my changes so I had not given it much time to "update". Thanks Again!
Reply
Nathaniell... I made the font-size change and went out to the browser, IE 10, and hit F5 to refresh it. Worked immediately. I think I ran into this "refresh" issue about a year ago and totally forgot about it. Now I can move on to the next challenge. :-) Sherry M
Reply
Shields Premium
I wish everyone knew this, or Wordpress simply took care of it in advance. So very much thank you for the lesson.
Reply
nathaniell Premium
I'm surprised font size is so hard to change because many people want to change it. I would think it would be a default option for many themes, but I find that it's really rare that a theme will actually allow you to change the font size without going into the code.
Reply
amfc Premium
Thanks, Nathaniel. I have been looking for a way to change the font size. Yahoo!
Reply
nathaniell Premium
Were you able to do it successfully?
Reply
solda50 Premium
Another great tip. Thanks Nathaniell
Reply
Hudson Premium
Thanks Nat, greatly appreciated. I had been looking to see if I could change the colour of some text as well as the size, for the reason I wanted to get my home page on one page just shy of the fold so that it was easy to read. I happened upon the plug in Font. This allows both size and colour to be changed. I experimented with it on a test site I have and it seems to work okay. Have you looked at this? If it is okay it might be easier for newbies like myself who might not be too happy at digging into code as this could be high risk, although I really appreciate your risk minimisation technique - well done.
Regards
Hudson
Reply
nathaniell Premium
I have not looked into it, but I'm sure there are a few plugins to help you change the font. It can be a good solution for someone that doesn't want to mess with the code, but there are a few downsides. Using many plugins can increase load time of your site, and outdated or unsecure plugins could provide doorways for malicious individuals. It is usually recommended to have as few of plugins as possible.

However, you are right that code is a big step for many people. What I hope is that with this video people can begin to see that if you know what you are looking for, code isn't that scary. I know very little, but I started out exactly for this reason: my font was too small and I wanted to change this size!
Reply
normanh2 Premium
Thank you - very much appreciated

Cheers
Reply
caylynn Premium
Hooray!! Things are coming together...font size tutorial excellent. Many, many thanks.
Reply
nathaniell Premium
Glad you found it useful :)
Reply
Shawn Martin Premium
Thanks for the tutorial!
Reply
nathaniell Premium
My pleasure!
Reply
Top