Creating a page based on an instance module follows the same process regardless of its type; learn the exact steps here. Afterwards, simply edit the default settings and add content by going through the tabs detailed in this article, but remember these affect only the module of a page (orange-colored section from this structure).
To reach the tab bar of an instance module at any time, click the page name in the left side column of the CMS interface. You'll land on one of the module tabs with its identically colored boxes below it.
Start by switching between tabs from left to right and use the Edit/Save buttons located in the upper-right corner of each tab area to make changes in all the available boxes.
Details box: include the page in a category, edit its name and URL; if you change the latter, don't forget to make URL redirects.
Settings box: select the page status (pending, enabled, disabled), choose on which devices to appear (desktop, tablet, phone), apply one or multiple extra CSS classes to customize the display style of the module section.
Menu Item, Categories Listing, Category Details, Projects Listing, Project Details boxes: edit the self-explanatory named fields to customize the default functionality and display style.
Design Layouts box: change the default module layout(s) and even select one for the footer associated exclusively with this page.
These layout changes apply only to the page you're currently on; to create custom layouts that will automatically appear in all dedicated drop lists, learn more about the Layouts option.
Dedicated box(es): modify the predefined text variables of the module.
Module Head tab
Page Title box: edit the page title and description or hide the whole section.
Optional Content box: insert content right below the Page Title section, at the top of the module layout.
SEO Settings box: edit the page meta title, meta description and robots <META> tag (index, follow, noindex, nofollow).
Append HTML Snippets box: mostly useful for tracking codes.
Advanced Settings box: change the align/valign of the title/subtitle, and the number of columns on which they should be displayed for 5 different viewport widths, plus the nav menu position relative to the whole section (above, overlapping).
CSS Class(es) box: add extra CSS classes to the whole section or individually.
The Module & Module Head tabs are more settings oriented, while the rest of them form the main content of the module (orange-colored grid section from this page structure).
Categories & Projects tabs
In any of these tabs, use the Add New button located in the upper-right corner of the list box to create new categories or projects.
In the Projects tab area right above the list box, use the Browse option to navigate to a category.
Use these list box buttons to:
- delete any category or project.
- trigger the edit section of any category.
- trigger the details section of any project that you can later edit.
- order the project list ascending or descending (click the column titles).
- vertically drag & drop any category or project to change its order on the front end (the latter becomes available when you navigate to a category).
In the details section of any project, use the upper-left drop menu to switch between its Brief & Details and Images / Media.
These are dynamic widgets that handle the same content as the module you're currently on, but the way they display it can be different if you add an extra CSS class or background.
You can assign these widgets to any layout with a simple drag & drop or use their auto-generated shortcodes in any editable text field to insert content from a source module throughout your site.
Go to the the main Widgets option article for more details; it doesn't matter where you create and edit widgets, here they're just filtered by Content Source.