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 layout pageLink to this section

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. You can also add custom CSS and JavaScript for the page.

To add custom CSS that will apply to all pages created from layouts, go to Melody > Styles > Custom CSS.

  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.
  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.

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 using 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).

If the tile content type is Editable

  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).

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

See previous versions of a launched layoutLink to this section

  1. Go to Content > Melody > Layouts.
  2. Click the filename for the layout.
  3. In the page actions toolbar, click Versions.

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. 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.

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

Deleted layouts will remain in existing pages.