We recommend using the Advanced Editor Tools (TinyMCE Advanced) plugin to control options on the toolbar for publishers. Default options can lead publishers into bad habits!
The editor toolbar sits above the main content box when you add or edit a page, task, news story or any other content. It has a menu bar and two rows of buttons. The most used buttons are on the first row. Less used buttons, such as alignment and italics, are on the second row.
What is on the editor toolbar
Menu bar: File, Edit, View, Insert, Format, Tools and Table. Every toolbar button is also in one of these menus, along with some extra options.
First row of buttons, left to right: the paragraph and heading menu, bold, blockquote, clear formatting, paste as text, bulleted list, numbered list, insert or edit link, remove link, undo, redo, Toolbar Toggle, the Govintra shortcode button and the TablePress button. The fullscreen button is at the far right.
Second row of buttons, left to right: align left, align centre, align right, italic, decrease indent, increase indent, special character, emoticons, anchor, and find and replace.
Hold the mouse pointer over any button to see its name.
Show the second row of toolbar buttons
If you can only see one row of buttons, select the Toolbar Toggle button on the first row. It looks like a small keyboard. The second row appears, and WordPress remembers your choice.
Visual and Text tabs
The editor has two tabs at its top right corner.
- Visual shows your content roughly as staff will see it. Work in the Visual tab.
- Text shows the HTML code behind the content. You only need the Text tab for a few jobs, such as pasting embed code for a video.
If the toolbar buttons have disappeared and you can see code such as <strong> in your content, you are in the Text tab. Select Visual to go back.
Add headings
Put the cursor in the line of text, then choose a heading from the first menu on the toolbar, which normally says Paragraph.
- The menu offers Heading 2, Heading 3, Heading 4 and Heading 5. There is no Heading 1, because the page title is already Heading 1.
- Use Heading 2 for main sections and Heading 3 for sections inside them. Do not skip a level.
- Do not use bold text as a heading. Screen reader users navigate by real headings, and some page templates build a contents list from them.
Paste text from Word, email or another website
Text copied from Word, Outlook or a web page brings hidden formatting with it. This can show up as odd fonts, colours and spacing, or as stray formatting code on the published page.
- Select Paste as text on the first row. It looks like a clipboard with a letter T. WordPress tells you that pasting is now in plain text mode.
- Paste your text. It arrives as plain paragraphs.
- Add headings, lists and links using the toolbar.
- Select Paste as text again to switch plain text mode off.
You can also paste as plain text with the keyboard: Ctrl + Shift + V on Windows, or Command + Shift + V on a Mac.
Remove unwanted formatting
If text has already been pasted with unwanted formatting, select the text and then select Clear formatting on the first row. The button looks like an eraser. Clear formatting removes bold, italic, colours and fonts. It does not remove headings, lists or links.
If stray code is still showing, delete that block of text and paste it again using Paste as text.
Lists
Select Bulleted list or Numbered list. Use a numbered list for steps that must be done in order. The small arrow beside each list button changes the style of bullet or number. Use Increase indent on the second row to make a list inside a list.
Line breaks and spacing
Press Enter to start a new paragraph. Press Shift + Enter to start a new line inside the same paragraph, for example in an address. Do not press Enter several times to create space: empty paragraphs are read out by screen readers and look uneven on phones.
Alignment, italics and colour
Alignment and italic are on the second row because content rarely needs them. Leave text aligned left: centred and right aligned paragraphs are harder to read. Use italics sparingly, as long passages in italics are hard to read on screen.
Do not change text colours. Coloured text can fail colour contrast rules, does not adapt to dark mode and does not match the rest of the intranet. If the Govintra accessibility checks are switched on, WordPress warns you about hard-coded colours when you save.
Start a heading or paragraph below an image
When text wraps beside a left or right aligned image, you may want the next heading to begin underneath the image instead. Put the cursor in that heading or paragraph, open the Format menu, choose Formats, then Clear float (start below image).
Special characters, emoticons, and find and replace
- Special character, the omega symbol, inserts characters such as £, €, é and ©.
- Emoticons inserts a small face. Use them rarely, and never in place of words.
- Find and replace, the binoculars, searches the content you are editing and can replace a word throughout.
Anchor button
The Anchor button, which looks like a bookmark, adds an invisible marker that links can jump to. See Add links to pages, documents and email addresses.
Govintra shortcode button
The button with angle brackets and a small arrow, near the end of the first row, opens a list of Govintra shortcodes. These include lists of documents, lists of posts, card grids and accordions that expand and collapse. Choose one, fill in the options and the shortcode is added where your cursor is. See Find out what shortcodes are available.
Tables
For a small, simple table, use the Table menu, then Table, and drag across the grid to choose the number of columns and rows. Make the first row a header row: select the cells in the first row, then choose Table, Cell, Table cell properties and set Cell type to Header cell. Screen readers need header cells to make sense of a table.
For larger tables, or tables you will reuse or update, use TablePress. See Create a new accessible table and Insert a table into a page.
Do not use a table to lay out a page in columns.
If your editor has no menu bar
A few intranets use the standard WordPress toolbar, without the Advanced Editor Tools plugin. There is no menu bar, and the buttons are in a different order: italic and the alignment buttons are on the first row, and paste as text, clear formatting and the indent buttons are on the second row. The buttons do the same jobs. There is no anchor button, table menu or find and replace.
Useful keyboard shortcuts
- Bold: Ctrl + B (Command + B on a Mac)
- Insert or edit a link: Ctrl + K (Command + K)
- Undo: Ctrl + Z (Command + Z)
- Heading 2: Shift + Alt + 2 (Control + Option + 2)