Styles

 

WYSIWYG Styles enable specific styles to be applied to content using the Styles option in the editors toolbar. Below is a description of the Styles available in the toolbar. 

Text styles are available for use on text in the editor.

Small Text

Makes text small. Useful for disclaimers or annotations.

Example small text

ÒùÐÔÊÓƵ Dark Blue Text

Applies the ÒùÐÔÊÓƵ blue to text.

Example dark blue text

Light Gray Text

Applies a light shade of gray to text. Useful for speical instructions or to deliver a softer message than the standard text.

Example light gray text

Red Text

Makes text red. Useful to convert an alert or danger message.

Example red text

Lead Text

Makes a paragraph stand out. It precedes the main body of the page, and it gives the visitor the main idea of the page.

Example lead text

The images styles are availabe for use on images inserted in the editor.

Image - Right

Floats an image to the right of it's surrounding content:

autumn pathway

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tempus tincidunt erat vitae ornare. Aenean sit amet bibendum eros. Fusce sit amet elit vestibulum augue luctus facilisis at et nisi. Vestibulum porttitor interdum nisl, in tempor libero accumsan sit amet.

 

Image - Left

Float and image to the left of it's surrounding content:

autumn pathwayLorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tempus tincidunt erat vitae ornare. Aenean sit amet bibendum eros. Fusce sit amet elit vestibulum augue luctus facilisis at et nisi. Vestibulum porttitor interdum nisl, in tempor libero accumsan sit amet.

 

Image - Center

Centers an image on it's own line:

autumn pathwayLorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam tempus tincidunt erat vitae ornare. Aenean sit amet bibendum eros. Fusce sit amet elit vestibulum augue luctus facilisis at et nisi. Vestibulum porttitor interdum nisl, in tempor libero accumsan sit amet.

These styles can be applied to a link to give it a button appearance. A button can provide a stronger call to action than a traditional text link.

Button - Blue 

Button - Blue

Use - applies a ÒùÐÔÊÓƵ blue button style to text 

Classes - .btn .btn-primary 

Button - Default 

Button - Default

Use - applies a standard gray button style to text 

Classes - .btn .btn-default 

Button - Green 

Button - Green

Use - applies a green button style to text 

Classes - .btn .btn-success 

Styles can be applied to tables to give them a cleaner appearance and make tabular data easier for a visitor to scan.

Table - Basic 

Use - creates a new basic table 

one two three four
red green blue yellow
small medium large extra large

Table – Striped 

Use - creates a new striped table 

one two three four
red green blue yellow
small medium large extra large

Table - Bordered 

Use - creates a new bordered table 

one two three four
red green blue yellow
small medium large extra large

Table - Bordered and Striped 

Use - creates a new striped and bordered table 

one two three four
red green blue yellow
small medium large extra large

Videos embedded using the default JustEdit editor are automatically set to be responsive and will be the width of their parent container (they will fill the width of the device/browser). The responsive behavior can be overridden by manually applying a class of non-responsive to the embedded video.