If you decide to use the WordPress “Static Front Page” feature, this theme gives you a few choices when it comes to styling your front page. Please note this works only when setting a static front page and does not work if your blog is set as the front page.
Splash Page Template
This is a full browser window splash page that uses the WordPress Header Image functionality. You can have one photo displayed or you can add more photos and select the “Randomize” header option setting. This means that each time the page is refreshed, a different photo appears. This template also has a special Splash Menu location so that visitors can continue into your site.
Setup Your Front Page and Blog
If you decide to use one of these options, there are a few steps, but the first is to create a page and then choose the appropriate template. In this case, you will use the FrontPage Splash template.
If you are using the Classic editor for WordPress, this will show up in the right side column:
- Go to Appearance > Pages > Add New.
- Create a page and call it whatever you decide, such as “Welcome” or “Home” and then in the page attributes, choose the Front Page Splash template.
- Create a second page for your blog, so we can call this one “Blog“. You just need the title for the page, no content and no template needs to be set.
- Go to Settings > Reading
- Set the front page setting to the page you created for it.
- Set the blog posts setting to the page you made for the blog.
- Click the
Splash Page Photo
This theme comes with a default splash page image:
You can add more images and take advantage of the WordPress randomize feature so that each time the page is visited or refreshed, it should rotate through all the images you have added.
- Go to Appearance > Splash Page Image (Header)
- There is a default image installed, but you can hide it and use your own. When uploading, I recommend using the best quality photo and make sure it’s large enough. This function will crop your image to
1920×1080pixels, so make sure your photo is at least that size. This is a showcase image, so make it a good one as this is used as first impressions.
- Click the
Splash Page Button
This tutorial will show you how to add a link or button to your splash page. You will actually be making a custom menu with a couple of options to link a button. You can refer to the Create Menus tutorial to make one, but basically, you will make a new menu and call it, for example, Splash Menu.
- Navigate to Appearance > Menus.
- Create a new menu
- Name your menu Splash Menu (you can name it what you want).
- Drag a page from the Add Menu Items panel to where you want this menu to link to. You can also use the Custom Links setting if you prefer to manually add a URL to a page on your site.
- Click on the
Screen Optionstab at the top right of the window
- Check the box next to CSS Classes. This will add the CSS Classes field to your menu items.
- In the CSS Classes field, type in
splash-button(Make sure this is lowercase).
- Select the Splash Menu location under the Menu Settings section.
- Click the