Editor

In Synergia Foxy, the content editing can be done with easy-to-use inline-editor. The editor can be opened by selecting text, or by clicking right mouse button. 

With mobile devices, the editor is stripped and can be found above the content.

Editor functions

This is an image of the editor. We will go trough functionalities below. The editing of links and images can be found on their own pages.

Line break

By default, ENTER will add a new paragraph. If you need a line break, press SHIFT + ENTER.

Never use a line break for hyphenating. Even though it might look good on a large screen, it might not on a smaller screen.

Formatting

You can choose a formatting for selected text. The available formattings are Paragraph, Header 1, Header 2, Header 3 and Header 4.

Headers are different by size and by value. It is recommended to use different header types to make content accessible.

Use the headers semantically. A page should contain only one Header 1 -tag. Try to avoid 'jumping' over headers, use Header 3 after Header 2 (instead of Header 4).

Bold

You can make the selected text bold with this button. You can also use shortcut (Windows CTRL + b).

Italic

You can make selected text italic with this button. You can also use shortcut (Windows CTRL + i).

Underline

You can underline selected text with this button. You can also use shortcut (Windows CTRL + u).

Common use for underline is highlighting links. Therefore, use this function carefully.

Striketrough

You can add a strike-trough to selected text with this button.

Subscript

You can change the selected text to subscript with this button.

This selection is either on/off. If you want to remove subscript, you'll have to press the button again.

Superscript

You can change the selected text to superscript with this button.

This selection is either on/off. If you want to remove superscript, you'll have to press the button again.

Paragraph Style

With this button, you can add a different style for the selected block. There are some basic styles available.

This selection is either on/off. If you want to remove style, you'll have to press the button again.

Line Height

You can change the line height of selected block. Default is 1.

Text Colour

You can change the text colour with this button. Use colours carefully, as the user might mistake coloured text as a link.

This selection is either on/off. If you want to remove colour, you'll have to press the button again.

Align

You can align the block as you want.

Lists

You should use lists, as they make the content more accessible.

Unordered list

You can create an unordered list with this button (ul).

Ordered list

You can create an ordered list with this button (ol).

Increase Indent

You can increase list indent with this button.

Decrease Indent

You can decrease list indent with this button.

When clicking ENTER inside a list, a new list element is created. If you press ENTER twice, the current level will be exited.

Horizontal Line

You can add a horizontal line with this button. Especially on long pages, they make the content more accessible.

Quote

You can change the selected text to Quote. You can add or decrease the quote level, but this usually looks the best, with only one Add. In addition to quotes, you can use this style as a highlight.

All the tips on this page are made with quote.

Special Characters

You can insert the most common special characters with this button.

Font Awesome

With this button, you can insert Font Awesome -icons.

Emoticons

With this button, you can add emoticons (   ).

Insert Link

You can insert link with this button. Read more about links »

Insert Table

Try to avoid tables. They require so much horizontal space that they will not fit in mobile screens. If you need to show a table, you might consider linking it as a PDF -file.

You can add a table with this button. Choose the amount of rows and colums. You can add these later.

When you press a column with left mouse button, a separate toolbar will appear.

Table Header

You can add a table header (th) with this button. It will be inserted as the first row of the table.

Remove Table

You can remove the whole table with this button.

Row

You can add or remove rows with this button.

Column

You can add or remove columns whit this button.

Cell Background

You can set the background colour of the cell with this button. If you want to remove the colour, use Clear Formatting -button.

Vertical Align

You can choose the column's vertical align with this button.

Horizontal Align

You can choose the column's horizontal align with this button.

Insert Image

You can insert an image with this button. Read more about images »

Insert Video

With this button, you can embed a video from Youtube. You can enter the URL, or enter the entire embed -code. The videos will be responsive automatically.

By default, Youtube adds recommended videos after playing. If you want to remove these, add ?rel=0 to the end of src -attribute in embed code.

Import File

With this button, you can convert a file to valid HTML. This button is an alternative for copy-pasting. It will preserve the most important formattings and images from eg. Word -file. Read more about file importing »

This functionality is not meant for importing PDF -files. If you want to import PDF, just link it.

Undo

You can undo your actions within current editor. You can also use shortcut (Windows CTRL + z). If the button is grey, no changes have been made.

Once you save the content, this functionality is nullified. 

Redo

You can redo your actions within current editor. You can also use shortcut (Windows CTRL + SHIFT + z). If the button is grey, no changes have been undoed.

Remove Formatting

With  this button you can remove formatting of the selected text. It will remove colour, bold, italic etc.

Select All

With this function, you can select all content inside current editor.

Code View

With this button, you can edit HTML -code directly. It is meant for advanced users who wish to do something the basic editor functionalities cannot accomplish.