Flexible Pages: Adding and Editing Content
Table of contents
Table of contents
Creating a New Flexible Page
Adding Components to your Page
Adding Images to the Full-Width Region
Adding Components to the Main Region
Editing Components
Removing or Duplicating a Component
Publishing and Unpublishing your Flexible Page
Publish Slider
Publish section of the sidebar
Delete
Customizing the Editing Interface
Video Tutorial
Creating a New Flexible Page
To create a new Flexible page, go to Shortcuts ⟶ Add Content ⟶ Add Flexible page.
.png?apiToken=eyJhbGciOiJIUzI1NiIsImtpZCI6IjIwMjMtMDUtMDQifQ.eyJzY29wZSI6Im5vdGUtZXhwb3J0IiwibmlkIjoiNVA4bUpvR2t3RCIsImlhdCI6MTczNTI4NTAyNywiaXNzIjoiaHR0cHM6Ly9zbGl0ZS5jb20iLCJqdGkiOiJWMFkzVjNjNlIyOHF1VSIsImV4cCI6MTczNzg3NzAyN30.AUSuv4RxlMLrtAXxzvGjLwt3uUEhtUvMpijQI8NmStA)
Adding Components to your Page
From the Editing interface, click "Add Hero Image" to add a Banner Image to the full-width region or "Add Component" to add any type of Component to the main width region.
.png?apiToken=eyJhbGciOiJIUzI1NiIsImtpZCI6IjIwMjMtMDUtMDQifQ.eyJzY29wZSI6Im5vdGUtZXhwb3J0IiwibmlkIjoiNVA4bUpvR2t3RCIsImlhdCI6MTczNTI4NTAyNywiaXNzIjoiaHR0cHM6Ly9zbGl0ZS5jb20iLCJqdGkiOiJWMFkzVjNjNlIyOHF1VSIsImV4cCI6MTczNzg3NzAyN30.AUSuv4RxlMLrtAXxzvGjLwt3uUEhtUvMpijQI8NmStA)
A popup menu will appear, and from this menu you can choose the specific type of Banner Image or Component to add.
Adding Images to the Full-Width Region
The full width region is the area at the top of your page where you can add an image. When you click "Add Hero Image" (soon to be renamed "Add Banner Image") you will see this popup menu. Simply click on the image or "add" button to add that type of Component to the full width region atop your page.
For a deeper dive into the types of Banner Images, please see our Reference Websites: Colorful Theme (Banner Images) and Traditional Theme (Banner Images) .
Adding Components to the Main Region
Similar to adding media at the top of your page, selecting "Add Component" in the main width region will display a new popup menu with thumbnail images of the various choices. Simply click on the image or "add" button to add that type of Component to your page.
Once selected, enter your content in the fields. Save once complete.
You can add multiple components to the page at a time.
The order of components can be changed by clicking the grid of 6 dots to the left of a Component and dragging it to the desired location. Optionally, you can click the up or down caret to move the component up or down one space, respectively. Don't forget to save!
.png?apiToken=eyJhbGciOiJIUzI1NiIsImtpZCI6IjIwMjMtMDUtMDQifQ.eyJzY29wZSI6Im5vdGUtZXhwb3J0IiwibmlkIjoiNVA4bUpvR2t3RCIsImlhdCI6MTczNTI4NTAyNywiaXNzIjoiaHR0cHM6Ly9zbGl0ZS5jb20iLCJqdGkiOiJWMFkzVjNjNlIyOHF1VSIsImV4cCI6MTczNzg3NzAyN30.AUSuv4RxlMLrtAXxzvGjLwt3uUEhtUvMpijQI8NmStA)
For a deeper dive into each type of Component, please see our Reference Websites: Colorful Theme (Emphasis Components) and Traditional Theme (Emphasis Components) .
Editing Components
Once components have been created, you can edit the information (including images and videos) at any point.
Note: If you have a Developer's Catalog you'd like to change or remove please contact the Web team for assistance.
.png?apiToken=eyJhbGciOiJIUzI1NiIsImtpZCI6IjIwMjMtMDUtMDQifQ.eyJzY29wZSI6Im5vdGUtZXhwb3J0IiwibmlkIjoiNVA4bUpvR2t3RCIsImlhdCI6MTczNTI4NTAyNywiaXNzIjoiaHR0cHM6Ly9zbGl0ZS5jb20iLCJqdGkiOiJWMFkzVjNjNlIyOHF1VSIsImV4cCI6MTczNzg3NzAyN30.AUSuv4RxlMLrtAXxzvGjLwt3uUEhtUvMpijQI8NmStA)
Removing or Duplicating a Component
Once a Component has been created, you can remove it. Doing so will delete all content in the component. To remove, click on the three dots to the right of the Edit button and select Remove.
Alternately, you may wish to duplicate, or copy, the Component. This works well when multiple pieces of similar information should have the same formatting. Simply click the three dots to the right of the Edit button and select Duplicate. From there, make whatever nuanced edits you need.
Publishing and Unpublishing your Flexible Page
Publish Slider
You'll notice a slider next to the Save and Cancel buttons at the top of your page that is labeled "Publish."
If "Publish" is selected, than anyone will be able to view your content regardless of their login status. If "Publish" is not selected, then your page will be unpublished. This means that only people who are logged into your website and have content management permissions will be able to view your page.
Publish section of the sidebar
You'll notice a box at the bottom of the sidebar on the right of the editing interface. This box is labeled "Publish."
Although this isn't where you toggle the publication settings, this is where you can add information about the revisions you've made, which is particularly helpful when using Page Revisions .
Delete
You might have noticed a "Delete" button within the Publish box at the bottom of the sidebar on the right of the page. While it might be tempting to delete a page you're no longer using, we urge you to consider whether or not the page will ever be needed in the future.
It's almost always better to Unpublish a page , rather than Delete it outright. With Unpublish, your content is hidden from users and can be brought back at a later time. Deleting content permanently erases it forever.
Customizing the Editing Interface
If you'd like more room to see your content or just prefer a cleaner interface with fewer distractions, you can choose to hide the settings panel on the right side of the screen.
There is now a button that looks like a small window to the right of the Cancel button. When you click on it, the Settings Panel on the right of the screen is hidden. Click again and it comes back.
.png?apiToken=eyJhbGciOiJIUzI1NiIsImtpZCI6IjIwMjMtMDUtMDQifQ.eyJzY29wZSI6Im5vdGUtZXhwb3J0IiwibmlkIjoiNVA4bUpvR2t3RCIsImlhdCI6MTczNTI4NTAyNywiaXNzIjoiaHR0cHM6Ly9zbGl0ZS5jb20iLCJqdGkiOiJWMFkzVjNjNlIyOHF1VSIsImV4cCI6MTczNzg3NzAyN30.AUSuv4RxlMLrtAXxzvGjLwt3uUEhtUvMpijQI8NmStA)
.png?apiToken=eyJhbGciOiJIUzI1NiIsImtpZCI6IjIwMjMtMDUtMDQifQ.eyJzY29wZSI6Im5vdGUtZXhwb3J0IiwibmlkIjoiNVA4bUpvR2t3RCIsImlhdCI6MTczNTI4NTAyNywiaXNzIjoiaHR0cHM6Ly9zbGl0ZS5jb20iLCJqdGkiOiJWMFkzVjNjNlIyOHF1VSIsImV4cCI6MTczNzg3NzAyN30.AUSuv4RxlMLrtAXxzvGjLwt3uUEhtUvMpijQI8NmStA)
Video Tutorial