Skip to Content

Wiki source code of 05 Zertifikate

Last modified by Carina Enke on 23.07.2024
Show last authors
1 [[image:attach:medal.png||data-xwiki-image-style="img-icon"]] In addition to the [[Performance results>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Bewertung.Performance Results.WebHome||shape="rect"]], certificate files can be generated for a course or individual course elements. The user can download these files as a PDF via a link in the performance results section of the course and print them out.
2
3 You can use various configuration options to influence the design of the certificate and limit the view or print.
4
5 {{info}}
6 A certificate is issued for a passed course or course element. Instructions on how to configure the passing status can be found on the [[Assessment>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Bewertung.WebHome||shape="rect"]] help page.
7
8 A certificate is only visible if performance results have been configured for the course. Instructions on how to configure performance results for a course can be found on the [[Performance Results>>doc:LMS.Benutzerhandbuch OPAL.Lehren.Bewertung.Performance Results.WebHome]] help page.
9 {{/info}}
10
11 (% class="box infomessage" %)
12 (((
13 A [[supplementary Video>>doc:LMS.Benutzerhandbuch OPAL.Erste Schritte.Ergaenzungsvideos.WebHome]] is available for this function.
14 )))
15
16
17 == Offer certificates ==
18
19
20 To generate a certificate automatically and display it to the learner, proceed as follows:
21
22 1. Open the course editor and navigate to the desired course element. To receive a certificate for the entire course, go to the top course node.
23 1. In the selected element, switch to the **Assessment **tab.
24 1. Activate the **Use certificates **option.
25 \\**//[[image:attach:Kurseditor-Zertifikate verwenden_en.png||data-xwiki-image-style="img-screen" data-xwiki-image-style-border="true" width="500"]]//**
26
27 1. Choose the desired certificate template from the **Template for certificates **selection list. Apart from the example template, you can also use individually created templates. The latter will appear at the top of the selection list.(% style="color:#0000ff" %)
28 1. If you activate the **Display certificates only for tutors **option,** **the PDF files of the certificates will only be accessible by tutors via the assessment tool. A simple user does not have access to this area and can thus not view, print, or download their certificate.
29
30
31 {{info}}
32 Please note that the template set in step 4 will be used for the first time for certificates that have been newly acquired after the publication of this change. However, users will also receive a new certificate if they improve on their original result. The template does not affect existing certificates. This also applies to replacing the template. A new template will only be used for a new certificate.
33 {{/info}}
34
35
36 == Use individual certificate templates ==
37
38
39 Individual course templates must be saved to the storage folder of the course and linked to the relevant course element. First open the course and switch to the course editor. Then select the Storage folder entry from the Editor tools menu. Choose one of the following options according to your certificate template:
40
41 * One or more certificate files with **any name**:
42
43 1. First create a new **folder with the exact title** //certificate_templates //in the course storage folder.
44 1. Copy all HTML templates as well as all images and CSS files referenced in these templates to the //certificate_templates //folder.
45 1. (((
46 Close the storage folder.
47
48 {{info title="Tip"}}
49 Use the following **example template file** to test the function: (% style="color: rgb(0,0,255);" %)[[attach:certificate_templates.zip]].
50
51 (% style="color: rgb(51,51,51);" %)Upload this file to the storage folder in the course editor and unzip it. Take a look at the examples included in the //certificate_templates// folder and edit them if necessary. All included certificate templates will then be available under the **Use certificates** section in the **Assessment **tab of the course or course element.
52 {{/info}}
53 )))
54
55 * A single template with the **mandatory file name **//certificatetemplate.html //(all letters in lowercase):
56
57 1. Upload the HTML file with this specific file name to the course storage folder or the assigned resource folder of the course.
58 1. All images and CSS files referenced in the template must also be copied to the course storage folder / resource folder.
59 1. Close the storage folder.
60
61 When configuring the course element in the **Assessment **tab, select exactly this template from the **Template for certificates **list.
62
63
64 === Placeholder ===
65
66
67 When creating the certificate template, you can use different placeholders in the HTML file, depending on the configuration of the learning platform. These are then filled in the certificate of the respective user with the corresponding data of the course or user.
68
69 You can create and design such a certificate template with the integrated HTML editor e. g. directly in the course storage folder. If you create and upload a certificate template with an external editor, the system will warn you of possible information loss when trying to edit the template with the integrated editor.
70
71 {{note title="Course element ID"}}
72 For some of the placeholders, you will need the individual course element ID. The IDs can be found in the course editor of the respective course element on the Title and description tab in the form of a number combination in the bottom right corner (e. g. ID: 94862470524389). Just replace the signs indicated in the table (~#~##) with the desired number combination (e.g. %%MARK:94862470524457%%).
73 {{/note}}
74
75 (% class="wrapped" %)
76 |=(((
77 Placeholder
78 )))|=(((
79 Value
80 )))
81 |(((
82 %%COURSE_TITLE%%
83 )))|(((
84 Title of the course for which the certificate is issued.
85 )))
86 |(((
87 (% style="color:#172b4d" %)%%COURSENODE_TITLE%%
88 )))|(((
89 Title of the course element for which the certificate is issued.
90 )))
91 |(((
92 %%CERTIFICATE_DATE%%
93
94
95
96 )))|(((
97 (% class="content-wrapper" %)
98 (((
99 The date on which the performance results were achieved. The formatting of the placeholder depends on the language selected by the user. It can be adjusted with the following options:
100
101
102 |=Form|=Placeholder|=Example
103 |Standard|%%CERTIFICATE_DATE%%|(((
104 Standard (Systemsprache Deutsch): 23.07.2024,
105
106 Standard (Systemsprache Englisch): Jul 23, 2024
107 )))
108 |LONG DE|%%CERTIFICATE_DATE_LONG:LANG=de%%|23. Juli 2024
109 |SHORT DE|%%CERTIFICATE_DATE_SHORT:LANG=de%%|23.07.24
110 |MEDIUM DE|%%CERTIFICATE_DATE_MEDIUM:LANG=de%%|23.07.2024
111 |FULL DE|%%CERTIFICATE_DATE_FULL:LANG=de%%|Dienstag, 23. Juli 2024
112 |LONG EN|%%CERTIFICATE_DATE_LONG:LANG=en%%|July 23, 2024
113 |SHORT EN|%%CERTIFICATE_DATE_SHORT:LANG=en%%|07/23/24
114 |MEDIUM EN|%%CERTIFICATE_DATE_MEDIUM:LANG=en%%|Jul 23, 2024
115 |FULL EN|%%CERTIFICATE_DATE_FULL:LANG=en%%|Tuesday, July 23, 2024
116 )))
117 )))
118 |(((
119 (% style="color:#172b4d" %)%%GRADE%%
120 )))|(((
121 Display of grades as text
122 )))
123 |(((
124 %%GRADE:~#~##:LANG=de%%
125 )))|(((
126 Display of the German grade for the specified course element
127 )))
128 |(((
129 %%GRADE:~#~##:LANG=en%%
130 )))|(((
131 Display of the English grade for the specified course element
132 )))
133 |(((
134 %%MARK%%
135 )))|(((
136 Mark for the entire course
137 )))
138 |(((
139 %%MARK:~#~##%%
140 )))|(((
141 Mark for the course element with the ID ~#~## (the course element must be assessable)
142 )))
143 |(((
144 %%ROOT_NODE_SHORT_TITLE%%
145 )))|(((
146 Short title from the course root node
147 )))
148 |(((
149 %%ROOT_NODE_TITLE%%
150 )))|(((
151 Title from the course root node
152 )))
153 |(((
154 %%METADATA:moduleduration%%
155 )))|(((
156 (% class="TableParagraph" %)
157 Course metadata: Duration of the module
158 )))
159 |(((
160 %%METADATA:moduleects%%
161 )))|(((
162 Course metadata: ECTS
163 )))
164 |(((
165 %%METADATA:moduleexam%%
166 )))|(((
167 Course metadata: Exams
168 )))
169 |(((
170 %%METADATA:modulelevel%%
171 )))|(((
172 Course metadata: Level
173 )))
174 |(((
175 %%METADATA:modulelink%%
176 )))|(((
177 Course metadata: Link to the module
178 )))
179 |(((
180 %%METADATA:modulemethods%%
181 )))|(((
182 Course metadata: Teaching and learning methods
183 )))
184 |(((
185 %%METADATA:modulename%%
186 )))|(((
187 Course metadata: Name of the module
188 )))
189 |(((
190 %%METADATA:modulenumber%%
191 )))|(((
192 Course metadata: Module number
193 )))
194 |(((
195 %%METADATA:moduleresponsible%%
196 )))|(((
197 Course metadata: Person responsible for further education
198 )))
199 |(((
200 %%METADATA:moduleversion%%
201 )))|(((
202 Course metadata: Version
203 )))
204 |(((
205 %%METADATA:moduleworkloadpresence%%
206 )))|(((
207 Course metadata: Attendance time
208 )))
209 |(((
210 %%METADATA:moduleworkloadprivate%%
211 )))|(((
212 Course metadata: Private study time
213 )))
214 |(((
215 %%METADATA:moduleworkloadtotal%%
216 )))|(((
217 Course metadata: Total workload
218 )))
219 |(((
220 %%PASSED%%
221 )))|(((
222 Displays "Passed" in the certificate, depending on the configured user language at the time of passing.
223 )))
224 |(((
225 %%PROPERTY:birthDay%%
226 )))|(((
227 (% class="content-wrapper" %)
228 (((
229 (% class="TableParagraph" %)
230 Date of birth with the following options:
231
232 * Selecting a display style for the date
233 * (((
234 Defining the language format
235
236 {{expand title="Display all available format options ..."}}
237 {{{Standard: %%PROPERTY:birthDay%%
238 LONG DE: %%PROPERTY:birthDay_LONG:LANG=de%%
239 SHORT DE: %%PROPERTY:birthDay_SHORT:LANG=de%%
240 MEDIUM DE: %%PROPERTY:birthDay_MEDIUM:LANG=de%%
241 FULL DE: %%PROPERTY:birthDay_FULL:LANG=de%%
242 LONG EN: %%PROPERTY:birthDay_LONG:LANG=en%%
243 SHORT EN: %%PROPERTY:birthDay_SHORT:LANG=en%%
244 MEDIUM EN: %%PROPERTY:birthDay_MEDIUM:LANG=en%%
245 FULL EN: %%PROPERTY:birthDay_FULL:LANG=en%%}}}
246 {{/expand}}
247 )))
248 )))
249 )))
250 |(((
251 %%PROPERTY:email%%
252 )))|(((
253 Email address
254 )))
255 |(((
256 %%PROPERTY:firstName%%
257 )))|(((
258 First name
259 )))
260 |(((
261 %%PROPERTY:institutionalName%%
262 )))|(((
263 Institution
264 )))
265 |(((
266 %%PROPERTY:institutionalUserIdentifier%%
267 )))|(((
268 Matriculation number (system-dependent metadata)
269 )))
270 |(((
271 %%PROPERTY:lastName%%
272 )))|(((
273 Last name
274 )))
275 |(((
276 %%PROPERTY:orgUnit%%
277 )))|(((
278 Organisation unit
279 )))
280 |(((
281 %%SALUTATION:LANG=de%%
282 )))|(((
283 Salutation (German)
284 )))
285 |(((
286 %%SALUTATION:LANG=en%%
287 )))|(((
288 Salutation (English)
289 )))
290 |(((
291 %%SCORE%%
292 )))|(((
293 Score for the entire course
294 )))
295 |(((
296 %%SCORE:~#~##%%
297 )))|(((
298 Score for the course element with the ID ~#~## (the course must be assessable)
299 )))
300 |(((
301 (% style="color:#172b4d" %)%%OUTCOME:[variable name]:~#~##%%
302 )))|(((
303 (% class="content-wrapper" %)
304 (((
305 Output value of an ONYX test
306
307 {{expand title="Learn more about how to use this placeholder ..."}}
308 This placeholder can be used for all variables displayed in a test course element on the Test configuration tab>"Output variables of this resource" such as MAXSCORE, PASS_SCORE, SCORE, PASS, as well as for individual test and section variables of the type text or numerical.
309
310 [[image:attach:Kurseditor - Ausgabevariablen_en.png]]
311
312 If the certificate should contain output values from another course element, the course element ID must be specified in the placeholder. For example, this is the case if the certificate is created for a structure course element and output values are to be retrieved from a test course element. If the certificate is created directly for the test course element for which the user values should be displayed, %%OUTCOME:[variable name]%% will be sufficient as specification.
313 {{/expand}}
314 )))
315 )))
316 |(((
317 (% style="letter-spacing:0.0px" %)%%SEMESTER%%
318 )))|(((
319 Semester
320 )))
321 |(((
322 %%USERNAME%%
323 )))|(((
324 First and last name of the person receiving the certificate for their performance results.
325 )))
326
327 === Examples ===
328
329 {{panel bgColor="#dddddd"}}
330 {{expand title="Display HTML example ..."}}
331 {{code language="xml"}}
332 <body>
333 <div id="center">
334 <!-- header-logo -->
335 <div id="header">
336 <div id="logo"></div>
337 </div>
338
339 <!-- content-part-->
340 <div id="content">
341 <h1>Zertifikat</h1>
342 <h2>%%USERNAME%%</h2>
343 <div>hat am</div>
344 <h3>%%CERTIFICATE_DATE%%</h3>
345 <div>den Kurs</div>
346 <h2>%%COURSE_TITLE%%</h2>
347 <div>erfolgreich absolviert.</div>
348 </div>
349
350 <!-- signature line -->
351 <div id="signature">
352 <h3>Dieses Zertifikat wurde automatisch von der Lernplattform erstellt.</h3>
353 </div>
354 <div class="clearfloat"></div>
355
356 <!-- footer-logo -->
357 <div id="footer">
358 </div>
359
360 </div>
361 </body>
362
363 {{/code}}
364 {{/expand}}
365 {{/panel}}
366
367 {{panel bgColor="#dddddd"}}
368 {{expand title="Display CSS example ..."}}
369 {{code language="css"}}
370 body {font-family: Verdana,Helvetica,Arial,sans-serif; margin: 0; padding: 0;}
371 h1 {color: #888; font-size: 4em; margin-bottom: 80px;}
372 h2 {font-size: 2em; padding-bottom: 0px; margin-top: 40px; margin-bottom: 40px;}
373 h3 {font-size: 1.6em;}
374 .floaterright {float: right;}
375 .clearfloat {clear: both;}
376 #center {margin: 0 auto; width: 900px;}
377 #header {height: 152px;background: url(certificate_header.png) no-repeat #eee; box-shadow: 0 4px 4px -2px #AAAAAA;}
378 #content {height: 900px; margin-top: 100px;}
379 #content div, #signature span {font-size: 1.6em;}
380 #content div, #content h1, #content h2, #content h3 {text-align: center;}
381 #signature {text-align: left; margin-left: 20px;}
382 #signature h3 {font-weight: normal; font-size: 1.3em; margin-bottom: 5px; margin-top: 5px;}
383 #signature span {font-size: 1em;}
384 #footer {margin-top: 35px; height: 50px; background: url(certificate_footer.png) no-repeat #eee;}
385 {{/code}}
386 {{/expand}}
387 {{/panel}}