Stylesheets

From unroole CMS wiki
Jump to: navigation, search


Unroole Site Builder Admin Panel - Stylesheets.jpeg

Custom Stylesheets applied to a channel.

Stylesheets allow admins to add additional global CSS to an entire channel. They are useful for augmenting pages or layouts of channels without modifying an entire theme. To get started with stylesheets you must be in advanced mode.

Creating

Unroole Site Builder Admin Panel - Stylesheet new.png

A form with a simple box stylesheet added.

Adding a stylesheet entry to a channel can be useful for augmenting the style of a page or channel provided as part of a theme. This can be extremely useful when modifying the look and feel of your website for a specific promotion or event. Any stylesheet entry added to a channel are automatically appended to the header of a page in the order specified in the currently active Theme. To add a new stylesheet please follow these steps:

  1. Navigate to the Stylesheet section under "Channel Content".
  2. Click the 'Create Stylesheet' button.
  3. Enter the name of the stylesheet entry for reference
  4. Add in your CSS stylesheet code. The layout editor provides a number of tags and classes for you to reference. For more information see Layout Structure.
  5. Click 'Save' to finalize the creation of your stylesheet.

Notes:

  • Due to the nature of browser compatibility with certain css tags the system does not check for valid syntax upon stylesheet creation.
  • Any stylesheets added to a channel will become available immediately after creation. It is highly recommended to target specific html tags or attributes unique to page versions if this stylesheet entry is only application to a particular version of a page.

Updating

Unroole Site Builder Admin Panel - Stylesheet edit.png

Editing a stylesheet entry that is already active on a channel.

Updating a stylesheet entry employs a similar process to creation. Follow the steps below to update an existing stylesheet:

  1. Navigate to the Stylesheet section under "Channel Content".
  2. Click on the "edit" link beside one of the stylesheet entry you wish to edit.
  3. Update the name or stylesheet entry and code properties.
  4. Click "Save" to finalize the changes.

Removing

Unroole Site Builder Admin Panel - Stylesheets deletion.png

Highlighting the deletion buttons of stylesheet entries of a channel

To deactivate a stylesheet you need to delete it from your channel. Use the following steps to remove a stylesheet entry:

  1. Navigate to the Stylesheet section under "Channel Content".
  2. Find the stylesheet you wish to delete in the list or by searching
  3. Click the "delete" button
  4. You will be prompted to confirm your removal of the stylesheet entry
  5. Click "OK" to finalize the removal of the stylesheet entry.

Sometimes you may want to only temporarily remove the stylesheet entry from a channel. In this case you should first save a copy of the entry as a template for later use. To do this see the templates section for more details.

Templates

Unroole Site Builder Admin Panel - Stylesheets Template Duplication.png

Copying a stylesheet from a channel to an account as a template.

Stylesheets templates are a good way to save commonly used stylesheet entries. There are two ways to create a new template. The first way is to generate a template from scratch just as you would a normal stylesheet. Alternatively any existing stylesheet entry or template can be duplicated as a new template. To copy a stylesheet to a template:

  1. Navigate to the Stylesheet under "Channel Content".
  2. Click the "Duplicate" button
  3. Select "Account (as a template)" as the area to duplicate into.
  4. Click "Submit" to create the template.

After a template is created you are able to make changes to it just as you would a normal stylesheet entry. For compatibility reasons any changes to templates will not be reflected in the stylesheets created from them.

Unroole Site Builder Admin Panel - Stylesheets Template.png

The stylesheet template index page. It works and functions much like the channel stylesheet.

Note that stylesheet templates are saved on the account level so that they are globally accessible to all channels under that account.