Skip to Content

Wiki source code of Symbole und Menüfunktionen

Last modified by Moritz Baumgarten on 15.01.2024
Show last authors
1 {{layout}}
2 {{layout-section ac:type="single"}}
3 {{layout-cell}}
4 == Icons in the text editor ==
5
6
7
8 The text editor allows you to format text as you wish and to add links and images. All formatting icons are listed below: 
9
10 (% class="wrapped" %)
11 |(((
12 (% class="content-wrapper" %)
13 (((
14 [[image:attach:icon_Darstellungsoptionen.png||data-xwiki-image-style="img-icon"]]
15 )))
16 )))|(((
17 Customise how individual words or sections are presented
18
19 * **Bold**
20 * //Italic//
21 * __Underlined__
22
23 * Text colour
24 * Background colour
25
26 More options can be found in the main menu under **Format**.
27 )))
28 |(((
29 (% class="content-wrapper" %)
30 (((
31 [[image:attach:icon_Ausrichtungsoptionen.png]]
32 )))
33 )))|(((
34 Alignment, bullet list, and indentation
35
36 * Align left
37 * Align center
38 * Align right
39
40 * Bullt list
41 * Numbered list
42
43 * Increase indent
44 * Decrease indent
45 )))
46 |(((
47 (% class="content-wrapper" %)
48 (((
49 [[image:attach:icon_Linkoptionen.png]]
50 )))
51 )))|(((
52 * [[Insert or edit link>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Weitere Funktionen.Texteditor.Link einfügen oder bearbeiten.WebHome||shape="rect"]]
53 * Remove link
54
55 * Insert or edit image
56 * Source code
57 )))
58 {{/layout-cell}}
59 {{/layout-section}}
60
61 {{layout-section ac:type="single"}}
62 {{layout-cell}}
63
64 {{/layout-cell}}
65 {{/layout-section}}
66
67 {{layout-section ac:type="single"}}
68 {{layout-cell}}
69 == Main menu ==
70
71
72 * [[Edit>>doc:||anchor="bearbeiten"]]
73 * [[Insert>>doc:||anchor="einfügen"]]
74 * [[Format>>doc:||anchor="format"]]
75 * [[View>>doc:||anchor="ansicht"]]
76 * [[Table>>doc:||anchor="tabelle"]]
77 * [[Tools>>doc:||anchor="werkzeuge"]]
78 {{/layout-cell}}
79 {{/layout-section}}
80
81 {{layout-section ac:type="single"}}
82 {{layout-cell}}
83
84 {{/layout-cell}}
85 {{/layout-section}}
86
87 {{layout-section ac:type="single"}}
88 {{layout-cell}}
89 === ===
90
91 {{id name="bearbeiten"/}}EditUnder the **Edit **menu item, you will find the following functions: 
92
93 * Undo
94 * Redo
95 * Cut
96 * Copy
97 * Paste
98 * Paste as test
99 * Select all
100 * Find and replace
101
102 {{info}}
103 The keyboard shortcuts for the functions are the same as in other word processing programmes (e. g. CTRL + C for copy).
104 {{/info}}
105 {{/layout-cell}}
106 {{/layout-section}}
107
108 {{layout-section ac:type="single"}}
109 {{layout-cell}}
110 === ===
111
112 {{id name="einfügen"/}}InsertThe **Insert **menu item (% style="color:#333333" %)allows you to insert images, characters, anchors, and date/time.
113
114 (% class="wrapped" %)
115 |=(((
116 Insert/edit image
117 )))|(((
118 You can insert the desired image as a URL or upload an image from your computer's hard disk via image management (only for selected course elements). It is also possible to add an image description and adjust the dimensions of the image.
119 )))
120 |=(% colspan="1" %)(% colspan="1" %)
121 (((
122 Insert/edit video
123 )))|(% colspan="1" %)(% colspan="1" %)
124 (((
125 You can insert the desired media as a URL or upload them from your computer's hard disk via media management. We recommend the mp3 and mp4 media formats. For more detailed information, refer to the [[Include video>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Weitere Funktionen.Texteditor.Video einbinden.WebHome||shape="rect"]] help page.
126
127 By using this function, you can also embed **other content that is available via URL**. Besides **videos**, **VR content such as 3D models** can also be displayed with an embedding code. You can find a description of this on the page [[Embed VR-content>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Kursbausteine.Einzelne Seite.KB Einzelne Seite Einsatzbeispiele.Anwendungsbeispiel\: Datei mit VR-Inhalt einbinden.WebHome]]. A further application example shows the **embedding of PDF content**. Information on this can be found on the page [[Embed external PDF file>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Kursbausteine.Einzelne Seite.KB Einzelne Seite Einsatzbeispiele.Anwendungsbeispiel\: Externe Pdf-Datei einbetten.WebHome]].
128 )))
129 |=(((
130 Non-breaking spaces
131 )))|(((
132 Non-breaking spaces are space characters that prevent an unwanted automatic line break at their position. As a result, your text will not be broken.
133 )))
134 |=(((
135 Special characters
136 )))|(((
137 Under the **Special characters** menu item, you will find a table with characters, including for example Greek letters and symbols such as currency symbols, which can be inserted.
138 )))
139 |=(((
140 Anchors
141 )))|(((
142 Anchors allow you to jump to a specific passage without scrolling. All you need to do is insert the anchor at the desired location. Give the anchor a unique name. Then place a link at the starting point in the text. To do so, mark a suitable location within the text and use the **Insert link** function. Select your anchor under the **Anchors **menu item and confirm your choice with **OK**.
143 )))
144 |=(((
145 Date/time
146 )))|(((
147 You can select and insert the current date or time. This information is available in German and English.
148 )))
149 {{/layout-cell}}
150 {{/layout-section}}
151
152 {{layout-section ac:type="single"}}
153 {{layout-cell}}
154
155 {{/layout-cell}}
156 {{/layout-section}}
157
158 {{layout-section ac:type="single"}}
159 {{layout-cell}}
160 === ===
161
162 {{id name="format"/}}FormatThe **Format **tab offers various options to design your content. For example, you can make the text **bold**, **italic**,** underlined **and **strikethrough**, put characters in **subscript **and **superscript**, choose from different** headings**, apply **character **and **paragraph styles** , and determine the **alignment **of your text. 
163
164 You can highlight selected words or text sections with background colours by selecting one of the **Messages **from the list.
165
166 Individual functions such as those under **Inline **or **Alignment **can also be found as an icon below the main menu. 
167
168 [[image:attach:Kursrun - Format - Überschriften_en.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]
169
170 {{info title="Clear formatting"}}
171 To clear your formatting, proceed as follows:
172
173 1. Mark the text whose formatting you wish to clear.
174 1. Click on **Format** in the main menu.
175 1. Select the **Clear formatting **menu item.
176 1. The formatting of the marked area is reset.
177 {{/info}}
178 {{/layout-cell}}
179 {{/layout-section}}
180
181 {{layout-section ac:type="single"}}
182 {{layout-cell}}
183
184 {{/layout-cell}}
185 {{/layout-section}}
186
187 {{layout-section ac:type="single"}}
188 {{layout-cell}}
189 === ===
190
191 {{id name="ansicht"/}}ViewWith the functions in the **View **menu item you can show symbols that are otherwise not visible in the standard mode. 
192
193 (% class="wrapped" %)
194 |=(((
195 Show blocks
196 )))|(((
197 This function shows formatting symbols such as line breaks.
198 )))
199 |=(((
200 Show invisible characters
201 )))|(((
202 This function shows formatting symbols within the text, e. g. non-breaking spaces.
203 )))
204 {{/layout-cell}}
205 {{/layout-section}}
206
207 {{layout-section ac:type="single"}}
208 {{layout-cell}}
209
210 {{/layout-cell}}
211 {{/layout-section}}
212
213 {{layout-section ac:type="single"}}
214 {{layout-cell}}
215 === ===
216
217 {{id name="tabelle"/}}Table
218
219 ==== (% style="color:#333333" %)Insert table(%%) ====
220
221 {{expand title="Insert table ..."}}
222 To insert a table, proceed as follows:
223
224 (% class="wrapped" %)
225 |(((
226 Open the **Table** menu item and click on** Table**.
227 )))|(% rowspan="2" %)(% rowspan="2" %)
228 (((
229 (% class="content-wrapper" %)
230 (((
231 [[image:attach:Kursrun - Tabelle anlegen_en.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]
232 )))
233 )))
234 |(((
235 A grid to define the table size opens. Select the desired number of columns and rows with one click.
236 )))
237 |(((
238 In the example, a table with 4 columns and 4 rows is created.
239 )))|(% rowspan="2" %)(% rowspan="2" %)
240 (((
241 (% class="content-wrapper" %)
242 (((
243 [[image:attach:Kursrun - Tabelle formatieren_en.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]
244 )))
245 )))
246 |(((
247 The table is inserted in the content. If you select a table cell by clicking on it, a context menu with further settings will appear. You can display the **table properties**, **delete the table**, **insert new rows** and **columns**, or **delete** them.
248 )))
249 {{/expand}}
250
251 ==== (% style="color:#333333" %)Table properties(%%) ====
252
253
254
255 Open the **Table **menu item and click on **Table properties**. This function allows you to configure specific table settings.
256
257 (% class="wrapped" %)
258 |=(((
259 Width/height
260 )))|(((
261 (% class="TableParagraph" %)
262 Here you have the option to determine the size of the table in pixels. Alternatively, you may also specify the size relative to the size of the page. To do this, enter the percent sign after the number, e. g. width: 100%. 
263
264 (% class="TableParagraph" %)
265 If you do not make any specifications, the size of the table is automatically adjusted to the size of the content.
266 )))
267 |=(((
268 Cell spacing
269 )))|(((
270 Cell spacing defines the border width around the individual cells and is specified in pixels.
271 )))
272 |=(((
273 Cell padding
274 )))|(((
275 Cell padding indicates the space between the table's cells.
276 )))
277 |=(((
278 Border
279 )))|(((
280 Here you can specify the border width in pixels. If you enter 0, there will be no border around your table.
281 )))
282 |=(((
283 Caption
284 )))|(((
285 If you activate this checkbox, an additional row will appear above your table. You may use this row to assign a table title.
286 )))
287 |=(((
288 Advanced
289 )))|(((
290 (% class="TableParagraph" %)
291 In the **Advanced **tab, you can set the border and background colour for your table. To do this, you will need the hexadecimal code. Alternatively, you may also select a colour directly from the colour picker. 
292
293 (% class="TableParagraph" %)
294 To fill in the **Style **field, CSS knowledge is required. Using CSS statements, you can customise the display of the table.
295 )))
296
297 ==== ====
298
299 ==== ====
300
301
302 ==== (% style="color:#3e4444" %)Edit cells, rows, and columns(%%) ====
303
304
305
306 The **Cell**, **Row**, and **Column **menu items offer various functions to customise the table content. You can edit individual cells, rows, or columns.
307
308 To edit a **cell**, you have the following options:
309
310 * Merge cells
311 * Split cells
312 * Cell properties:
313
314 (% class="wrapped" style="margin-left:30.0px" %)
315 (% style="margin-left:30.0px" %)|=(((
316 Width/height
317 )))|(((
318 Here you can set the width and height of a cell in pixels or percent.
319 )))
320 (% style="margin-left:30.0px" %)|=(((
321 Cell type
322 )))|(((
323 The **Header **cell type formats your content as a header.
324 )))
325 (% style="margin-left:30.0px" %)|=(((
326 Scope
327 )))|(((
328 (% class="_mce_tagged_br" %)
329 * (% style="color:#333333" %)Row
330 * (% style="color:#333333" %)Column
331 * (% style="color:#333333" %)Row group
332 * (% style="color:#333333" %)Column group
333 )))
334 (% style="margin-left:30.0px" %)|=(((
335 H align and V align
336 )))|(((
337 You have the option to choose whether you want your content to be left-aligned, right-aligned or centered.
338 )))
339 (% style="margin-left:30.0px" %)|=(((
340 Advanced
341 )))|(((
342 (% class="TableParagraph" %)
343 In the **Advanced **tab, you can set the border and background colour for your table. To do this, you will need the hexadecimal code. Alternatively, you may also select a colour directly from the colour picker. 
344
345 (% class="TableParagraph" %)
346 To fill in the **Style **field, CSS knowledge is required. Using CSS statements, you can customise the display of the table.
347 )))
348
349 To edit a **row**, you have the following options:
350
351 * Insert row before
352 * Insert row after
353 * Delete row
354 * Cut row
355 * Copy row
356 * Paste row before
357 * Paste row after
358 * Row properties:
359
360 (% class="wrapped" style="margin-left:30.0px" %)
361 (% style="margin-left:30.0px" %)|=(((
362 Row type
363 )))|(((
364 * The **Header **moves the selected row up to the top of the table. 
365 * The **Body **row type is used for the text or data contained in the table.
366 * The **Footer **moves the selected row to the last position of the table.
367 )))
368 (% style="margin-left:30.0px" %)|=(((
369 H align and V align
370 )))|(((
371 You have the option to choose whether you want your content to be left-aligned, right-aligned or centered.
372 )))
373 (% style="margin-left:30.0px" %)|=(((
374 Height
375 )))|(((
376 Here you can set the height of a row in pixels or percent.
377 )))
378 (% style="margin-left:30.0px" %)|=(% colspan="1" %)(% colspan="1" %)
379 (((
380 Advanced
381 )))|(% colspan="1" %)(% colspan="1" %)
382 (((
383 (% class="TableParagraph" style="text-align: left;" %)
384 In the **Advanced **tab, you can set the border and background colour for your table. To do this, you will need the hexadecimal code. Alternatively, you may also select a colour directly from the colour picker. 
385
386 (% class="TableParagraph" style="text-align: left;" %)
387 To fill in the **Style **field, CSS knowledge is required. Using CSS statements, you can customise the display of the table.
388 )))
389
390 To edit a** column**, you have the following options:
391
392 * Insert column before
393 * Insert column after
394 * Delete column
395 {{/layout-cell}}
396 {{/layout-section}}
397
398 {{layout-section ac:type="single"}}
399 {{layout-cell}}
400
401 {{/layout-cell}}
402 {{/layout-section}}
403
404 {{layout-section ac:type="single"}}
405 {{layout-cell}}
406 === ===
407
408 {{id name="werkzeuge"/}}ToolsYou can choose from various tools to customise your content and add formulas. For more detailed information on how to use these functions, see the [[Formula editor>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Weitere Funktionen.Texteditor.Formeleditor.WebHome||rel="nofollow" shape="rect"]] help page.
409
410 (% class="wrapped" %)
411 |=(% colspan="1" %)(% colspan="1" %)
412 (((
413 Option
414 )))|=(% colspan="1" %)(% colspan="1" %)
415 (((
416 Description
417 )))
418 |(((
419 Source code
420 )))|(((
421 Click on the **Source code** menu item to edit your content directly in the HTML file.
422 )))
423 |(((
424 Formula editor
425 )))|(((
426 (% class="TableParagraph" %)
427 MathML and LaTeX are formula editors you can use to display your formulas. For more detailed information, see the (% style="color:#0d7a95" %)[[Formula editor>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Weitere Funktionen.Texteditor.Formeleditor.WebHome||rel="nofollow" shape="rect"]](%%) help page.
428 )))
429 {{/layout-cell}}
430 {{/layout-section}}
431 {{/layout}}