Πολύγλωσσο Δείγμα Ιστοσελίδας
Το βασικό χαρακτηριστικό της αρχιτεκτονικής ShipLang είναι ότι χρειάζεται να γράφετε ιστοσελίδες μόνο σε μία γλώσσα στο backend και το σύστημα θα τις μεταφράσει αυτόματα σε πολλές γλώσσες.
Η χρήση είναι πολύ απλή: απλώς προσθέστε το χαρακτηριστικό `data-i18n="όνομα κλειδιού μετάφρασης"` στο στοιχείο που πρέπει να μεταφραστεί. Το σύστημα θα μεταφράσει αυτόματα τα στοιχεία που έχουν επισημανθεί με `data-i18n`.
Αρχή μετάφρασης κειμένου JavaScript: Όταν η JavaScript στέλνει το κείμενο "[Hello]" στη σελίδα, διαβάζει το αποτέλεσμα μετάφρασης του "[data-i18n="Hello"]".
Πρέπει να αλλάξετε αυτήν τη σελίδα στα Αγγλικά για να την δείτε. Παρακάτω παρατίθενται παραδείγματα χρήσης σε διάφορα συνηθισμένα σενάρια, το καθένα με κώδικα και μια επίδειξη του πραγματικού αποτελέσματος.
Τα στοιχεία του πλαισίου κώδικα HTML 【pre】【code】 δεν μπορούν να μεταφραστούν από την ετικέτα data-i18n. Η προσθήκη του i18n σε αυτά τα στοιχεία ενδέχεται να οδηγήσει σε σφάλματα.
Οι μέθοδοι χρήσης σε πολλές γλώσσες εμφανίζονται σε ένα μέρος.
1.只要在标签加入[data-i18n]即代表该内容需要被翻译，示例：
<p data-i18n="welcome">欢迎使用</p>
Καλωσόρισμα!
2. 当[data-i18n]的值相同，系统也会容错处理，不会翻译为相同文本
<p data-i18n="k">你好</p><p data-i18n="k">不错</p>
Γειά σου
καλός
3. 无[data-i18n]标记文本（代表不翻译）
<span>这段文本没有data-i18n标记，不会被翻译</span>
4. 输入框Placeholder翻译兼容
<input data-i18n="email_placeholder" placeholder="请输入邮箱">
5. 按钮文本，点击按钮通过js修改文本翻译
<button data-i18n="btn_submit">修改文本</button>
主要原理是基于隐藏标签，假设隐藏标签的文本存在要翻译的文本就会读取隐藏标签的翻译之后的文本，实现翻译
6. 嵌套元素
<div><p data-i18n="nested">这是嵌套在div中的文本</p></div>
Αυτό είναι κείμενο που είναι ενσωματωμένο μέσα σε ένα div.
7. JavaScript动态内容,代码中是中文，当用户切换英语也会显示英语
document.getElementById('btn').addEventListener('click',function(){alert('这是JavaScript弹窗内容');});
8. PHP动态列表
<?php foreach ($qx_list as $i) {echo '<li data-i18n="item">' . $i['text'] . '</li>';}?>
- Δεδομένα λίστας 1
- WeChat: 5833487
- Λίστα δεδομένων 2
9. Meta标签SEO
<title data-i18n="title">标题</title><meta data-i18n="keywords" name="keywords" content="关键词"><meta data-i18n="description" name="description" content="描述">
Οι μεταετικέτες (meta tags) τοποθετούνται στην κεφαλίδα της σελίδας και χρησιμοποιούνται για την απόδοση της κατάταξης SEO στις μηχανές αναζήτησης.