Create A Front Page Template For Genesis – Beginners Guide

You can create a new page and select it to display as your front page using the Reading settings in WordPress.

More Flexible Solution

Another option is to create a new file and add custom code directly to that file which only effects your front page.

Simply create a new file named front-page.php using Notepad++ and add this code to the file:

Then upload the new file to your child themes root directory.

Here’s an example of a default front page template without any added code snippets to modify the file.

Now you can add code snippets to your new file which only effect your front page template.

Adding Code To The File

The easiest way to add code to your new front page template is to go to the StudioPress > Resources > Code Snippets section and copy and paste code into your new template file.

Here’s a list of all the current code snippets StudioPress give you which work on any Genesis child theme like StudioPress.

Real Example

Lets copy some code from the StudioPress Code Snippets page and create a custom front-page.php template.

Code Snippets

1. Go to the Admin Management section on the StudioPress Code Snippets page
2. Click the Force The Genesis Layout Settings link
3. In the first code block, click the View Raw link located in the bottom right hand corner of the Gist.
4. Copy the very last line of code to Force full-width-content layout setting
5. Paste the line of code before the closing genesis(); tag in your new template.

Here’s what the code looks like now in your new front page template.

The code removes the sidebar and forces a full width layout which only applies to your front page template.

Lets now add some more code to your front-page.php file and make some more modifications.

We’ll remove the Filed Under: bottom featured link.

Back on the StudioPress Code Snippets page:

1. Scroll down to the ENTRY FOOTER (HTML5) section
2. Click the Remove Entry Meta link
3. Scroll down to the very last code snippet and click the view raw link in the Gist.
4. Copy the line of code and paste it before the closing genesis(); tag in your front-page.php file
5. Save the changes to your file.

Lets take a look at what your front-page.php file should look like now.

And here’s the result on the front end of your front page template showing how the Filed Under: bottom featured link has been removed.

I hope that gives you a very basic understanding of how to create a front page template and customize your front page using code snippets from the StudioPress > Resources > Code Snippets page.

You’ll also find more than 1200++ code snippets on wpsites.net.

Related Template Code

• Create Custom Page Template For Genesis
• WooCommerce Front Page Template For Genesis