Upfront’s global theme settings allow you to make site-wide changes to your theme from a single interface. With these tools, you can adjust your site’s typography, theme colors, and add/edit global CSS styles.

upfront_global_settings_overview

4.1 Global Background

Link to chapter 1

The Upfront Global Background setting allows you to create a consistent background for all the pages of your website.

upfront_global_background_settings

The three types of global background Upfront allows are solid color, image, and video. This panel, accessed by clicking “Global Theme BG” in the upfront editor panel, will allow you to choose the global background type and adjust it, as well as setting a global width for any contained-width regions you’ll be using in the theme.

4.2 Regions

Link to chapter 2

Global regions appear on each page in your site, and each Upfront starter theme includes a handful of global regions. You can edit and delete these regions by clicking the Edit Global Regions link in the Upfront editor.

edit_delete_upfront_global_regions

Global regions are handy for creating consistent headers, menu areas, footers, and sidebars.

4.3 Global CSS

Link to chapter 3

Upfront gives you several options for adjusting a theme’s CSS. Individual elements and regions can be customized with CSS while editing, but you may find you need to apply global styles. The Global CSS option in Upfront will let you do this simply and quickly.

Click the “Global CSS” link to get started.

upfront_global_css

4.4 Fonts

Link to chapter 4

Upfront has integrated with Google Fonts to make creating beautiful typography as simple as possible. You can add as many Google fonts as you’d like to your themes. Keep in mind that fonts can be resource intensive, so only include the fonts and font variations you need. We recommend no more than seven fonts to ensure your site runs smoothly. Your mileage may vary, depending on the type of server environment you’re using, and how resource-intensive your site is outside of Upfront.

upfront_font_manager

Find the font you want to add from the menu on the left, and click “Add” to include it in your current theme.

4.5 Theme Colors

Link to chapter 5

Upfront also gives you a handy tool to manage the colors used in your theme. Clicking over to the theme colors tab shows you a list of each theme color currently used.

upfront_global_theme_colors

As you can see in the screenshot above, the Upfront color codes can be used just like HEX values in your theme CSS.

Join WPMU DEV to get everything you need
for WordPress, on unlimited sites, for one low price.

Security - Performance - Themes - 100+ Plugins - Backups - Marketing & SEO - Expert WP Support

WPMU DEV Heroes
Get help and support for ANY WordPress problem for FREE

Want expert help and support for ANY WordPress issue for free?

Sign up for a free trial now and let us help you out!

No obligation and super easy to cancel.

100+ PREMIUM PLUGINS & THEMES FOR FREE?

That's right! A WPMU DEV membership gives you access to 100+ premium plugins & themes, 24/7 WordPress support, a whole bunch of cool services and a private community of awesome WordPress developers.

Try a WPMU DEV membership today, completely for free, no obligation!

No thanks

Awesome, let's get you set up for your free month


Example: John Already have a WPMU DEV account? Log In