Build Your Own Business Website header image

Choosing the Right Template to Begin With

Difficulty Level -

Filed Under Topics - , ,

Listed Under Lesson Subjects -

Applies to -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

Once you’ve got a good understanding of your landing page layout you have to decide what template you’re going to begin with in the Agility theme. That’s actually how this seminar came about. Gertrude asked the question “What template should I use in order to create my landing page?”

Agility Skin 3 Typical Page Layout

Once you know your layout the next thing you want to do is pick your template. We’re doing this in Agility 3 so it makes some sense to look at the typical Agility page layout. The front page is not a typical Agility page layout.

Horizontal Divisions

Your typical Agility page layout has this top bar across the top. In this case it displays the phone number and social media sharing. Then you have the main menu area which is the section with the header image and in this case it’s the name of the site and the tagline. The third main horizontal division on this is the top menu.

So you’ve got these three things at top and really we’re not going to use any of this in this template that we’re going to be creating.

Content Area

Then you come down to this content area and the content area really has two main sections. It’s got the content section here on the left and then it’s got this sidebar on the right.

Footer Area

Then it comes down to the footer area where you’ve got this top footer area that is in this case, some combination of image gallery and then widget areas. And then finally you’ve got the bottom footer area, and the bottom footer area, in this case, has a menu and copy right now.

If you work in Agility you know that the three sections of the header and the two sections of the footer can be configured into anything you want them to be. They can be reconfigured using the skin content area.

Creating a Landing Page Template

But in any case this is the typical page layout and really nothing that is in this page layout is particularly useful to us in this landing page. The landing pages have areas that are entirely different from what you see here.

Since none of these main pieces are pieces that we are using in the landing page template we are probably better off starting with a blank template. So there’s none of the existing Thesis Theme templates you’re going to start with. We’re going to start start from scratch.

This client website we are working on is going through the process of transformation. It’s by no means a finished site and creating this landing page template is part of this process.

Create the Page

We’re going to come in here to the dashboard and the very first thing we’re going to do is create a page for this landing page.

Now if we come back over and look at our example we’re going to end up using the content of the page right here. We’ve got this thing called A Secondary Headline and we’re going to make that the headline of this landing page. This content up here we’re going to do something else with. Gertrude has given me some text that she would like me to use for the page title. Now hit publish.

Back Up The Skin

And since none of these templates are templates that we want to use for this, we need to go over and create our template. Actually, the next step before creating this is to back the Skin up. So we’re going to create a new backup in the Data Manager. I’m going to call this Prior to create a landing page template.

Frankly, when building a site I make this kind of backup before I start creating any other template. I want to be able to restore back to a prior point in case I mess anything up. So I always go to the Data Manager and create a backup of the skin at the point to which I’m starting so I can always just come back and restore that point.

This Data Manager is a critical aspect whenever you are working in the Skin Editor. Using the Data Manager to back yourself up is a really good idea.

Create the Landing Page Template

Inside the Skin Editor you click on the name of the template which is the button up here in orange. You click on it to get the Template Menu. It automatically opens us up on our Home Template.

We’re going to come over here to custom templates and click add new. We’ll call this Video Landing Page and create the template. Ordinarily when you create a new template you would then go find the template that’s the closest to it and copy its contents but we’re not going to do that because none of these templates have elements in them that we want. Just click that and this is our video landing page.

0 Comments… add one
0 comments… add one

Leave a Comment