Versions Compared

Key

  • This line was added.
  • This line was removed.
  • Formatting was changed.
 


Panel
bgColor#f9f9f1
titleColor#f9f9f1
borderWidth0px
titleBGColor#bc4526
titleOn This Page

Table of Contents




 

Note:

The sections in this page has video tutorials in the bottom of the page. If you do not understand the written text and use the video as reference.


The Document Themes Tab

Document Themes control how Documents are styled upon export.

Each Document Theme applies to one export type.

Document Themes contain one or more contain Page Styles, which in turn contain a CSS Stylesheet and any relevant styling assets, such as images and fonts.

 


The Themes tab contains a list of the Document Themes within the Space.

Space Admins can add, delete, and manage Document Themes and the Page Styles that they contain, from within the Themes tab. 

Accessing the Document Themes Tab

To access the Document Themes tab for a Space:

  1. Click your current Organisation's name in the top navigation bar.
  2. Under Swap Organisation, choose the relevant Organisation from the list.
    You will be taken to the Organisation view.
  3. Under the Spaces heading, click the name of the relevant Space.
  4. Click the Space name in the top navigation bar, then click Administer "Space Name".
    You will be taken to the Overview tab of the Space's administration.
  5. Click the Document Themes tab.
 


Add a Document Theme

To add a new Document Theme:

  1. Click the Add a Document Theme button.
  2. Enter a Name for the Document Theme.
  3. Select the right format for the Theme.
  4. Click the Save button.

A new, empty Document Theme will be created.

You can then continue to add Page Styles within the Document Theme. 



Delete a Document Theme

To delete a Document Theme:

  1. Locate the Document Theme in the list.
  2. Click the arrow in the Actions column to open the Actions dropdown menu.
  3. Click Delete.
  4. Confirm you want to delete the Document Theme by ticking the confirmation box.
  5. Click the Delete button.

The Page Template will be deleted, and will no longer be available for Editors working within the Space.




Rename a Document Theme

To rename a Document Theme type:

  1. Locate the Document Theme type in the list.
  2. Click the arrow in the Actions column to open the Actions dropdown menu.
  3. Click Rename.
  4. Enter the new name for the Document Theme.
  5. Click the Save button.

The Document Theme will be renamed.



Administer Page Styles

To view the Page Styles within a Document Theme, click the View Page Styles button.

You will be taken to the Page Styles view for the Document Theme, which contains a list of the Page Styles within the Document Theme.

Space Admins can add and edit page styles from within the Page Styles view.

Add a Page Style

To add a new Page Style:

  1. Click the Add a Page Style button.
  2. Enter a Name for the Page Style.
  3. Select options relating to the default Page Style by ticking one or none of the confirmation box(es):
    1. Is default: make this Page Style the new default for Documents that use the Document Theme that contains this Page Style.
    2. Replaces default style: 

 

 

...

    1. when applied to a page, this styling will completely replace the default Page Style, instead of including rules from both this Page Style and the default Page Style.
  1. Click the Save button.

A new, blank page style will be created.

You can continue to edit the Page Style's CSS stylesheet, and upload styling assets.

Edit a Page Style's CSS Code

To edit the CSS stylesheet of a Page Style:

  1. Locate the Page Style in the list.
  2. Click the Edit CSS Code button.

  3. Edit the CSS stylesheet in the code editor .

    Info

    Before writing any styling for tables, please see Considerations for Styling Tables.


  4. Finalise the CSS, then click the Save or Save and Exit button.

Upload Style Assets

In addition to the CSS stylesheet itself, Space Admins can upload style assets such as font files and images required for styling.

Style assets must be compressed in to a single-folder .zip file.

The .zip file will be extracted at the same level as the stylesheet, so Space Admins can link from the Page Style's CSS stylesheet to style assets using relative paths.

To upload Style Assets:

  1. Locate the Page Style in the list.
  2. Click the arrow in the Actions column to open the Actions dropdown menu.
  3. Click Upload Assets.
  4. Click the Choose File button, then choose your .zip file of style assets.
  5. Click the Upload button.

Edit a Page Style's Details

To edit an existing Page Style's name and/or default settings:

  1. Locate the Page Style in the list.
  2. Click the arrow in the Actions column to open the Actions dropdown menu.
  3. Click Edit details.
  4. Make the required changes, then click the Save button.

Delete a Page Style

Info

You cannot delete the current default Page Style

  1. Locate the Page Style in the list.
  2. Click the arrow in the Actions column to open the Actions dropdown menu.
  3. Click Delete.
  4. Confirm you want to delete the Page Style, including the CSS stylesheet and style assets it contains, by ticking the confirmation box.
  5. Click the Delete button.

The Page Style will be deleted. Any pages that were previously using the style will revert to using the default Page Style for the Document Theme.

Video Tutorials

Watch the video tutorial that follows the guide.

Accessing the Document Themes Tab

The video shows the steps to access the document themes tab once the user is in the relevant space.

View file
nameAccesing Document Theme.mov
height250

Add a Document Theme

View file
nameAdd a Document Theme.mov
height250

Delete a Document Theme

View file
nameDelete Document Theme.mov
height250

Rename a Document Theme

View file
nameRename Theme.mov
height250

Add a Page Style

View file
nameAdd a Page Style.mov
height250

Edit a Page Style's CSS Code

View file
nameEdit CSS code for Themes.mov
height250

Upload Style Assets

View file
nameUpload Style Assets.mov
height250

Edit a Page Style's Details

View file
nameEdit a Page Style's Details.mov
height250

Delete a Page Style

View file
nameDelete a CSS style.mov
height250

...