Docs » Page layouts

Page layouts are alternate HTML layouts that you want to use other than the individual.html file used in your content type's main directory. As an example:

Let's say you make a new new content-type called "Articles" in your CMS. As usual, Webhook generates the file /templates/articles/individual.html that your articles will use. But what if you want some articles to use a completely different article layout that's more tailored to the content of that specific article? That's where the Page layout widget comes into play.

Let's make it so we can do just that.

1. Add the layout widget to your form

The first thing to do is to go into the form builder and add the "Page Layout" widget to your form. Next you want to edit the fields to include the layouts you want users to be able to select from when creating an article. In the below example we've added a "Featured Article" and a "Gallery Article" template. We also went ahead and said these would use featured.html and gallery.html respectively.

Once saved, our article forms will now allow the writer to select from these layouts when writing their article. Note that we left "none" as the default. By doing this, it means that our articles will by default still use the /article/indivudal.html template if the user doesn't make a selection.

2. Create HTML layouts to match

Now all that's left is to create a /templates/articles/layouts/ directory and add a featured.html and gallery.html file inside. Now any articles that are assigned to that layout will use that HTML page instead of the default one. Otherwise those pages act exactly as the articles/individual.html page does and can access the same variables on the page.