After you activate Christopher, head over to Appearance → Customize to start customizing.
In the Customizer, you’ll find the main options: Custom Header and Custom Menus. You can see changes right away in the live preview, so it’s easy and fun to play with your settings. They won’t be applied until you save them, so feel free to try different options.
Creating a Static Front Page
When you first activate Christopher, your homepage will display posts in a traditional blog format. To set up a static front page, you must first create a new page. You can give this page any title. Select “Front Page” in the Page Attributes section and click Publish.
Once you have created your new page, navigate to Settings → Reading to configure the Front Page Displays setting. Select the Static Page option and choose the page you have just created as your Front Page.
The Front Page consists of four sections: Breaking News, Featured Content Slider, Big Quote, and Recent Posts by Category. All sections are configured by adding widgets to Front Page and Breaking News Header Bar widget areas via Customize → Widgets.
Breaking News Section
You’ll find a widget area under Appearance → Widgets or in the Customizer under Appearance → Customize → Widgets named Breaking News Header Bar. In this widget area, you can place the Christopher: Breaking News by Category widget. Here you can choose the number and the category of posts that you desire to highlight in this Breaking News Header Bar:
Featured Content Slider
To show the Featured Post slider at the top of your front page, choose a specific tag and assign it to up to 10 posts that you want to display in your slider. Add the tag you selected under Appearance → Customize → Featured Content.
The Featured Images for posts in the slider must be 1140px wide by 450px high. Since the Featured Images are quite big, make sure your images are a reasonable file size. You can reduce your image size by compressing and saving them at a lower quality.
Big Quote Section
You’ll find all widget areas under Appearance → Widgets or in the Customizer under Appearance → Customize → Widgets. Christopher offers the Front Page widget area to help you build a customized homepage layout.
You can place the Christopher: Big Quote widget in the Front Page widget area. Here, you can include your favorite quote or slogan, as well as the quote author, if you’d like:
Recent Posts by Category Section
In the Front Page widget area for the Front Page, you can place the custom Christopher: Recent Posts by Category widget to build your own front page.
Recent Posts widgets are especially designed for the front page, so you can choose the number of columns, the category, and the number of posts (and give a title and description for each section, which is optional). Add as many widgets and sections you need. For example, here’s a single-column section:
Or a two-column section:
Additionally, Christopher can show the page content when the front page template is being used. To do this, navigate to Appearance → Customize → Theme Options and check the “Show page content when using the front page template” option. The full page content will appear under all sections in the front page template.
Under Appearance → Menus, you can create Custom Menus for the Main Navigation Menu and a Social Links footer menu.
You can create your custom Main Header Menu by adding custom links, pages, categories, tags, or posts. Select your new menu as the “Primary Menu” in the Menu settings, and save your changes by clicking Save Menu.
To show a Social Links menu with icons at the bottom of the Christopher theme, you can create a Social Links menu. Just add your social profile links to your new menu using the custom “Links” option.
You can include URLs with your own titles (Navigation Labels) for the following social sites:
Facebook, Twitter, Dribbble, Google +, Flickr, Pinterest, Tumblr, Foursquare, GitHub, Instagram, LinkedIn, Vimeo, YouTube, Bitbucket, CodePen, Digg, Dropbox, Email (mailto: links), Reddit, Feed, Spotify, Soundcloud, StumbleUpon, Twitch, WordPress, Xing and Skype.
You can configure additional settings in Appearance → Customize → Theme Options.
Header Image position
You can also choose between two widths for the Custom Header: full width, which will span the whole width of the browser window, or boxed width, which will match the width the content area.
Date formatting on single posts
By default, Christopher shows day and the month when the post was published inside a box on single post views. This format could be changed activating the option “Use date formatting on single posts” and defining which format should be used in Settings → General.
Christopher offers a total of six widget areas:
- Front Page, which appears only on the Front Page Template.
- Breaking News Header bar, which appears on all pages, above the header.
- Right Widget Area, which appears on the right in blog view and on pages.
- Three optional footer widget areas:
Contact Us Widget
To include contact information in the footer widget area, use the Text Widget and wrap the content with the following CSS classes to have small icons displayed:
<p>Come Have Coffee with Us.<br /> Sed ut perspiciatis unde omnis laudantium</p> <p><i class="fa fa-rocket"></i> From Europe<br /> <i class="fa fa-phone"></i> +35 978 978154<br /> <i class="fa fa-comments"></i> firstname.lastname@example.org</p>