Writing Box · Step-by-step lesson
Writing Box: highlighted text boxes
Use numbered, icon and text-only boxes, choose colours and edit their content.
Before you start: Open a page or content item you can edit in the Admin Portal. These lessons demonstrate the existing Writing box controls.
How to use this lesson
Read the instruction, then look at the pointer on the example screen. Click or tap Next below when you are ready. The example screen is a demonstration. It cannot save, send or change anything.
“Select” means click once with a mouse, or tap once with a finger. You can go back, restart or take a break at any time.
Step 1 of 24
Open the page you want to edit
In the portal, select Pages, then click a page you can edit. The same Writing box is also used for News, Events, Emergency pages and Gateway content.
Look at the example. Then select Next when you are ready.
Step 1 of 24. Open the page you want to editWatch the pointer. Use the lesson’s Next button to continue.
Choose a different step
Read all instructions together
Open the page you want to edit
In the portal, select Pages, then click a page you can edit. The same Writing box is also used for News, Events, Emergency pages and Gateway content.
Find the Writing box
Scroll down to Writing box. This example already contains a sentence. Click inside the box to type your own content.
Position the text box
Click in the Writing box where the highlighted information should appear.
Select Add a text box
Click the square text-box icon in the toolbar.
Choose a box style
Numbered shows a number in a circle. With an icon shows a symbol. Text only has no circle. Each style uses the same editable content area.
Select “Number”
For Numbered, enter up to three letters or numbers for the circle.
Enter number
Type your own details here. In this example, we have entered “1”.
Select “With an icon”
Choose With an icon to use a symbol instead of a number.
Check the selection
“With an icon” is now selected in Style.
Select “Information”
Choose the symbol that suits your information.
Check the selection
“Information” is now selected in Icon.
Select “Green”
Choose a background colour for the box.
Check the selection
“Green” is now selected in Text box colour.
Select “Green”
Choose the circle colour. This choice is hidden for Text only boxes.
Check the selection
“Green” is now selected in Circle colour.
Add the box
Click Add text box. It appears at the position where you left the text cursor.
Select “Highlighted information”
Click inside the inserted box and replace its example text. You can also insert images inside it.
Enter highlighted information
Type your own details here. In this example, we have entered “The Community Hub is open for the coffee morning on Saturday.”.
Edit the box’s appearance
Click inside the box, then use Edit this text box in the toolbar. The setup opens again so you can change style, colours, number or icon.
Select “Text only”
Choose Text only to remove the circle while keeping the highlighted content.
Check the selection
“Text only” is now selected in Style.
Save the box settings
Click Save text box. This updates the box in the editor.
Remove a box if needed
The × control on a text box removes the whole box. Only use it if you no longer need that content.
Save the surrounding page
Click Save on the page form to keep your changes.