Which HTML Codes are useful for Editing in Yonder? (Advanced Users)
It is possible, for those Editors who have advanced knowledge of Yonder and the document editing function, to use the “Code view" to make additional edits of module content. The “Code view"icon can be seen in the editing menu:
Clicking on the “Code view" icon will present the Editor with access to the HTML code of the information module:
The following table shows some commonly used HTML code, which can be used in the HTML code you can access through the “Code View” of Yonder. Please feel free to copy any of the text below and paste into the Yonder Information Module as required.
To create a page break in the PDF Export before an item: |
<p style="page-break-before: always">paragraph with break before</p> |
To insert a page break in the PDF Export after an item: |
<p style="page-break-after: always">paragraph with break after</p> |
To rotate text, an image, table in the PDF : |
<div class="rotated"> Image, table or paragraph</div> (please note the code will only rotate the text, image or table in the PDF and not in Yonder) |
Dynamic content “List of Changes” table code: |
CR:type:Type, CR:CHANGE_REQUEST_LABEL:CR Label, CR:CHANGE_REQUEST_SUMMARY:CR Summary, The above code is inserted in the code of the dynamic content “List of Changes” once the dynamic snippet has been inserted. It is possible to customise the table columns shown by deleting some of the code. The following list shows which part of the code corresponds to which column in the screenshot below:
 In the example above, two of the column titles have been amended, “Module Number” changed to "Section of Manual" and “CR” changed to “CR Category”. This is achieved by changing the code at the parts of the code shown in bold below:
Deleting part of the code will control which columns are shown in the dynamic content table. In the example below the code “CR:CHANGE_REQUEST_LABEL:CR Label, (Column 2)”, “Change:reason:Change Reason, (Column 6)” have been removed, so the columns do not show in the table:  The resulting code inserted in the code view would be - "CR:type:Type, CR:CHANGE_REQUEST_SUMMARY:CR Summary, |
To start a list at a particular letter or number: |
Sometimes it is necessary to set an ordered list to start with something other than the usual “1” or "A" or “a”. This is possible in Yonder by accessing the module content "Code View", and making a change to the code. In the following example the list should start with the upper letter “C”. (The code to be changed is shown in red) <ol start="3" style="list-style-type: upper-alpha;"> In the case above, to set the list to start at “C”, you should set the number shown in between the inverted commas after the word “start=”3" which is the respective letter of the alphabet in this case 3=c. (ie. a=1, b=2, C=3, etc) In addition: the code for the list style to be shown in the example is for uppercase roman letters, therefore, we use “upper-alpha;” Other useful list styles which can be used are:
|