Ghost is a strong tool that enables theme creators to build up unique settings that show up in Ghost Admin, making it simple for website owners to choose their preferred style without having to change the ghost themes files. With the help of custom settings, you can manage to add a new page/site-wide/homepage/post settings. In this post, we will create a custom page in our ghost themes.
- Using page templates
- Using custom templates
- Using the
1. Add custom page with page templates: Download your current theme and create a new template file using the naming convention
page-contact.hbs). Save this file in your theme’s root folder. Now, the page with the slug /contact/ will display in the browser using your new template file.
2. Add custom pages with custom templates: When you wish to use a template on multiple pages, this technique is perfect. Every custom template file name must begin with custom—then you can add some template-specific naming. Like above, create a new template file but this time uses the naming convention custom-TEMPLATENAME.hbs (e.g.:
custom-contact.hbs). Again, save this file in your theme’s root folder.
When there are any files in your theme with the
custom-*.hbs naming pattern, they will show up in under Template in each page’s settings panel in Ghost. For each page in your ghost themes, you can now easily choose the template you want to use.
3. Add a custom page Using the
routes.yaml file: If we’re talking about a customized about page, the
routes.yaml file needs to have the following section:
In the code upper, we do two things, we define the route /about/ (URL) based on the about.hbs template and with data coming from the page with slug about
Although it’s not necessary to define the data property, it’s a terrific approach to quickly manage all the meta properties from the Admin area for this specific page. If necessary, you can also use additional page elements like the featured image or content. To use the content of the page inside the about.hbs file, you have to be in the page context, for example to output the title and content:
You can also make other pages, like a custom contact page or a custom home page, in the same way.
We hope that this article will help you to add a custom page in the ghost themes for your website. Connect with us for further info themeix.com