Handling the source code in the RTE
Editing the source code within the rich text editor (RTE) is for troubleshooting only in the rare case that the text you insert should be different than expected in the front end. There should be no reason to insert your own code under normal circumstances.
View source code
- Within the rich text editor, you can view the HTML source code.
- After clicking on the Source button you will see the source code within the editor
- All other functions of the RTE are not available until you click on the Source button again.
HTML soft hyphen ­
There is the normal hyphen, and then there is the (soft hyphen) ­. This separator is invisible and indicates where a line break may occur, causing a predetermined breaking point.
This is especially relevant for mobile devices and in tables. If a line (depending on the device) in the front end is wrapped on a soft separator, a hyphen will appear at the end of the first line. If no break occurs, no hyphen will be displayed.
Note: After saving, the ­ element will no longer be visible in the source code. Therefore, if you aren’t sure where you placed a soft hyphen, it is best to overwrite the entire word and set each ­ again.
HTML no-break spaces
If you want to avoid a line break for names, brands or indications such as »80 Euro« or »30 km/h«, etc., use the non-breaking space.
If you enter more than one space between two words, or if you enter a space at the beginning or end of a paragraph, TYPO3 uses the same HTML tag. To change this, switch to the HTML source code (see above) and replace the string with a single space.
HTML break <br />
If you want a line break to appear within a paragraph in the body text (or in a table cell) at a specific point, use the HTML tag <br /> and force a break at the desired location.
The text will continue on the next line without spacing. Unlike the <p> tag, which you can also see in the screenshots of the back end.
Conditional line break without hyphen <wbr />
If you want to separate a word within an element due to its length without using a hyphen, use the HTML tag <wbr/>. To force the line break, click the break icon in the RTE at the desired position in the word.
This option is especially relevant when looking at mobile devices. If a word (depending on the device) is wrapped at a certain point in the frontent, no hyphen is displayed. If there is no break, the word is displayed in its entirety.