The WYSIWYG bar (officially known as the CKEditor) appears across most text fields in the admin end of Citizen Space. It can be used throughout a consultation build to help you provide the respondents with information and different ways of presenting that information. This is a basic guide through the features of this toolbar and will offer resources to show you how to best take advantage of these.
The first three options on the WYSIWYG bar will be familiar to most, allowing you to bold, italicise or underline text. Once you've finished typing, simply highlight the text you wish to alter and use the buttons to apply the relevant format.
Structuring and Highlighting Information
The next three buttons provide ways to improve delivery of information in a consultation. All of these are best used before entering your content but can be used after if necessary. If used before they will create the correlating structure for you to type your content within or they can be used to highlight paragraphs already entered and put them within the any of these formats.
The first option on this section of the toolbar helps you create a numbered list within Citizen Space.
It is preferable to use this function prior to typing or pasting text as once you have content entered you can only add this format to full paragraphs and would have to seperate out individual points manually using the enter/return key.
Next is the bullet point icon, which is a good way to make the content of your consultation easier for respondents to digest. They are particularly useful for getting small pieces of information across quickly:
This operates in exactly the same manner as a numbered list, so you would use the enter/return key to manually organise content into separate bullet points if you were using this on text you've already entered.
The last option on this part of the toolbar allows you to block quote text which is another way to draw attention to information you'd like respondents to read or highlight a relevant quote.
Using this function after entering text will always apply it to whichever paragraphs are highlighted. If you want to block quote a smaller section of text, separate this into its own paragraph and then use this function.
These buttons are for adding or removing a link to a web page, document or email contact from text in your consultation.
Using hyperlinks can be a good way to direct respondents to information without adding it directly into your consultation. The managing hyperlinks guide will take you through how to use this feature step by step.
The next group of buttons on the WYSIWYG bar are for embedding media into your consultation.
The first button allows you to embed images. This can help break up chunks of text and keep a respondent engaged in the information you're providing. For accessibility reasons, users should alway include alternative text when embedding images. There is a detailed guide on how to use this feature, including how to add alternative text, already available on the Delib knowledge base.
Next is embedding PDF documents, which is explained in this article. Adding PDFs, particularly when set up to open on an appropriate section or page, can allow respondents to be better informed on the topic of the consultation which can result in higher quality responses.
Lastly is embedding rich media such as videos, maps or slideshows. Adding this type of interactive media to your consultation is another great way to keep your respondent's interest and present information in a more appealing format. This article will guide you through the process of embedding these different media types.
Editing Source Code
The last feature of the WYSIWYG bar is the source button. This allows you to edit the HTML source code of a text field. Only use this feature if you're confident editing and creating code as it can create unintended consequences otherwise! If you do use this to change the format or appearance of any text, make sure that accessibility is considered before finalising any changes.
Hopefully this guide has helped you feel confident using the features of the WYSIWYG bar to make your consultation content as well structured and engaging as possible.