Manage the core files that dictate the way your website looks. A website can have multiple different themes and a theme can be applied to different departments.
What is a theme?
A theme is the look applied to your website, or department in your website. Built using Inner & Outer templates and TWIG Sources, even guru designers can have a great degree of control over the look and feel of the website.
What is an Outer Template?
The outer template includes the top header area of the page including the logo, utility links and top/primary navigation. You can create an outer template and change the arrangement and look of one or more pages. The outer template also includes the footer area of the website. Think of the outer template as a wrapper for all your pages. This wrapper includes just the header and footer areas of your website and includes the "Inner" templates described below within them.
What is an Inner Template?
You can multiple inner templates as well. Just like outer template, these take over the content that is enclosed by the outer templates. You can set up full-width pages, or more typically, pages that have a secondary navigation to the left or the right and a content area for your publishers to manage their content in. The combination of outer and inner templates makes for a powerful set of options to set up and manage the arrangement of your site theme.
How do I create a new theme?
- To create a new theme, navigate to Themes & Layouts and click the green +Theme in the upper right hand corner
- You will be taken to a list of Campus Suite Templates, choose the Template that you would like to use as a base. You will be shown a preview of the theme where you will can either Select it or choose another.
- After choosing a theme enter the name of the new theme and click Create. This will create a new theme where you can create, using a pre-constructed template of the theme that you chose and then edit the Outer & Inner templates to your liking for the new theme.
Note: If there is not a template in either the Inner or Outer Templates, when you click on the appropriate button in the upper right hand corner (+ Inner Template or + Outer Template) you will be able to select he Default template for the theme.
How can I edit a theme?
To edit a theme, navigate to Themes & Layouts and click on the Pencil icon to the right of the theme's name. This will allow you to edit the Name of the theme, any Variables and Source. While editing the theme, if you click on the theme's title in the upper left hand corner a menu will appear, select Theme Settings and you will be able to edit the Name of the theme, any Variables and Source.
How do I delete a theme?
To delete a theme, navigate to Themes & Layouts and click on the Trash can icon to the right of the Theme that you would like to delete. While editing the theme there is second way of deleting it, if you click on the theme's title in the upper left hand corner, select Delete Theme from the menu that appears. Please remember once a theme is deleted it cannot be recovered. The theme will have to be rebuilt.
What template was chosen for a Theme?
To find out what template was chosen for a theme go to Themes & Layouts and located to the right of the Theme's name and to the left of the icons is the name of the Template that was chosen for the Theme. Please note that after a Theme has been created the Template cannot be changed.
How do I assign a theme to a website?
To assign a theme to a website, navigate to Sites & Departments in the dashboard and choose Theme. Select the Default Theme you would like to assign to the site and then Save.
How do I assign a theme to a department?
While we do not recommend having different themes for sub-departments of a school, navigate to the department that you would and click on its title in the upper left hand corner. Select Edit Theme from the menu that appears, choose the Default Theme from the list shown and finally Save.
What is Fallback?
If Fallback is chosen (solid green), that template is the default template for the site.
How do I edit an existing layout?
To edit an existing layout, navigate to Themes & Layouts and chose either Inner or Outer Layout, depending on what you what you are wanting to edit. This will take you to a list of the layouts for your site, click on the Pencil icon to the right of the layout you would like to edit. Finally to get to the page editor for the layout, click on Edit Mode in the left navigation.
How do I duplicate a current layout?
Usually only a designer will have to duplicate a layout but if for some reason you need to duplicate a layout, please do the following steps listed below. Also, please note if you click on the Clone tool to the right of an existing layout and chose a model: That template will be overwritten by the model's information and will need to be completely rebuilt.
- Go to the dashboard and choose Themes & Layouts in the left navigation
- Depending on your site a number of Themes will be shown, click on the Inner Layouts or Outer Layouts (depending on what you would like to duplicate) in the theme that you would like to create it in.
- Click on the green + Inner Template or + Outer Template button in the upper-right hand corner, select Default and enter a descriptive name in the name field and switch the Theme Only to Yes followed by save.
- Now click on the Clone tool to the right of the layout you just created and select the Model you would like to use, then submit.
- To edit the new template click on the Pencil icon to the right of the title. Select Default and finally Edit Mode in the left hand navigation to be taken to the page editor
- Make sure to click the Save --> Publish options just as you would when you're editing pages.
How do I delete a layout?
To delete an existing layout, navigate to Themes & Layouts and chose either Inner or Outer Layout, depending on what you are wanting to delete. This will take you to a list of the layouts for your site, click on the Trash icon to the right of the layout you would like to delete. Please remember once a layout is deleted it will have to be rebuilt, there is not a way to recover a deleted layout.
How do I assign a layout to a department?
To assign a layout to a department, navigate to the department and click on its title in the upper left hand corner. Select Edit department from the menu that appears and then Theme. Finally click on either Default Outer Layout or Default Inner Layout and chose the layout from the list shown.
- Theme/Design Documentation - A collection of articles and videos reviewing what to consider when designing your site