Intranet Styling Tools

STYLING TOOLS

The styling tools can be used to create interactive, dynamic and visually pleasing news items and Management System pages. Most tools work in a similar way to standard word processing tools.

Using Source Code to Copy Formatting

Before creating any information on a new page, it is often easier and more efficient to copy a similar page and edit from there. Formatting tables for example can be quite tricky so copying an existing format is a much better process.

To copy source data, from the edit screen:

1. Click the 'SOURCE' to change the display to the source code

   Open

   

    

2. Copy all the HTML code

3. Open the new page

4. Click 'Source'

5. Paste the HTML code

6. Click 'Source'

7. Alter / delete / add to the page as required

Definition of Fields

Name	Definition	Example

Name	Definition	Example
Open	Displays the HTML code If code and programming functionality is understood, this can be used to format the page.   The source code is a handy tool to use to copy existing formatting and reuse instead of starting from scratch.
	A selection of pre-set styles to select from, including inline quotations, subtitles, containers/ boxes, keyboard phrases etc
	Font style
	Format text or remove formatting from text
	Change background or text colour
	Align text left, centre, right or justified
	Standard formatting tools: cut, copy, paste, paste as plain text, paste from Word, undo, redo	N/A
	Add links to videos, URLs, text anchors and emails. Anchors can also be used.   See the Links section on this page of the user guide for more details
	Create bullet points using numbers and dots, with options to increase and decrease indentation. Insert quotes into pages
	Add: tables - vast editing options available, including links horizontal lines - use as a section break widgets - add files, images and lists of subpages   Note: the Placeholder feature is a legacy function soon to be removed from Lucidity Intranet. To create a placeholder for your Management System, we recommend using the document title or another unique identifier for your file and including a footnote that the file is not yet published.    See the Table and Widgets sections on this page in the user guide for more details

Links - Text, Images and Videos

Links can be added as standard hyperlinks or to images containing hyperlinks. Links can direct users to any Web pages, including videos, images, instructional pages etc.

Links to anchors and emails can be used but the most common use is adding links to text or to an image.

Insert a Link as Text

To add a link as text, from the edit screen:

1. Click the link

   icon in the style bar

2. In the pop-up window, enter the display title (text displayed in the item containing the link)

3. Under link type, select URL and enter the web page address (URL)

4. Under the target tab, a target window can be set to determine how the link opens for the end-user. For example, selecting 'New Window' will mean the URL will open in a new window every time it's selected.

    

5. Click 'OK' to save the link

Insert a Link as an Image or Video

To add a link as an image, from the edit screen:

1. Follow the steps in the Widget section on this page of the user guide to insert an image

2. Right click on the image

3. Click 'Image Properties'

4. In the pop-up window, click the 'Link' tab

5. Enter the URL

6. Add Target

7. Click 'OK' to save the link

8. When an end-user clicks the image, the video will open

   1. Note the video must be stored online and not within Lucidity or on a computer or network drive

Linking Files from Online Shared Drives (eg: Google Drive)

Files kept within online shared drives such as One Drive, Dropbox and Google Drive can be linked to the Management System.

The instructions below outline how to share links from Google Drive. Refer to the specific shared drive instructions for details on how to share files.

To link a file, from Google Drive:

1. Locate and open the file to be shared

2. Click 'Share' in the top right-hand corner of the Google doc

3. In the pop-up window, click the drop-down arrow next to 'Copy Link'

4. Click 'More' to open the next menu screen

5. Select the 'On- Anyone with the link' option

6. Click 'Save'

7. Click 'Copy Link' to copy the link to the clipboard

8. In the Management System in Lucidity Intranet, select the page where the link it to appear

9. Click 'Edit' to open the Styling Tools

10. Enter the copied link from Google Drive using the link 

     icon and instructions outlined above

Tables

Tables can be added and then edited using the same styling tools.

Note it is often more efficient to copy and edit an existing table (using the HTML source code) rather than starting from scratch. Refer to the Using Source Code to Copy Content section at the top of this page.

To add a table, from the edit screen:

1. Click the table 

   icon in the style bar

2. In the pop-up window, edit the table properties as required

   1. number of rows and columns, width and height, header rows, alignment etc can all be adjusted

3. Click 'OK' to add the table to the page

4. Each cell in the table can now be edited using all standard styling tools, including links, placeholders etc

5. Right click the table to access additional editing functions

   1. To change the colour of a cell, select 'cell properties.' In the 'Background Colour' cell, enter a simple colour such as red, or enter the full RGB colour for different shades. For example, 'rgb (150, 150, 150)' will give a shade of grey.

Widgets

Widgets can be used to insert files, images and display subpages of pages.

Add File

To add a file, from the edit screen:

1. Click the widget 

   icon on the style bar

2. In the pop-up window, select 'Filing Cabinet File'

3. Search through the Filing Cabinet to locate and select the document

4. Click 'OK'

5. The file will be added as a link to the page

Add Image

To add an image, from the edit screen:

1. Click the widget 

   icon on the style bar

2. In the pop-up window, select 'Filing Cabinet Image'

3. Search through the Filing Cabinet to locate the image

4. Click 'OK'

5. The image will be added to the page

6. Right click the image to access additional properties to edit the image, including adding hyperlinks

Display Sub-Pages

The display sub-page widget will automatically create a bullet hyperlinked list of the subpages under the current page AND automatically add any new subpages to the bullet list.

To add a list of subpages (child) associated with the current page, from the edit screen:

1. Click the widget 

   icon on the style bar

2. In the pop-up window, select 'Subpage List'

3. A list of subpages will be displayed

4. Click 'OK' to save (a subpages icon will display)

    

5. Click 'OK' to save the page

6. The subpages will be listed

7. Any future subpages added will be automatically added to the parent list in alphabetical order