By continuing to use this site, you agree to the storing of first- and third-party cookies on your device to enhance site navigation; analyze site, product, and service usage; and assist in our marketing and promotional efforts. Cookie Policy

 
Skip to Content

Manage Layouts

Administrators and users with access can manage the many flexible layout options to create the right type of page for your website.

Nest, reorder, and resize frames in a layoutLink to this section

In a layout, you can put tiles, components, or additional frames inside frames. Move frames and resize frame columns to adjust the layout.

  1. Go to Content > Melody > Layouts.
  2. Click the filename for the layout.
  3. Click the lightbulb icon to check out the file for edits.
  4. In the page actions toolbar, click Edit.
  5. In the layout editor, hold the pointer over a frame to see options for the container.
  6. Click the arrows to move a container up or down.
  7. Click the separator between containers and drag to resize.
  8. Save and Launch to update pages on the staging server that use the layout.
    • To see these changes on your live website, Publish the pages.

In the layout editor, you can also use the following keyboard shortcuts:

  • Ctrl/Cmd + Z: Undo
  • Ctrl/Cmd + Shift + X: Redo

Use a custom thumbnail for the layoutLink to this section

Add a thumbnail image that will show in the Layouts tab of the +New menu when users create a new page.

  1. Go to Content > Melody > Layouts.
  2. Click the filename for the layout.
  3. Go to Properties > Settings.
  4. Click the filechooser to upload an image.
  5. Save and Launch to make the layout available for use in creating pages.

Edit the head code for the pageLink to this section

There are two ways to add HTML that will be inserted into the <head> of every page created using the layout. Head code is typically used for page metadata and tracking. 

To add metadata to a layout, use <meta> tags

Add other head code, as follows:

  1. Go to Content > Melody > Layouts.
  2. Click the filename for the layout.
  3. Go to Properties > Head Code.
  4. Enter source code to be added to the <head> of every page created using the layout.
    • We use the web-standard ordering of head code items.
  5. Save and Launch to make the layout available for use in creating pages.

Administrators and users with source code access can also edit the head code on pages created from layouts.

Custom CSSLink to this section

You can add custom CSS for every page created using the layout, go to Melody > Styles > Custom CSS.

Make changes to tiles in use on pagesLink to this section

If you have edited and re-launched a tile, update the layout(s) that use the tile. Edits will appear automatically in pages on the staging server that use the tile.

If the tile content type is Global

  1. Go to Content > Melody > Layouts.
  2. Click the filename for the layout using the tile.
  3. Launch the layout.
  4. Repeat for all layouts that use the tile.

Tile edits are automatically applied to pages using the layout(s). Publish your page for the changes to be visible on the live website.

If the tile content type is WYSIWYG

  1. Go to Content > Melody > Layouts.
  2. Click the filename for the layout using the tile.
  3. Click the lightbulb icon to check out the file for edits.
  4. In the page actions toolbar, click Edit.
  5. In the layout editor, hold the pointer over the tile to see options for the tile.
  6. Click the X to remove the tile.
  7. Drag the edited tile to the layout editor.
  8. Launch the layout.
  9. Repeat for all layouts that use the tile.

Tile edits are automatically applied to pages using the layout(s). Publish your page for the changes to be visible on the live website.

Preview a layoutLink to this section

Preview what your page looks like on different devices.

  1. Go to Content > Melody > Layouts.
  2. Click the filename for the layout.
  3. In the page actions toolbar, click Preview.
  4. In the toolbar, click Preview Tablet Size or Preview Mobile Size.

preview sizes

Previous versions of a launched layoutLink to this section

  1. Go to Content > Melody > Layouts.
  2. Click the filename.
  3. Click the lightbulb icon to check out the layout.
  4. In the page actions toolbar, click Versions.

Then,

Preview version

  1. Click the More Actions menu for the previous version, click View.
  2. Click to see the preview of the layout version.

Revert version

  1. Click the More Actions menu for the previous version, click Revert.
  2. Launch the layout to make it available for use in creating pages.
    • The previous version will appear automatically in pages using the layout, if applicable.

Log of actionsLink to this section

See a log of actions taken—like create, save, launch, and revert—on a layout file.

  1. Go to Content > Melody > Layouts.
  2. Click the filename.
  3. In the page actions toolbar, click Properties > Log.

Restrict a layouts to a siteLink to this section

Layouts are available to all sites by default with an option to restrict a layout to a site(s). Restrict a layout as follows:

  1. Go to Content > Melody > Layouts.
  2. Click the filename for the layout.
  3. Go to Properties > Settings.
  4. In Available Account Wide, select the No radio button.
  5. Select the checkbox for the site(s) that will use the layout.
  6. Save and Launch to make the layout available for use in creating pages.

Copy or rename a layoutLink to this section

  1. In Content > Melody > Layouts, click the More Actions menu for the layout.
  2. Click File > Copy or Rename.

Disable or delete a layoutLink to this section

Disable a layout to prevent content editors from using it to create new pages. Disabled layouts will remain in existing pages. Administrators will still have access to a disabled layouts in Content > Melody > Layouts.

  1. In Content > Melody > Layouts, click the More Actions menu for the layout.
  2. Click File > Disable to remove the layout from the +New menu. 

To restore a layout to the +New menu, click File > Enable for the layout.


Delete a layout to remove it from the list of available layouts. Administrators will no longer have access to a deleted layout. You will not see the option to Delete if the layout is being used in pages.

  1. In Content > Melody > Layouts, click the More Actions menu for the layout.
  2. Click File > Delete.