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

I'm a Web Developer

As a web developer, you've probably worked in other platforms to make web design files (for example, HTML, CSS, JS). You can continue this development process within Omni CMS to create new websites using layouts or templates.

Create Using Melody LayoutsLink to this section

Enable Melody for your account

Administrators, make layouts available for all sites in your account. 

  1. Go to Setup > Account > Optional Features.
  2. Select the Melody checkbox.
  3. Click Configure to assign group access.
    • Grant access fto Builder for users who will create and edit the layouts that are used to create pages.
    • Grant access to Tiles and Frames for users who will create and edit the tiles and frames used to create layouts.
    • Grant access to Styles for users who will edit the CSS used by layouts.
  4. Click Save.
  5. In account setup, click Save.

Once enabled, you can restrict individual layouts to a site(s).

Create your default styles

Create the default CSS file that your layouts will use to create pages. Generating CSS will add a disabled /omni-cms folder to your site in Content > Pages. This folder will publish to your production server.

  1. Go to Content > Layout Builder.
  2. In the Style Configuration box, click to Generate CSS.
    • To edit the default CSS go to the Layout Builder panel, click Styles.

Create a layout

To get up and running quickly, drag and drop the prebuilt tiles, frames, and components to create a page layout that content editors can use to create pages. 

  1. Go to Content > Melody.
  2. Click +New.
  3. Type to enter a name for your layout.
  4. Click Create.
  5. From the sidebar, drag frames, tiles, and components and drop them in the layout editor.
  6. Save and Launch to make layouts available for creating pages.

You can customize layouts to fit your needs by adding thumbnails, editing the head code, creating new tiles and frames, and more. And manage the flexible layout options to create the right type of page for your website.

When a page is published from Omni CMS the product is a flat HTML file. The file extension may vary based upon your production server configuration but the actual source code of that published page is HTML. Inside Omni CMS, pages created from layouts (Layout Control Files [LCFs]) insert their content into the final HTML to provide you a preview within Omni CMS and to build out the final page product at publish.

Create Using TemplatesLink to this section

Once your design files have been created, you can then transform them into Omni CMS web pages by creating a page template. Page templates use XML and XSL to insert unique page content into the appropriate locations within your source code. Once you master this introductory section, our Technical Reference section has more information about developing using templates.

Creating New Website Design Files

Web development within Omni CMS begins with a new, blank file. If your implementation included a New File template, this is your starting point. If not, you can make a copy of an existing text-based file (for example, HTML, CSS, JS) or you can create a new file template.

  1. Navigate to the Content > Pages section of your Omni CMS site where you'd like to create a new website design file.
  2. Click +New.
  3. Select the new file template.
  4. Enter a name and appropriate file extension into the "Filename" field.
  5. Click Create.
  6. You are now on the new page and can start developing and using the source editor.

Omni CMS supports most web development file types. Remember, CSS and JS files will need to be published to see your design update within Omni CMS.

Creating a New File Template

  1. Navigate to where the templates for your site are located, most likely /_resources/ou/templates.
  2. Copy an existing Template Control File (TCF) and rename it newfile.tcf.
  3. Delete all existing code and replace it with the following code block.
    <?xml version="1.0" encoding="UTF-8"?>
    <title>New File</title>
    	<template prompt-prefix="New File" extension="inc" publish="no" exclude-sitemap="yes" exclude-search="yes">newfile.tmpl</template>
  4. Click Save.
  5. Copy an existing template (TMPL) file and rename it newfile.tmpl.
  6. Delete all existing code and leave this file completely blank.
  7. Click Save.
  8. Upload a thumbnail image and name it newfile with the appropriate image file extension.
  9. Then you may use the New File Template to start your process of developing.

Next: Tagging a Page Created from Templates