How to Change the Title Font on Tumblr

by Allen Bethea
Test your font changes on PCs as well as mobile devices such as smartphones and tablets.

Test your font changes on PCs as well as mobile devices such as smartphones and tablets.

The folks at Tumblr are so serious about their users expressing themselves, they sacrificed the letter "e" from their app's name. They encourage their users to be as edgy, exceptional and extraordinary as possible, giving them access to the raw code that determines how their blog will look. For example, if you want to change the font used for your blog's title, you can access and edit your theme's CSS or Cascading Style Sheet code and add the fonts you would prefer to see.

1

Log in to your Tumblr blog.

2

Click or tap the "Settings" button, click "Dashboard" and then select the link for the blog you want to edit.

3

Select the "Customize" button in the Theme section.

4

Choose the "Edit HTML" button.

5

Scroll down through the HTML code until you locate the CSS code for the header section. The line should begin with: "#header {" and may contain height and margin instructions for any text found within the header section of your blog.

6

Place your cursor in front of the closing curly brace "}" and press "Enter." This adds a blank line for adding your new font CSS code.

7

Add the CSS code to change your title font in the blank line you created. For example, if you wanted the title to use the font "Verdana", type "font-family: Verdana;" in the blank line. If there is font or font-family code already included in this section by your theme, the code you add will override it -- as long as it is the last line before the "}" character.

8

Click the "Preview" button to make sure the title looks the way you intend it to.

9

Click the "Save" button when you are done with your font change.

Tip

  • check Add at least two similar fonts to your font-family selector just in case a visitor's PC or mobile device does not support the font you chose. Users on some Linux-based systems may not have fonts created by Microsoft, such as Verdana, Georgia, Trebuchet or Consolas. For example, if you use the code "font-family: Georgia, Helvetica, sans-serif;", the user's browser will first try Georgia, then Helvetica and finally, the default sans serif font.

Warning

  • close Fonts differ in the height and width of their characters as well as the spacing between them. Preview your changes to see if you need to increase or decrease your title font's size so that it looks good within the space allotted by your Tumblr theme.

About the Author

Allen Bethea has written articles on programming, web design,operating systems and computer hardware since 2002. He holds a Bachelor of Science from UNC-Chapel Hill and AAS degrees in office technology, mechanical engineering/drafting and internet technology. Allen has extensive experience with desktop and system software for both Windows and Linux operating systems.

Photo Credits

  • photo_camera Digital Vision/Photodisc/Getty Images