Creating a Page
This guide will help you create a page.
So that you can follow the steps in this tutorial, you have to have a layout that the page will use. You should also understand the concepts behind pages and layouts. To check what you've created, you'll need to know how to deploy your changes.
Creating a page is a four-step process:
Step 1: Create a directory for pages
Pages should be placed into the
views/pages directory inside
If you are starting from scratch (without having created the codebase), navigate to the
views directory you created for the
layouts directory inside
app, then create a directory called
If you have already created the codebase, you can skip this step, and just locate your
Step 2: Create a page file
pages directory, create a Liquid file called
Step 3: Edit the Page file
home.liquid page file.
See a sample page file with explanations below:
--- slug: / --- Homepage
- Pages have two required parameters:
format, but the default format is HTML.
---separate configuration from content.
/marks the root page, which is the homepage.
Save your page file.
Step 4: Deploy and check
Deploy or sync your changes, and check the source code of your homepage. You should see the layout file with the page content injected into it, like this:
<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <title>Layout title</title> </head> <body> <h1>Layout</h1> Homepage </body> </html>
Congratulations! You have created a page file. Now you can add new pages at custom URLs.