Exfordby Automattic

Make your online presence as striking and stylish as your business with Exford. Its classic typography and clean design lend a sophisticated air to your website’s content.

It’s our business to help you succeed online

We know starting from scratch can be daunting, so we included clear, step-by-step instructions and video tutorials to help you build an attractive website. If you’d like to skip right to a specific section, click on the relevant link:

Building Your Site Setting up Your Homepage Adding Content Adding Your Logo
Adding a Menu Connecting Social Media

Building Your Website

You’ll be using the Customizer to configure your site’s look and feel. To access the Customizer, click on My Site in the top-left corner of the screen, look for the Personalize section in the sidebar, and click on Customize. (Going forward we’ll use the Customize → X format to point to a specific section within the Customizer.) Learn more about the Customizer here.

When you’re ready to exit the Customizer, click the X in the top-left corner. Whenever you make changes you’d like to keep, click on the blue Publish button, just to the right of the X button. Don’t worry, we’ll remind you to save your progress as you go. Let’s get started!

Setting up your Homepage

The demo site uses a static homepage. Follow these steps to achieve the same look:

  1. Publish two pages and give them titles that are easy to remember, like “Home” and “News.” To publish a page, navigate to My Site → Pages → Add Page.
  2. Next, go to Customize → Homepage Settings.
  3. Select “A static page” and choose the two pages you published in Step #1  — “Home” and “News” — as your Homepage and Posts page, respectively.
  4. You can give your site a more streamlined look by hiding the static homepage title. To do this, scroll down to the bottom, and check Hide Homepage Title.
  5. Click the Publish button on top to save your changes.

Adding content to your Homepage

Exford fully supports the new WordPress Editor. You can choose any of the available blocks to create a wide range of content for your site. Here’s how we built the homepage on the demo site, block by block:

Adding Your Logo

If your business has a logo, you can display it in your site’s header. Here’s how:

  1. Open My Site → Customize and click on the Site Identity section.
  2. Click the Add logo button to open the Media Manager.
  3. Upload a new image, or select one that’s already in your Media Library.
  4. Click Set as logo and you’ll see your logo appear in the preview.
  5. If your logo includes your site’s name or you prefer the header only to display your logo, you can hide the site title by unchecking the box next to Display Site Title.
  6. Click the Publish button on top to save your changes.

Your logo will appear to the left of the site title on desktop computers, and above the Site Title on mobile devices. The maximum height of the logo image is 60px, while the width can be adjusted as needed.

Adding Site Navigation

It’s time to create a navigation menu to help your visitors find the information they’re looking for. The first step is to create a menu, following these instructions. Once you’ve created the menu, you can pick where you want it to go.

  1. Head to Customize → Menu.
  2. Select the Menu Locations panel.
  3. Assign the menu you’ve just created to the Primary Location.
  4. Click the Publish button on top to save your changes.

Connecting Social Media

With Exford, you have the option to display links to your social media accounts in the header, right below the main site navigation. To do that, you’ll first need to set up a Social Links Menu. Once you’ve done that:

  1. Head to Customize → Menu.
  2. Select the Menu Locations panel.
  3. Assign the menu you’ve created to the Social Menu Location.
  4. Click the Publish button on top to save your changes.

Linking to each of your social media profiles in your social menu will automatically display its corresponding icon. See which social media icons are supported.

Downloading the Theme

You can download Exford to use on your self-hosted site using the link below. It is a child theme of Varia, so you will also need to download a copy of the WordPress.com version of that theme, available here.

Download Varia

Quick Specs (all measurements in pixels):

  1. The main column width is 750px.
  2. There is one widget area in the footer with a column width of 750px.
  3. The recommended Featured Image size is 2000px wide by 1200px high.

This theme is available for download to be used on your WordPress self-hosted installation.

Download
Next theme