Skip to main content

All about Pages

Within the optical framework, a page serves as the fundamental building block of your site. It encompasses the information intended for your readers, presented in a layout meticulously designed to deliver content most effectively.

In the following segment, we will guide you through the process of creating a page and utilizing the built-in page templates provided to you as well as deleting and editing pages.

Listing Pages

On your optical console, from the left menu panel navigate to Content -> Pages. This shows you a listing of all the Pages created for your site and some metadata (Page Description, Page Title etc.) in relation to each page

page-listing-panel

This view is customizable. By clicking on the + icon at the right-hand side of the table, you can select additional metadata attributes to display within the table, such as the unique ID of a page and details of the user who created or updated the page.

page-listing-panel

Considering the numerous pages created by various users within an organization, a search function is available to help you quickly find a page of interest. By clicking on the search icon and entering your search text, the optical system performs a swift search across all your pages and displays those containing your search keyword. You may also perform an aggregated search by adding more search conditions to accurately retrieve the pages of your interest.

page-listing-panel

Create Page

To create a page select the + icon located next to the search bar. This will take you to the page creation screen, where you can define the navigation sequence leading to your page, include the title and description, and select the desired page template. For this example we will be doing the following:

  1. Selecting Home|* for the navigation field to define this home page in our content path
  2. Defining the page title as homePage
  3. Selecting a Home Page Template, as the base template for this page. Feel free to explore the other template choices available to you to better understand the difference between them
  4. Choosing a new Paragraph Block as the first content block within our page. Content blocks are UI components that form a page, including accordions, cards, media, section headers, and many more, which you can explore and experiment with separately.

page-listing-panel page-listing-panel

  1. By selecting the Paragraph Block, you can fill in the content in a WYSIWYG format and also include media images within the paragraph.

page-listing-panel

  1. Optical allows you to upload media content from your local machine or choose media from your Optical media library, which contains all media content uploaded by users from your organization. You may also list the Alternative Text for your media as well as define their Width and Height of the content.

page-listing-panel page-listing-panel

  1. Click on the check icon at the top right hand corner of the screen to save our changes and create our page

Delete Page

To delete a page, select the checkbox for the pages you wish to delete, then click on the red delete bin icon at the top right corner of the screen. A confirmation popup will appear, asking you to confirm the deletion. Please note that once a page is deleted, it is permanent and cannot be restored.

page-listing-panel

Edit Page

To edit a page, you may either click on the Page Description or select the checkbox for the page you wish to update, then click on the pencil icon at the top right corner of the screen.

page-listing-panel

Once you are at a page you may click on the Enable Preview eye icon to load a local preview of the page you are editing. This allows you to see the structure of the page and understand the changes you are making to the page.

page-listing-panel page-listing-panel

Lets start editing this page by doing the following:

  1. Clicking on the Paragraph Block and amend the existing text to 'Welcome to Optical, a headless CMS solution to meet your operation needs' and click on the check icon to save your changes

page-listing-panel

  1. Create a new Hero Panel and select an image from the media library as the background image for your banner

page-listing-panel

  1. Within the content block segment, click the Hero Panel item and drag it above the Paragraph Block item to reorder the sequence of content blocks within the page.

page-listing-panel

  1. Click on the preview icon to view the updates made to the site and you should see that the Hero Panel is now displayed above the Paragraph Block with the updated content in the Paragraph Block being shown as well. Feel free to explore the other available content blocks and try adding more to your site.

page-listing-panel

Version History

Optical keeps the version history of all pages from the time they were created. You may view the entire history of changes by clicking on the Revisions accordion on the right hand panel. This displays the changes made and the details of the user who made them.

page-listing-panel

By clicking on any one of the revisions, you are able to see the changes made for the revision in question and also seamlessly revert the page to a previous version.

page-listing-panel

Collaborating

Optical allows you to provide comments at a page level to facilitate collaboration while creating pages. ou may view the entire history of changes by clicking on the Comments accordion on the right hand panel. Through the commenting feature you are also able to tag users to specific comments by listing down their username. This provides them an in-app notification which directs them to the comment in which they have been mentioned. Comments can also be edited and deleted or closed once they have been addressed.

page-listing-panel