contentCloud editor | Edit texts

Last modified:

A text is a basic component of any template in contentCloud

Unlike other components, the text is set and edited using a text edition panel similar to that provided by Microsoft Office.

Image 235

These are the functionalities:

1. HTML source. - HTML source code editor.
2. Paste options. - Cut | Paste | Paste as plain text | Paste from Word | undo | redo
3. Spelling. - Activate Corrector
4. Text formatting - Bold | Italic |Tachado | underlined | subscript | superscript
5. Deleted format - Delete Format | Flat format (removes links and other formats).
6. Move the CKEditor editor to the position.
7. Alignment - Align left | Center | Align Right | Justified
8. Listings - Numbered list | Bulleted list
9. Sangria. Decrease Bleeding | Increase Bleeding | Quote
10. Add multimedia - Add Image in line with text | Insert Special Character | Add formulas with Wiris*.
*(Wiris is a mathematical formula editor. To be able to use it, it must be contracted additionally. For more information, contact the Netex sales team).
11. Color - Text color | Background color| No wrap**
** (forces the union between texts. For example "10 000 €", by applying "No wrap" we prevent it from separating if it is at the end of the line).
12. Style and Formatting - Apply normal style or various styles of headlines.
13. Classes - Apply special formats (depending on the template).
14. Links. - External Link| Resource Link| Pop-up Link
15. Tables. Create Table | Table Settings| Row | Column | Cell | Move | Add | Delete | Join Cells | Split Cells

This panel allows:

  • Paste texts
  • Delete text format
  • Include images inline in the text
  • Create links
  • Configure list
  • Create tables
  • Edit HTML source

Pasting texts from other locations

It is usual that, instead of writing the text, you copy the text from another source (eg, from Word, PowerPoint, Google Docs, etc.).

With the CTRL + V combination, you can paste the copied text, but it is not recommended since it keeps both the original formats (bold, italic ...), if not the typeface used, which causes problems with the styles of the template and the text will not behave correctly in environments of responsiveness (e.g. by reducing its size on certain devices).

To avoid it, paste the text into Maker using the combination of keys CTRL + SHIFT + V. The test will be paste as plain text, and you can edit it properly with Maker editor.

Image 16087

If it is usual that we have to copy many texts, it is recommended to use the Import units from Word functionality, which should restrict the typefaces and styles of the template and, in addition, will keep the relevant formats like bold, italic or listed.

Delete text format

If you have pasted text from Word, surely it bring unwanted formats. What can you do? Easy. Select the text and press the option Remove format. It will erase all the text formats, including bold and italics.

If you also want to delete other formats, such as listings or links, you use the option Without format.

Image 5115

Avoid widow text and orphan text in your content

Imagine that you want to write the number 10 000 but, as at end of line, is party. Avoid it with the "A_2" functionality. This option will allow you to unify the text in a single word, even if you have spaces in the middle. Thus, your data will never be separated or you will avoid orphaned at the end of line.

Image 5116

Image 5117

Add images online 

The text editor allows you to add images in line with the text. Thus, you can add small icons and images that appear in the middle of the content. Place the mouse in the text area where you want to add the image and press this option:

Image 15742

When doing so, an icon that you must configure will appear in the chosen space. Select it and access the "Properties" tab.

Image 15744

The three available properties are:

  • Link: Press "Examine" to locate the image you want to add in the resources folder of the unit.
  • Alternative text: Text that will be displayed if the image is not displayed. It will also be used by automatic text readers to facilitate accessibility for blind people.
  • Title: Text that will be displayed when the mouse is placed on the image.

Creating links

The text editor allows adding links to one or several words. To do this, click on the "Links" drop-down menu and select the type of link you want to generate:

  • External link. A link to a web site.
  • Resource link. It is very useful to link a word(s) with a resource, for example, a pdf document. We support files with the extensions pdf, zip, rar, 7z, ppt, pptx, pps, ppsx, doc, docx, xls, xlsx, odf, odt, odp and ods.
  • Glossary link. Option available and functional only on "Multi-página" and "Express" templates. It allows linking a word(s) with a specific word included in a glossary (a kind of pop-up).
  • Popup link. It allows linking a text with a pop-up. 

Image 242

Once a link type has been selected, we have to configure its properties from the properties tab in the components menu.

Image 243

Configure listings

1. Select the text that you want to make a list.
2. Select from a list of numbered or bulleted text.

Image 244

3. Right-click on the new list and click on "List properties".
4. In the properties you can modify:
      The starting number of the list (if the list is alphabetical, we will indicate the number of the letter, that is to say, if we put 3, the list will start in the letter C. If the list is alphabetical, we will indicate the number of the letter, that is to say, if we put 3, the list will start in the letter C.
     The type listed. If it is a numbered list you can choose between numeral, alphabetical or Roman numeration. If it is a list of bullets, you can select between three types of bullets.

Image 245

5. Additionally, you can create indented lists. To do this:

a. Create a list. Then, select the text with all the options you want to indent.

b. Press the button to increase indentation. The list will be created.

c. As a recommendation, change the type of listing to bullet format.

Image 247

Additionally, in the Text Properties area, you have two specific properties associated with the listings:
- Numbered list style:
Select from several styles: normal, bold or italic. Only applies to the numeral type list
- List color:
Apply the color you choose to the bullets or numbers in the list.

Image 15746

Configure Tables

Some templates have a specific "Table" component, which gives us presets of different types of tables, saving us editing time.

Anyway, we can create tables from scratch inside the texts. To do this:

1. Press the editor button.
2. Indicate if you want the table to occupy 100% of the available width and if you want it to have a header.
3. Select the number of rows and columns it should have.

Image 249

4. When you create a table, the table editing bar is activated in the editor:

    Image 250

    a. Properties - Modify the properties and formats of the table, row, column or cell.

    b. Move - Move row up or down | Move column right or left

    c. Add Rows and Columns - Add Row Up or Down | Add Column Right or Left | Add Cell Right or Left

    d. Add Cells - Add cell on the left| Add cell on the right

    e. Delete - Delete column, row or cell

    f. Join - Join cells horizontally or vertically

    g. Split - Split cells horizontally or vertically

    5. The table, its rows, its columns and its cells have their specific properties, but they all share the same behavior:

    Image 251

    h. Fast styles. It allows you to quickly add basic styles such as background color, border, text alignment, etc.

    i. Create your own styles. With the "Add" button, you can set custom styles using css.

    j. Modify styles. Once added a style, we can modify it (for example, in the upper case we could change the thickness of the border, from 1px to 2px).

    Editing HTML source

    To access the source code and to perform changes directly such as pasting code or adding a new code, click on "Source".

    Image 252

    It is recommended to avoid overusing this functionality for not interfering with the template development by adding codes or CSS.

    However, it is useful for:

    • Copying and pasting the table code that we have created in other texts, especially if they are tables with specific formats (color, configuration...).
    • Adding a video embed code hosted in a streaming server (for example, YouTube).

    The possibility of including HTML code directly on the content can help the author to include certain resources as tables or a YouTube link, but it has also its limitations to guarantee the responsive correct behavior of the content.

    Is this article helpful for you?
    © 2023 Netex Knowledge Factory. All Rights Reserved. Disclaimer | Privacy policy | Cookie Policy.