Back to Community
Home / Community / Theme → Twenty fourteen

How to Customize Titles and Fonts in the Twenty Fourteen Theme

22 threads Sep 16, 2025 Theme → Twenty fourteen

Content

Customizing the appearance of your site is a common need, and one of the most frequent requests for the Twenty Fourteen theme involves changing titles and fonts. Whether you're looking to adjust the font size, change the font family, modify the title's background color, or address SEO concerns with heading tags, this guide covers the most effective methods.

Why These Customizations Are Necessary

The Twenty Fourteen theme has a specific design and structure. Its styles are defined in its main style.css file, and its page titles are often generated from template files like content.php. The theme does not include built-in options in the WordPress Customizer for every typographical change, which is why manual customization through code is typically required. It's also important to note that some page templates, like the full-width template, have unique CSS classes that must be targeted specifically.

The Golden Rule: Use a Child Theme or Custom CSS Plugin

Important: You should never edit the core Twenty Fourteen theme files directly. As the default WordPress theme, having an unmodified original is crucial for troubleshooting and future updates. Always make changes in a child theme or by using a Custom CSS plugin.

Common Customizations and Their Solutions

1. Changing Font Family, Size, and Weight

To change the font for post titles site-wide, use the following CSS. The .entry-title class controls most post and page titles.

.entry-title {
    font-family: "Times New Roman", serif !important;
    font-size: 33px !important;
    font-weight: 700 !important;
}

2. Changing the Page Title Background Color

If you need to change the background color behind page titles, target the entry header.

.site-content .entry-header {
    background: #000000; /* Your color here */
}

3. Centering Titles on Specific Page Templates

Your CSS might only work on full-width pages because the selector includes .page-template. To target titles on all pages, use a more general selector.

h1.entry-title {
    text-align: center;
    color: blue;
}

4. Addressing SEO and Heading Structure (H1 vs. H2)

Some users wish to change the site title from an H1 to an H2 tag for better SEO practices. This requires modifying theme template files in a child theme. Locate the header.php file in your child theme and find the line with <h1 class="site-title">. Change the h1 tags to h2.

5. Adding a Logo in Place of the Site Title

Replacing the text-based site title with a logo is a popular request. This is best achieved by creating a child theme and adding a logo upload feature to its functions.php file or by using a dedicated plugin. CSS-based image replacement is another method but is less flexible for managing the logo.

Conclusion

Most visual changes to titles and fonts in the Twenty Fourteen theme can be accomplished with targeted CSS added to a child theme or a Custom CSS plugin. For more structural changes, like modifying HTML tags, creating a child theme is essential. Always remember to clear your cache after making changes to see the results.

Related Support Threads Support