Wild Apricot Blog

View: Tags | Archives

How to Get Started Using Website Themes, Layouts and Templates

Kate Hawkes 22 May 2019 0 comments
Templates and layouts post header

Do you have a vision of how you want your organization’s website to look?

For some organizations, that means designing a whole new website from scratch; for others, it could be just updating the header on their existing site.

Building the website of your dreams takes time, but if your organization uses the Wild Apricot website builder you can avoid spending hours editing pages and redoing changes by making the most of how themes, master layouts, and page templates affect the way your website looks. By using these elements, you can choose whether to make changes to your whole website, particular sections, or individual pages.

Whether you’re a new admin for an existing Wild Apricot website, or you’ve just started a trial today, here’s what you need to know to get started building a professional-looking website.

In this post, you’ll learn:


If you want to skip ahead to a particular section, click the link in the list above.

 

Just a note: if you already have a website you've created with another website builder, you can embed Wild Apricot features on your website without having to start from scratch. Click here to see how.

 

How Themes, Master Layouts, and Templates Fit Together

As the graphic below shows, these elements work in a hierarchy: the website theme you choose determines which master layouts are available, and the master layout you choose for each page template determines the way these templates look. As we’ll cover later in this post, this means that making changes to your theme or master layout can cause changes to your templates.

Templates and layouts infographic

 

Website Themes

Website themes are basic design packages that determine the overall look  of your Wild Apricot site, including default colors, site backgrounds and text styles. Some themes also have specific functionality and styles that aren’t available in other themes. You can choose from 12 themes that have different features and styles — click here to see the themes.

 

If you choose to customize your theme, these changes will be reflected across your whole website. You can customize your website theme in 3 ways:

  • You can change the colors and fonts of elements such as menus and headings using the Colors and Styles screen.

  • You can change also the appearance of text elements using CSS customizations.

  • You can replace or override the theme files that control the appearance of the theme using theme overrides.

 

Website template - change theme

How to choose or switch your website theme

Your website will automatically be assigned a theme when you create your Wild Apricot account, but you can change this.

Change this if: You want to completely redesign your website.

To switch themes:

  1. Hover over the Website menu and select the Theme option.

  2. Select the theme you want to use from the theme gallery and click the Apply selected theme button.

  3. Click the Preview button to see what your site will look like with the theme.

  4. Click the Make new theme permanent button to apply it to your site.

 

Beware!

Switching the theme your website is using will make permanent changes to your website, and will change the master layouts and page templates available for site pages. This can change the position of gadgets and layouts on any page and switching back to your previous theme might not restore these.

 

If you’re planning to change your theme, you can ask our Support team to clone your current site so you can test out your changes. Once you’ve decided on your new theme, you can make the changes to your main site and make adjustments to any gadgets that might have changed position.  We recommend chatting to us before choosing this option, as there are some limitations. Click here to contact Support.



Master Layouts

Each website theme has several master layouts you can choose from. The master layout you choose defines the basic layout of your website, such as where the sidebar, header or footer will go. Each master layout has placeholders — defined areas you can drop gadgets into.

You can customize your master layout through theme overrides — click here to find out how. If you choose to customize a master layout, these changes will be reflected in any templates and pages that use this layout.

 

Website template - change master layout

How to choose or switch the master layout you’re using for templates

When you create a page template, it will automatically be created in your default master layout. You can choose to select a different layout within Template settings.  

 

Change this if: You want to change which areas you can add content to.

To switch the master layout used in existing page templates:

  1. Hover over the Website menu and select the Page templates option.
  2. Select the template you want to switch from the list and click the Edit button.
  3. Select the master layout you want to apply in the drop down menu. Click Save.

 

Beware!

Switching the master layout a page template is using can change the position of gadgets and layouts, both on related page templates and pages using these templates. If this happens, you can restore a version of these templates from before you switched the master layout. To do this, select the template you want to restore within the Page templates list and click Changes history. Select the version you want to restore and click the Restore button.

 

 

Page Templates

From each master layout you use, you can create multiple page templates. A template is a version of the master layout you can add content to, such as text or images, or gadgets such as a login box. You can also add a layout within your template so your content and gadgets will be organized into columns.

 

You can create an unlimited number of templates from the same master layout, or you can use a different master layout when you create a new page.

2 page templates infographic

Each template can be used as a starting point for multiple pages — each of these pages will inherit the content and layout from the template, but you can also add different gadgets and content for each page created using the template.


To modify a template:

  1. Hover over the Website menu and select the Templates option.

  2. Within the list of templates on the left, click the template you want to modify. The template you select will appear on the right.

  3. Click the Edit button.

  4. You can modify the template settings in the panel on the left, or click the Gadget or Layout drop-downs to insert gadgets and layouts.

 

For more information, click here. If you choose to modify a template, these changes will be reflected across all pages that use that template.

 

How to create pages using page templates

Making pages from templates infographics

  1. Hover over the Website menu and select the Site pages option.

  2. Click the Add page button to create a new page.

  3. Click the Page icon to open Page settings.

  4. Find the Page template option from the menu and select the template you want to apply in the drop down menu. Click Save.

 

This will use the layout and content you saved in your template. You can add layouts or gadgets that will only apply to this page by clicking the Gadgets or Layouts buttons and dropping your selection onto the page.

 

How to switch the template you’re using for a page

Change this if: You want a page to look coherent with a different set of pages.

To switch the template for an existing page:

  1. Find the page you want to switch in the Site pages list and click the Edit button.

  2. Click the Page icon to open Page settings.

  3. Find the Page template option from the menu and select the template you want to apply in the drop down menu. Click Save.


Unfortunately, there is no way to switch multiple pages from one template to another at the same time, so each page would have to be switched over individually. You can find a list of all the pages that use a template at the bottom of the Template settings page.


Beware!

Switching the template a page is using can change the position of gadgets and layouts. If this does happen, you can restore a version of the page from before you switched the template. To do this, select the page you want to restore within the Site pages list and click Changes history. Select the version you want to restore and click the Restore button.



Summary: The Differences Between Themes, Layouts, Templates and Pages

 

Template comparison table

 

Key Takeaways

  • You can customize your website theme, master layout, page templates and site pages. It’s easy to edit templates and site pages in the content editor, however, if you’re not an advanced user, customizing themes and master layout can be more complex.

  • If you want multiple pages to look similar or use shared elements such as a header, you can save time by creating those pages from the same page template, rather than adding these elements to each page separately.

  • If you want to only edit individual pages, make sure you’re editing site pages rather than page templates.

  • If you switch the layouts and templates you use, this can affect the way your site looks, but you can also restore a previous version.

  • Be particularly careful when changing your site theme. This affects your master layouts, page templates and site pages, and you might not be able to restore these.

 

Kate Hawkes

Posted by Kate Hawkes

Published Wednesday, 22 May 2019 at 1:27 PM

Search: WildApricot.com 

About results ( seconds) Sort by: 
Sorry, an error occured when performing search.
Scroll to top