Στυλ HTML
Το rtSurvey υποστηρίζει ετικέτες HTML σε ετικέτες και υποδείξεις, επιτρέποντας μορφοποίηση εμπλουτισμένου κειμένου, συνδέσμους και δυναμικό θεματισμό χρωμάτων.
Το rtSurvey αποδίδει κείμενο ετικέτας και υπόδειξης ως HTML σε φόρμες web. Αυτό σημαίνει ότι μπορείτε να χρησιμοποιείτε τυπικές ετικέτες HTML για μορφοποίηση κειμένου, προσθήκη αλλαγών γραμμής, δημιουργία συνδέσμων και εφαρμογή χρωμάτων. Αυτό είναι ιδιαίτερα χρήσιμο για πεδία σημείωσης, οδηγίες ενότητας και δυναμικές περιλήψεις.
Η HTML σε ετικέτες αποδίδεται στη φόρμα web και στις εφαρμογές κινητού rtSurvey. Ενδέχεται να μην αποδίδεται σε όλους τους πελάτες συμβατούς με ODK. Πάντα δοκιμάζετε στην πλατφόρμα στόχο σας.
Υποστηριζόμενες ετικέτες HTML
Μορφοποίηση κειμένου
| Ετικέτα | Αποτέλεσμα |
|---|---|
<strong>text</strong> ή <b>text</b> | Έντονο κείμενο |
<em>text</em> ή <i>text</i> | Πλάγιο κείμενο |
<u>text</u> | Υπογραμμισμένο κείμενο |
<br> | Αλλαγή γραμμής |
<span style="...">text</span> | Ενσωματωμένο στυλ |
Σύνδεσμοι
<a href="https://example.com" target="_blank">Κάντε κλικ εδώ</a>
Ανοίγει σε νέα καρτέλα. Χρησιμοποιείτε για έγγραφα αναφοράς, οδηγίες ή εξωτερικούς πόρους που πρέπει να συμβουλευτεί ο απογραφέας.
Χρώματα
Χρησιμοποιήστε <span> με ενσωματωμένα στυλ:
<span style="color: red;">Προειδοποίηση: η τιμή είναι εκτός εύρους</span>
<span style="color: #009688;">Ενότητα ολοκληρώθηκε</span>
Μεταβλητές θέματος χρωμάτων
Το rtSurvey υποστηρίζει tokens θέματος χρωμάτων που προσαρμόζονται στο διαμορφωμένο θέμα της εφαρμογής. Χρησιμοποιήστε τη σύνταξη __COLOR_THEME_NAME__:
<span style="color: var(--color-theme-primary);">Κείμενο κύριου χρώματος</span>
Ή χρησιμοποιώντας τη συντομογραφία token στο κείμενο ετικέτας:
<font color="var(--COLOR_THEME_PRIMARY)">Σημαντική σημείωση</font>
Αυτό μετατρέπεται αυτόματα στο αντίστοιχο <span> με CSS μεταβλητή κατά την απόδοση.
Ετικέτες πολλαπλών γλωσσών
Περιτυλίξτε περιεχόμενο σε ετικέτες γλώσσας για υποστήριξη πολλαπλών γλωσσών σε ένα κελί ετικέτας:
<en>Enter the household size</en><vi>Nhập quy mô hộ gia đình</vi>
Το rtSurvey εξάγει το περιεχόμενο που αντιστοιχεί στην τρέχουσα γλώσσα εφαρμογής. Εάν δεν βρεθεί αντιστοιχούσα ετικέτα γλώσσας, εμφανίζεται ολόκληρη η συμβολοσειρά.
Παραδείγματα σε πεδία σημείωσης
Οδηγία ενότητας με έντονο κείμενο και αλλαγή γραμμής
| type | name | label |
|---|---|---|
| note | section_intro | <strong>Ενότητα 3: Χρήση Γης</strong><br>Κάντε όλες τις ερωτήσεις αυτής της ενότητας μόνο στον αρχηγό νοικοκυριού. |
Δυναμική περίληψη με αναφορά υπολογισμού
| type | name | label |
|---|---|---|
| calculate | total | |
| note | summary | Σύνολο μελών νοικοκυριού: <strong>${total}</strong><br><span style="color: gray;">Ενήλικες: ${adults} · Παιδιά: ${children}</span> |
Προειδοποίηση με κόκκινο χρώμα
| type | name | label | relevant |
|---|---|---|---|
| note | age_warning | <span style="color: red;"><strong>Προειδοποίηση:</strong> Η ηλικία που εισήχθη (${age}) είναι ασυνήθιστα υψηλή. Παρακαλώ επαληθεύστε.</span> | ${age} > 100 |
Σύνδεσμος σε έγγραφο αναφοράς
| type | name | label |
|---|---|---|
| note | guidelines_link | Ανατρέξτε στις <a href="https://docs.example.com/guidelines" target="_blank">Οδηγίες Πεδίου</a> πριν ξεκινήσετε αυτή την ενότητα. |
Ειδικές ετικέτες HTML rtSurvey
<webbox src='url' title='title'>...</webbox>
Ενσωματώνει κουμπί που ανοίγει URL σε ενδοφόρμα modal. Δείτε Webbox για πλήρεις λεπτομέρειες.
<delete-repeat-current>label</delete-repeat-current>
Αποδίδει κουμπί μέσα σε ομάδα επανάληψης που διαγράφει την τρέχουσα παρουσία επανάληψης όταν πατηθεί.
<delete-repeat-last>label</delete-repeat-last>
Αποδίδει κουμπί που διαγράφει την τελευταία παρουσία επανάληψης.
Παράδειγμα χρήσης σε ομάδα επανάληψης:
| type | name | label |
|---|---|---|
| note | delete_btn | <delete-repeat-current>Αφαίρεση αυτού του μέλους</delete-repeat-current> |
Βέλτιστες πρακτικές
- Χρησιμοποιείτε HTML με μέτρο — οι υπερβολικά μορφοποιημένες ετικέτες είναι δυσκολότερες να διαβαστούν, όχι ευκολότερες.
- Προτιμάτε
<strong>για έντονο και<em>για πλάγιο αντί για τις παρωχημένες<b>και<i>. - Κρατάτε τη χρήση χρώματος ουσιαστική — χρησιμοποιείτε κόκκινο για προειδοποιήσεις, όχι για διακόσμηση.
- Πάντα δοκιμάζετε απόδοση HTML τόσο στην εφαρμογή κινητού όσο και στη φόρμα web, καθώς η απόδοση μπορεί να διαφέρει ελαφρώς.
- Αποφύγετε ετικέτες
<table>μέσα σε ετικέτες — σπάνια αποδίδονται καλά σε οθόνες κινητών. - Μη χρησιμοποιείτε JavaScript (
<script>) — θα αφαιρεθεί ή θα προκαλέσει σφάλματα.
Περιορισμοί
- Σύνθετη HTML (πίνακες, φόρμες, scripts) δεν υποστηρίζεται και μπορεί να σπάσει την απόδοση.
- Ορισμένοι παλαιότεροι πελάτες κινητού ενδέχεται να εμφανίζουν ετικέτες HTML ως κυριολεκτικό κείμενο — δοκιμάζετε σε όλες τις συσκευές στόχους.
- Οι σύνδεσμοι
<a>ανοίγουν σε πρόγραμμα περιήγησης ή WebView — ο απογραφέας αποχωρεί από τη φόρμα, κάτι που μπορεί να είναι διαταρακτικό σε κινητό.