Page templates and layouts

Page Templates

All pages begin with a page type. From there you can add layouts and blocks to populate and fill out the page. The following are the basic page types created for NewPi.

The following are page templates you will add frequently.

  • Full
  • Secondary
  • Producer
  • Blog Detail

The following are page tempaltes that you will not need to use as they are specific to certain layouts, such as the homepage or the blog listing page.

  • Home
  • Blog Listing

Adding a carousel to the Producer Page

The carousel is an optional element to the producer page template. To add this to the template, select the gear icon and choose "attributes" from the menu. Find "Product Slider" from the options, select it on the left, then tick the checkbox that appears on the rightside. Save, and now you will have a new area on the page where you can add elements into a carousel.

Adding a Custom Background Image

Like above, navigate to the custom attributes via the gear menu, select "background image", and now you can upload an image from a new button that appears on the right side. The ideal size for these images is rectangle at 1400 by 600 px. Be sure to save for web and reduce file size for optimal page load!

Layouts

Layouts are a CMS tool that allows you to add columns and rows within predesignated areas of page types. Simply click on an editable area, select "add layout", and choose your columns and adjust their width. Then save, and you now have a layout! Add content and blocks to complete your page.

Layout Presets

Some page templates have a full width area, and this is great to use full width content or block types. However, you may find that you need a container in this area. Do this, there is a "container" preset in the custom layouts menu. This will add a container to the full width area. You can then add responsive columns from the custom layout menu to this new container. This will expand the possibility of each page type, but you will seldom if ever need to use this option.