Creating a website from scratch can be a daunting process. Not only do you have to create the hypertext markup language (HTML), but also the style guide to make it all look good. One way to get started quickly is to use one of the numerous premade templates available on the internet.
In this video tutorial, we will walk through the steps to convert the "Start Bootstrap Clean Blog" template into an Apostrophe template. While we are starting with a specific template, these steps can be generalized to any template you might download.
Converting an HTML template for use in Apostrophe
What to Expect
Any pre-made HTML template can be converted for use in Apostrophe through some simple steps.
- Add the front end assets to your Apostrophe project.
- Create an Apostrophe page type for each of the template pages that substitutes data from the schema fields into each area of the page that you want to edit.
- Add special piece types and piece page types.
In this tutorial, we took extra steps to create reusable navigation, header, and footer fragments. While this makes the overall project more compact it is completely optional.
Documentation and Resources
For developers that like to follow along with the written documentation, that can be found here in our docs. Additional resource links include the Form Builder Extension and the Cookbook for Building Navigation.
We hope that this tutorial will help you get your Apostrophe project up and running a little more quickly!