The interior template is typically placed in the base template and serves as the interior of a "Section" of your website. The benefit in a content template is it can be re-used for sections of your website that require multiple pages, allowing you to re-use your content template to build out your web pages. In this article we will show you how to create a content template that we will re-use to create pages for difference services.
Below is a screenshot of a two-column template in Solodev:
Note: In the screenshot above the base template is still in place and there are other templates added as well such as breadcrumbs. The interior and sectional templates are added inside the base template.
The two-column template we have has a left navigation and a content area on the right. It can be used for any page that has multiple links and descriptions.
Here's the code for the two-column template:
<section class="container py-5" id="maincontent">
<div class="row">
<div class="col-md-8 col-lg-9 order-md-1">
<div class="dynamicDiv"></div>
<div class="dynamicDiv"></div>
<div class="dynamicDiv"></div>
<div class="dynamicDiv"></div>
</div>
<aside class="col-md-4 col-lg-3 order-md-0 mt-3 mt-md-0 pr-4">
<div class="dynamicDiv"></div>
<div class="dynamicDiv"></div>
<div class="dynamicDiv"></div>
</aside>
</div>
</section>
Note: We're using Bootstrap for the website so the template above also contains Bootstrap elements.
Other interior template examples we have are the one-column template, full-width template and so on.
How to Create an Interior Template?
An interior template is created the same way the base template is created. Even though it is not necessary, you can create a folder and organize the different kinds of templates over there. In our example, we created a folder titled content and put the interior templates inside that folder:
Step 1 - Create the folder for the template
Go to the web files folder on the tree. Inside the web files folder, go to the templates folder. Click "Add a folder" button. Give a name to your folder and hit Submit.
Step 2 - Create the file for the template
Go to the folder you created and on the right side menu, click on "Add a file", name the file as you wish i.e. two-column-template.tpl. Hit the submit button. Click on the file and add your code. When you're done, click on "Publish".
Step 3 - Add a Page
Go to the www directory and on the right-side menu, click on Add Page.
Step 3.1 - Name your page and publish it
If you'd like to, you can add a description of the page. Click Publish.
Step 3.2 - Select the index.stml page
On the tree, select the index.stml page you created, select the drop zone until it is blue as shown below.
Step 2.3 - Insert the interior template in the page
Find and click on the template file from the left tree and it will be placed on the page.