Theme Customizer Options

The Matchstick theme comes with a full featured theme customizer that allows you to take control of the look of your site and see your changes in real time before committing them to your live site. This section will cover the various settings included in the customizer. To access the customizer, go to Appearance > Customize.

SITE TITLE & TAGLINE

Site Title - The main title on the home page.

Tagline - The sub header on the home page.

Fix header image on scroll? - The default is unchecked, where the background appears to move behind the rest of the site. Check the box to have the background scroll with the site.

Logo Upload - You can optionally add a logo to your site here. Adding a logo will remove the site title and tagline from displaying.

Landing Image Upload - Add a large image that fills the screen on the homepage. Removing the image will disable the landing image section on the homepage. Recommended image size is 1200px x 800px.

Site Icon – Upload a custom site icon (or Favicon) for your site’s browser and app icon.

HOME PAGE LAYOUT

These settings apply to the home page only, here you can set a home page content layout and single column posts. You can also add a sidebar to the layout here and select navigation style.

BLOG POSTS

These settings apply to individual blog posts only, here you can set a sidebar layout.

AddThis Publisher ID - Optional. Paste your AddThis publisher id (free from addthis.com) to get analytics from the share buttons located at the bottom of blog posts.

Display author byline? - Check this box to display the author name on blog posts.

THEME COLORS

Footer Background Color - Affects the footer area background color.

Primary Background Color - Affects all light blue background areas on the website.

Secondary Background Color - Affects white background areas on the home page.

TYPOGRAPHY

This section allows you to edit the typography styles across the website theme and includes support for Google fonts.

Google Font Link Code – In order to use Google Fonts, they must be installed on the website. It’s recommended that you install all weights of a font in order to maintain consistency throughout the site. Here are the steps to find the Google Font Link Code:

  • Go to Google Fonts and browse the fonts and styles you’d like to use

  • Click + Select This Font for each style you want to use

  • Once you’ve selected your fonts, in the bottom right of the screen click on the black collapsed window

  • Go to Embed This Font – click on Standard and copy this link

  • Paste this link somewhere like a text editor for safe keeping

  • Copy only the section within the quotes starting with ‘http://…’ (e.g., http://fonts.googleapis.com/css?family=Lora:400,700)

  • Go back to the WordPress customizer and paste that code in the Google Font Link Code field

  • You can now enter the font family name into either the fields for Primary Font Family, Body Text Font Family or use it in your CSS.

Here’s a handy screenshot for an accompanying visual. For example, if you were using the fonts Old Standard TT and Rubik, here’s how you would find the link:

Primary Header Font Family - Enter the name of the font family to use for headings and input fields. Accepts system fonts (Helvetica, Arial, etc.) and Google Fonts if included in the Google Font Link Code field.

Body Text Font Family - Enter the name of the font family to use for body text. Accepts system fonts (Helvetica, Arial, etc.) and Google Fonts if included in theGoogle Font Link Code field.

Text Color - Select the color to use for text in the site.

Footer Text Color - Select the color used for text/borders in the footer widget section.

FOOTER

Footer Copyright Text - Enter in any text you would like to display in the footer copyright line. Will display your site title by default.

MENUS

Gear Icon – Open options for individual menu items, you can check the Link Target to set menu items to open in a new tab.

Menu Location – Switch menu locations between primary and secondary, you can also enable a sticky nav bar here.

Primary Menu – Add / remove menu links and rearrange and create drop-down menus here for your primary menu.

CUSTOM CSS

Add any custom CSS code here. This allows you much more granular control over the style of the theme. This data will be saved during theme updates as well (yay!).

WIDGETS

Configure your widgets here. Widgets can also be configured under Appearance > Widgets.

COMMENTS AND TRACKBACKS

Choose to enable or disable comments and trackbacks on posts or pages.

MatchstickStation Seven