About the Logic CMX Page Manager
The Logic CMX Page Manager is where you add, edit and delete website pages.
To view the page manager, login to the Logic CMX admin and go to Pages within the Website tab. A listing of pages will be displayed. For new projects, the page manager will be empty.
From this page you can add new pages, edit existing pages, and duplicate a page to create a new variation. A search tool is provided to assist in quickly locating a page for editing.
This Support Article Contains the Following Guides:
- Managing Pages
- How to Add a New Web Page
- Edit a Page
- Work with Rows & Columns
- Add Modules
- Page Settings
- SEO Settings
Managing Pages in Logic CMX
Each page listing displays a title, creation date, last modified date (last time the page was changed), status (enabled or disabled), and tools to manage the page.
- Click on a page title or select the edit icon on the right side to open it in edit mode. You can also duplicate the page as a starter template for another page or to test out a new variation.
- Click on the Duplicate icon to copy the page so that it can be modified to create a new page. You will be prompted to save the page with a new name. By default, duplicated pages are disabled and need to be enabled before they can be linked or published to the live site.
- Select “Preview” to display the front-end web page in a new window.
- Delete icon will require a confirmation before removing the page.
- Use the select checkboxes on the left side for bulk actions from the menu directly above.
Add New Page
Select the purple ADD NEW PAGE button at the top right corner of the page listings table to create a new page. The page details form will display allowing input of initial details.
You will be prompted to add a title. The page title is the only required field to create a new blank page. There are also SEO settings including Meta Page Title, Keywords, Description, and Campaign Tracking Codes. Once completed, select the SAVE button to go to the page editor.
After saving the new page, a blank page editor will display with a default standard section and row. Before we can explain how to start adding content, we’ll need to go over how the page editor works.
Page Editor
Below you’ll find the main components of the page editor. All editing of content that will appear on the front-end takes place in the center page layout section.
The page layout controls are in the center column of the page editor and use boxes known as “sections" to manage content on the front-end web page. Below we have three sections in the page editor on the left, that correspond with layout elements on the web page shown on the right.
The editor becomes a visual map representing the blocks of content on the front-end page with each section arranged in the order they appear on the web page.
Rows & Columns
Once you have created a section, you have to select a column configuration by clicking within the current row. You can also add additional rows to your section, each with a different column configuration.
Modules
Once you have selected your column configuration from the columns pop-up, you will see the column arrangement within your row. The example below shows a three column configuration. Click on a column to add a module following these steps.
Configuring a Module
By default, when you insert a new module, it will open a settings module so custom content can be entered. You can also open a module for editing by clicking on the MENU icon on the left side of the module.
This above example is of a Text Block module. A rich text editor is provided to allow styled text, images, links, and simple tables to be added to your web page. A simple web page can be created with the use of this single module, although most layouts will use multiple modules. Click “SAVE” to save your changes.
The Settings Tab
All modules, sections, and rows have a SETTINGS tab where you can customize the appearance of your module, set visibility (show or hide a module for different size displays), adjust spacing (through padding and margin settings) and add motion, animation, and parallax effects. Here are descriptions of common controls within the settings tabs
- Label: Displays a custom name for the module when viewed in the editor rather than the generic module label.
- Save to Library: Save your customized module to the library so it can be used repeatedly on other pages. A label is required before saving a module to the library.
- Force Module Height: This will make all modules in the same row the same height based on the tallest module.
- Visibility: Show or hide a module, row, or section according to the device screen size (desktop, tablet, or mobile phone displays) or logged in status.
- Padding: Refers to space that can be added in pixels, within the active area of the module, row, or section.
- Margin: Refers to space that can be added in pixels, outside the border or active area of the module, row, or section.
- Backgrounds: Add a background color, image, video, or border to a module, row, or section. In some cases, parallax effects may be applied to transform a background image into a fixed or moving image independent of page scroll.
- Animation: Select from a menu of motion options for loading the module, row or section. Effects can be applied on load or on scroll and include fades, swipes, spin, wobbles, bounces, and other motion effects.
- Column Split & Spacing: Custom settings enables two modules to share space within row settings. Also adjust the amount of space between columns within a row..
Page Layout Controls & Settings
Below you’ll find a description of the buttons and menus found in the right column of the page editor. These controls help assigning page visibility, edit SEO settings, set page parameters, generating a QR Code, previewing updates, and many more features.
Page SEO & Tag Settings
Below you’ll find a description of the features found in the lower section of the right column of the page editor. These edit links allow modifications to SEO settings, insertion of campaign tracking codes, general page options for page background color, width, etc...