top of page

43. The Rich Text Editor Toolbar Part 1

Updated: Feb 19

The rich text toolbar, displayed below, is available to use with a rich text box and provides functionality for the HTML environment.




The multi line text editor toolbar uses a cut down version of this editor. Hover over an icon and a label will appear to tell you what the icon is. The Ctrl key and relevant letter on the keyboard can be used to activate some of the controls exactly the same as you would use in MS Word.


For example: Ctrl+C for copy, Ctrl+V for paste and Ctrl+Z for undo.



The common commands you will use are as follows:

- highlight text to make formatting changes B – to bold , I to turn to italic or U for underline.  Select the letter to either add or remove the formatting type. You can also use the common keyboard commands that you would use in MS Word such as Ctrl+B, Ctrl+I or Ctrl+U. The ABC enables you to strike through the text.


- enables you to position text in the document to the left, right, centre or justfied.


- select the heading style you wish to use if required, these have all been predefined for you. The heading styles and paragraph are Calibri. You can manually select font family and font size from the drop down if you wish.


- the cut, copy and paste icons enable you to add or remove text into the rich text box from external documents or sources.


- the paste as plain text icon is used when copying text from MS Word. This is because MS Word has its own markup language which does not match exactly with HTML. When copying text from MS Word the rich text editor does its best to convert from word to HTML, however it is not perfect since the two do not match up exactly. The paste as plain text option will remove the word formatting and allow the user to have more control with formatting.


- provides the options to create or remove a bulleted or numbered list. When you remove these a space will be entered between each line of text . If you wish to remove these spaces place your cursor in front of the first letter of the word you wish to move and select your backspace key. The word will be inline with the word previously above, now select Shift+Enter. The word will be placed back on the line immediatley below with no bullets and the space is removed.Alternatively, if you are familiar with HTML you can view the code and make your changes there. (See  explanation further on in this section).


- enables you to change the colour of the font by highlighting the text and selecting the drop dowm menu to pick your colour.


- enables you to highlight the background of the text, this is particulary useful if you want to note where you have made changes in a document so the author or readers can see what you have amended in the text.  UniPhi does not have a track changes option.


- Used to insert a picture and enables you to select the image you want to insert. This can be used for inserting a photo into CV or logos etc . The best method is to create a table and insert the graphic into one cell, that way you can control the positioning.



- The first icon inserts a table into a rich text box and you can enter the number of rows and columns required.


The middle icon displays the table properties and where you modify the amount of rows and columns and set width and height properties. (Table width is suggested to be fixed to 650 pixels so when document is rendered to PDF it will fit on an A4 page. Creating tables will be outlined in greater detail further on).

 

The last icon is the cell properties. It is suggested that you modify the cell/column using pixels with a total of all columns across the table equalling the table wide, usually the suggested 650 pixels. For example a table with 5 columns may have a width of 130 pixels each, if you change one of the cells in a column you will need to update the remaining columns to maintain the table width


- Inserts a column in a table to the right or left or the last icon deletes a column. Place the cursor in the column you wish to insert next to or delete and select the relevant icon.



- Inserts a row in a table below or above the row you are in. Place the the cursor in the row you wish to insert a new row above or below  or delete and select the relevent icon.


- redo/undo the last action(s) done. You can also use Ctrl+Z to undo or Ctrl+Y to redo.


- select this icon to access the HTML code for the step. If you are familiar with HTML you may find it easier to use the HTML view and make changes to the code to create your information, amend formatting.


- enables you to view the full screen for the step you are in.



- enables you to indent text to the right or outdent to the left. You can use this method as well to remove bullets or numbers by selecting all the relevant text and then outdenting until gone.



Comments


bottom of page