Examples
![Example WYSIWYG](https://informamarketdocs.bitbucket.io/images/v2/text/dialog.png)
Authoring
Paragraph Format
![Paragraph Formats](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/paragraphformats.png)
Used to apply paragraph formatting to the selected text or to text inserted after the cursor. Selecting this options opens a dropdown from which the paragraph format is selected.
Bold
![Bold](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/bold.png)
Used to apply bold formatting to selected text or boldly format text entered after the cursor. Ctrl+B can be used as a keyboard shortcut.
Italic
![Italic](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/italic.png)
Used to apply italicized formatting to selected text or italicize text entered after the cursor. Ctrl+I can be used as a keyboard shortcut.
Underline
![Underline](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/underline.png)
Used to apply underlined formatting to selected text or underline text entered after the cursor. Ctrl+U can be used as a keyboard shortcut.
Subscript
![Subscript](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/subscript.png)
Used to format selected text or text entered after the cursor as subscript.
Superscript
![Superscript](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/superscript.png)
Used to format selected text or text entered after the cursor as superscript.
Paste as Text
![Paste as Text](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/pasteastext.png)
Pastes any copied text as plain text without any formatting. When selecting this option a window opens where the text can be pasted as plain text with no formatting as a preview before it is inserted into the text. Accept by tapping or clicking the check mark, cancel by tapping or clicking the x. ![Paste as Text](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/paste.png)
Paste from Word
![Paste from word](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/pastefromword.png)
When selecting this option a window opens where the text can be pasted maintaining its formatting as a preview before it is inserted into the text. Accept by tapping or clicking the check mark, cancel by tapping or clicking the x. ![Paste from word](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/paste2.png)
Hyperlink
![Link](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/link.png)
Use this option to convert the selected text into a hyperlink or modify an already defined link. This option is only active when text is already selected and opens a window with additional options for setting the link.
![Hyperlink](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/hyperlink.png)
- Enter the location
- Use the Open Selection Dialog to choose a path in AEM
- If the link is not within AEM, enter the absolute URL (non-absolute paths are interpreted as relative to AEM)
- Enter alternative descriptive text for the link
- Select link behavior
- Target
- Same Tab
- New Tab
- Parent Frame
- Top Frame
Tap or click the check mark to apply the link or the x to cancel.
Unlink
![Unlink](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/unlink.png)
Use this option to remove a link already applied to the selected text. This option is only active when a link is already selected.
Anchor Link
Use this to link to a place within a page. The # in front of a link means it is pointing to an anchor on a page.
Basic Steps
- Decide where you want to place the anchor
- Click the anchor icon and type in the anchor name
- Create a link to the anchor. For example, #anchor-name
In Edit (fullscreen)
![Anchor Link](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/anchor-link-a.png)
In Configure Dialog Box
The same basic steps apply for this one.
![Anchor Link](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/anchor-link-2.png)
Find
![Find](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/find.png)
Use this option to search the text for occurrence of a specified text string. Selecting this option opens a window for specifying the search options. ![Find](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/findoptions.png)
Enter the text for which you want to search and tap or click Find to begin the search. Tap or click the x to cancel. If you wish to do an exact match according to the case, select the option Match Case before starting the search. If a match is found, it is highlighted and the search dialog is dimmed. Tap or click the Find button again in the dimmed dialog to search for the next occurrence.
![Find](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/findresults.png)
If no additional occurrences are found, a message will be displayed and the search will restart from the beginning of the text.
![Find](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/findnoresults.png)
Replace
![Replace](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/replace.png)
Use this option to search the text for occurrences of a specified text string and replace the matches with another string. Selecting this option opens a window for specifying the search and replace options.
![Replace Options](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/replaceoptions.png)
Enter the text for which you want to search as well as the text with which it should be replaced. Tap or click Find to begin the search. Click or tap the x to cancel. If you wish to do an exact match according to the case, select the option Match Case before starting the search. If a match is found, it is highlighted and the search dialog is dimmed. Click the Find button again in the dimmed dialog to search for the next occurrence or select the Replace button to replace the highlighted, matched text. Note that the Replace button is only active once a match is made. Select Replace all to replace all occurrences of the text at once.
Align Text Left
![Align Left](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/alignleft.png)
Used to align the text to the left margin.
Center Text
![Align Center](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/aligncenter.png)
Used to center the text.
Align Text Right
![Align Right](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/alignright.png)
Used to align the text to the right margin.
Bullet
![Bullet](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/bullet.png)
Used to format the selected text as a bulleted list or begin the insertion of a bulleted list after the cursor. To end a bulleted list, tap or click the Bullet button again or enter two carriage returns.
Numbered
![Numbered](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/numbered.png)
Used to format the selected text as a numbered list or begin the insertion of a numbered list after the cursor. To end a numbered list, tap or click the Numbered button again or enter two carriage returns.
Outdent
![Outdent](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/outdent.png)
Used to decrease the indentation level of the selected text or text entered after the cursor. Only active if the selected text or position of the cursor is already indented.
Indent
![Indent](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/indent.png)
Used to increase the indentation level of the selected text or text entered after the cursor.
Table
![Table](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/table.png)
Used to insert a table into the text. Selecting this option opens a window for specifying the details of the table.
![Table Options](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/tableoptions.png)
- Columns The number of columns of the table (required)
- Rows The number of rows of the table (required)
- Width The width of the table
- Height The height of the table
- Cell padding The space around the cell content
- Cell spacing The space between cells
- Border The weight of the border lines of the table
- If for the header of the table:
- The first row should be used
- The first column should be used
- The first row and first column should be used
- Or no header should be used.
- Caption The caption of the table
Check Spelling
![Check Spelling](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/spellcheck.png)
Used to check the spelling of the text content. Possible misspellings are underlined with broken, red lines.
Special Characters
![Special Characters](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/specialchars.png)
Used to insert special characters into the text. Selecting this option opens a window where the available characters are displayed.
![Special Characters Options](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/specialcharsoptions.png)
Tap or click the desired character to insert it into the text after the cursor. Multiple characters can be inserted. Tap or click the x to close the selection window.
Source Edit
![Source Edit](https://informamarketdocs.bitbucket.io/images/v2/wysiwyg/source.png)
Used to view and modify the HTML source of the text. Tap or click the Source Edit icon to change the content of the text from the formatted view to view the raw HTML. In this mode, all other formatting options are disabled. Tap or click the Source Edit icon again to return to the formatted view.
Caution
As always the case with access to raw HTML, care must be exercised when using the Source Edit option! HTML entered via Source Edit is scanned for XSS risks and any scripts that are inserted are removed and will not appear on the resulting page. However malformed HTML entered in Source Edit can break the template for the page resulting in unexpected formatting or rendering the resulting page unusable.
Note
Because HTML entered via Source Edit is scanned for XSS risks and any scripts and automatically removes those found, the actual content persisted may vary from what was entered in Source Edit. For this reason, in order to save changes made using Source Edit, you must first exit Source Edit to view the text in the normal editor before saving.