symbols to copy:
───────────►
■ ◄ ► ▲ ▼ █ ▐▌ ▄ → ← ↓ ↑ ↕ ─ ░ ▒ ▬ ● ♫ « »
──────────────────────
Ajouter des rectangles couleurs :1. ⴰⴷ ⵏⴰⵔⵉ ⴳ ⵓⴳⵏⵙⵓ ⵏ ⴰⵎⴽⴽⵓⵥ ⴰⵣⴳⴳⴰⵖ :
<div class="redbox">ⵜⴰⵏⵎⵎⵉⵔⵜ ⵔⵉⵖ ⴰⴷ ⵍⵎⴷⵖ ⵜⴰⵎⴰⵣⵉⵖⵜ</div>ⵔⴰⴷ ⵉⵉⴼⴰⵖ ⵖⵉⴽ ⴰ :
ⵜⴰⵏⵎⵎⵉⵔⵜ ⵔⵉⵖ ⴰⴷ ⵍⵎⴷⵖⵜⴰⵎⴰⵣⵉⵖⵜ
2. ⴰⴷ ⵏⴰⵔⵉ ⴳ ⵓⴳⵏⵙⵓ ⵏ ⴰⵎⴽⴽⵓⵥ ⴰⵥⵔⵡⴰⵍ :
<div class="bluebox">ⵉⵙ ⵜⵙⵙⵏⴷ ⴰⴷ ⵜⵙⴰⵡⴰⵍⵜ ⵙ ⵜⵎⴰⵣⵉⵖⵜ ?</div>ⵔⴰⴷ ⵉⵉⴼⴰⵖ ⵖⵉⴽ ⴰ :
ⵉⵙ ⵜⵙⵙⴷ ⴰⴷ ⵜⵙ ⴰⵡⴰⵍⵜ ⵙ ⵜⵎⴰⵣⵉⵖⵜ ?
3. ⴰⴷ ⵏⴰⵔⵉ ⴳ ⵓⴳⵏⵙⵓ ⵏ ⴰⵎⴽⴽⵓⵥⴰⵣⴳⴳⴰ ⵓⵎⵍⵉⵍ :
<div class="blondbox">
ⴰⵔⵎⴰⵙ compréhension
</div>
ⵔⴰⴷ ⵉⵉⴼⴰⵖ ⵖⵉⴽ ⴰ :
ⴰⵔⵎⴰⵙ compréhnsion
─────────────────────────────────────────
Ajouter les vidéos :
1. copier ID de la vidéo youtube, par exep: https://www.youtube.com/watch?v=Sw27DJbWzJQ (ID c'est la partie en rouge)
2. copier l'ID et le remplacer dans le code qui suit, 3. puis insérer le code dans html :
<div class="video-container"><iframe allowfullscreen="" frameborder="0" height="360" src=" " data-src="https://www.youtube.com/embed/XXXXXXX?rel=0&showinfo=0" width="640"></iframe></div>
XXXXXXX est l'ID de la vidéo
Pour obtenir le lien url de l'image de la vidéo pour l'insérer dans le text copier ce lien et remplacer l'ID (en rouge) :
Pour obtenir le lien url de l'image de la vidéo pour l'insérer dans le text copier ce lien et remplacer l'ID (en rouge) :
https://img.youtube.com/vi/xxxxxxxxxxx/hqdefault.jpg
Dessiner un tableau : code :
<div style="overflow-x:scroll;"><table ><tbody><caption>ⴰⵏⴰⵡⵏ ⵏ ⵓⵙⴼⵜⵉ Thèmes verbaux</caption> <tr><td> collone 1 </td><td> collone 2 </td><td> collone 3 </td> </tr> <tr><th> élément x1 </th><th> élément y1 </th><th> élément z1</th></tr> <tr><th> élément x2</th><th> élément y2</th><th> élément z2</th></tr> <tr><th> élément x3</th><th> élément y3</th><th> élément z3</th></tr> <tr><th> élément x4</th><th> élément y4</th><th> élément z4</th></tr> <tr><th> élément x5</th><th> élément y5</th><th> élément z5</th></tr> <tr><th> élément x6</th></tr></tbody></table></div>
Le résultat du tableau qu'on vient d'écrire :
collone 1 | collone 2 | collone 3 |
---|---|---|
élément x1 | élément y1 | élément z1 |
élément x2 | élément y2 | élément z2 |
élément x3 | élément y3 | élément z3 |
élément x4 | élément y4 | élément z4 |
élément x5 | élément y5 | élément z5 |
élément x6 |
Other characteristics of tables :
caption-side Property :
caption-side Property :
table {caption-side: bottom;} or table {caption-side: top;}empty-cells Property :
table {empty-cells: hide;}
<thead> added after <table> :
<thead>
<tr> <th>element1</th> </tr>
</thead>
<tfoot> added after </thead> or <table> :
<tfoot>
<tr> <th>element1</th> </tr>
</tfoot>
borders :
table {border-spacing: 0.5rem; border-collapse: collapse;}
Connecting Cells :
colspan and rowspan, they accept any positive integer 2 or larger. If a td has a colspan of 2 (i.e. <td colspan="2">) it will still be a single cell, but it will take up the space of two cells in a row horizontally. Likewise with rowspan, but vertically.
highlight the column n° 3 :
more about tables : https://www.w3schools.com/css/css_table.asp
col:nth-child(3) {background: yellow;}
more about tables : https://www.w3schools.com/css/css_table.asp
ⵜⵉⵔⵔⴰ التحرير
: (الصورة 1 (اضغط على الصور لتكبيرها
1-(عنوان الموضوع (سيظهر لمحركات البحث كما في الصورة3
2- مكان تحرير النص او الموضوع
4- و جافاسكريبت ... و تعديل اكواد المحتوى html لاضافة اكواد مثل
5- ... (لون النص (تلقائي لكن يمكك تغييره بالنسبة للكلمات و الجمل
6- ... اضافة الروابط الى الجمل و الكلمت
7- url اضافة الصور اما برفعها من الحاسوب مباشرة او عبر رابط
الصورة 2
8- (لنشر الموضوع (تأكد ان كل شيء في حالة جيدة قبل النشر
9- لحفض الموضوع او ابقاءه في المسودة
10- معاينة الموضوع - عرض مسبق
11- اغلاق صندوق التحرير
13- ينبغي تحريره بعناية و بالحروف الانجليزية فقط كما في الصورة 4 permalink رابط الموضوع
12- الكلمات الدلالية اي تصنيف الموضوع - اضف / اختر فقط الكلمات التي تصنف الموضوع (تظهر لمحركات البحث كما في الرقم 12 الصورة 3 )
14- هنا تكتب وصف قصير للموضوع و هو الوصف الذي يظهر عند مشاركة الموضوغ في الفيسبوك و في غوغل (تظهر كما في الرقم 14 الصورة 3 )
15- (لتعديل توقيت / تاريخ الموضوع (يرجى عدم تغييره و تركه تلقائيا
16- (المكان / المدينة التي يتواجد بها المحرر/ الكاتب (يفضل تركه تلقائيا
17- (حرفيا او تفسيرها (يفضل تركها تلقائيا html خيارات الموضوع : اختيار السماح/عدم السماح بالتعليقات . اضهار اكواد
18- (خاصة بمحركات البحث (يرجى تركها تلقائيا و عدم تغييرها
: الصورة 3
1- هذا هو العنوان كما يضهر في محركات البحث
12- (هذه هي الكلمة الدلالية / تصنيف الموضوع (بالاخضر
14- هذا هو الوصف الذي يضهر لمحركات البحث
: الصورة 4
13- الخاص بالموضوع- يجب ان بكتب بالحروف الانجليزية و تعويض مكان الفراغ بعارضة( - ) و اختيار الكلمات المعبرة عن الموضوع url هذا هو رابط
.ملاحظة : بالنسبة للخط و الحجم يرجى تركهما تلقائيا
D
ⵙⵎⴷ ⴰⵅⴼⴰⵡⴰⵍ
ⴳ ⴰⵎⵣⵡⴰⵔⵓ ⵙ ⵜⵅⴼⴰⵡⵍⴷ !