Chanel - Homepage Setup

Overview of Chanel homepage widgets

Prefer your blog posts to display on the homepage instead of the homepage widgets? Click here.

STEP 1: CONFIGURE PAGES

If you imported the demo content, the Home and Blog pages will have already been set up for you, so you can skip step 1.

1. In your Wordpress dashboard, go to Pages > Add New. Name the page “Home.” Scroll down and find Layout Settings. Select the Full-Width layout (the rightmost option) and then publish the page. Add another new page and name it “Blog” and publish the page.
2. Go to Wordpress > Settings > Reading. Under Front Page Displays, choose “a static page.”

3. For the Posts Page, choose the “Blog” page you created. For the Front Page, choose the “Home” page you created.  Save changes.

STEP 2: IMAGE SLIDER

The Chanel slider uses images sized 1050 x 400px. For best results, we recommend that you crop your slider images to this size before uploading them (you can do this in Photoshop or a free program like Pixlr).

1. Install and activate the Meta Slider plugin. Once installed, click the Meta Slider tab in the left column of your dashboard.
2. Click the “+” to create a new slider.
3. Upload your images.
4. Configure your settings as seen here:

5. Once your slider is created and saved, go to Wordpress > Appearance > Widgets.
6. Drag the Meta Slider widget into the  Home - Slider widget area. Save. Your slider is now installed!

STEP 3: SUBSCRIPTION WIDGET

The "Get on the List" subscription widget in the Chanel theme uses  Genesis eNews Extended. To learn how to configure this plugin, click here.

Go to Appearance > Widgets. Drag the Genesis eNews Extended widget into the Home - Slider widget area. Configure the widget how you would like, and then save. 

STEP 4: PAGE BUTTONS

These buttons are set up in the Home - Middle widget areas. Each button should be placed in its own widget area.

1. To set up your first button, drag a Custom HTML widget into the Home - Middle Left widget area. Paste the following code in the text box:

<div> <a href="URL to a page"> Button Text </a><div><br>

2. Add your URL to replace "URL to a page." Be sure it’s a full link with the http://, i.e. http://yourwebsite.com/about. Replace "Button Text" with what you want the button to say. Here is an example of how a “Blog” page button would look:

<div> <a href="http://mywebsite.com/blog"> Blog </a><div><br>

3. Repeat steps 1-3 for the other two buttons. The second button should be placed in the Home - Middle Center widget area, and the third button in the Home - Middle Right widget area.

HOMEPAGE STEP 4: RECENT POSTS

  1. Go to Appearance > Widgets and drag the Genesis - Featured Posts widget into the Home - Bottom widget area.
  2. Configure the widget settings as seen below, and then save.