كتابة المحتوى

تنسيق Markdown وHTML

نكتب معظم المحتوى على DevSite بتنسيق Markdown، وهو تنسيق كتابة مصمّم ليكون بسيطًا وسهل القراءة في النص العادي. يحوّل DevSite تلقائيًا تنسيق Markdown إلى HTML لعرضه على الويب.

للتعرّف على ما يعادل عناصر HTML الشائعة في Markdown الخاصة بـ Google، يمكنك استخدام ورقة الغش على الرابط go/g3mark-cheat. يمكنك الاطّلاع على المستندات الكاملة الخاصة بتنسيق Markdown من Google، المعروف أيضًا باسم CommonMark، هنا.

وفي ما يلي بعض الأمثلة على ذلك:

HTML Markdown
<b>bold text</b>
<strong>bold text</strong>
**bold text**
<i>italic text</i>
<em>italic text</em>
*italic text*
<h2>Heading 2</h2>
<h3>Heading 3</h3>
## Heading 2
### Heading 3
<a href="url.com">Link</a> [Link](url.com)
<p>paragraph</p> Paragraph
<ol>
  <li>Ordered list first item</li>
  <li>Second item</li>
</ol>
1. Ordered list first item
1. Second item
1. Third item
<ul>
<li>Unordered list first item</li>
  <ul>
    <li>Nested list item</li>
  </ul>
<li>Second item</li>
</ul>
* Unordered list first item
    * Nested item (indent 4-spaces)
* Second item

حالات استخدام HTML بدلاً من Markdown

هناك بعض العناصر التي لا نستخدم Markdown لكتابتها، بما في ذلك:

  • تضمين الملفات: يجب أن تكون جميع ملفات التضمين ملفات HTML، وبالتالي يجب ألا تتضمّن أي عناصر مكتوبة بلغة Markdown. للحصول على إرشادات حول إنشاء ملفات التضمين، يُرجى الاطّلاع على إعادة استخدام المحتوى في صفحات متعددة.

  • الجداول: قد يكون من الصعب تنسيق جداول Markdown والحفاظ عليها، لذا نستخدم HTML للجداول، حتى في ملفات Markdown.

  • الصور: يتيح استخدام HTML للصور المزيد من المرونة في ما يتعلق بتنسيق الصور وموضعها. اطّلِع على دليل النشر في DevSite حول الصور.

  • Zippies: يجب أن تكون Zippies، المعروفة باسم الأدوات القابلة للتوسيع على Devsite، بتنسيق HTML ومضمّنة في علامة <div>.

تنسيقات المحتوى الشائعة

اتّبِع إرشادات الروابط لمعرفة الحالات التي يجب فيها فتح الروابط في علامة التبويب نفسها أو في علامة تبويب جديدة. إذا كنت بحاجة إلى فتح رابط في علامة تبويب جديدة، يمكنك تنسيق الرابط بالطرق التالية:

Markdown

[Accessible content](/style/accessibility){:target="_blank"} 

HTML

<a href="/style/accessibility" target="_blank">Accessible content</a>

الجداول

للتعرّف على أنواع الجداول التي يوفّرها Devsite ورموز HTML الخاصة بها، يُرجى الاطّلاع على دليل النشر في DevSite حول الجداول.

ملاحظات:

  • إذا كنت تريد أن يكون جدولك بدون حدود، استخدِم class="columns"

  • إذا كنت بحاجة إلى أن يتضمّن جدولك مساحة متروكة وخطوطًا فاصلة (مثل هذه الصفحة)، استخدِم class="columns extra-padding" واستخدِم العلامات <hr> في صف منفصل بين صفوف المحتوى.

وحدات قابلة للتوسيع

بالنسبة إلى Workspace، نستخدم الفئة arrow-icon لتنسيق Zippy. في ما يلي مثال على تطبيق مصغّر سريع (قابل للتوسيع) في Workspace:

<div>
  <devsite-expandable class="arrow-icon" id="UNIQUE_ZIPPY_ID">
    <h4 class="showalways">ZIPPY_HEADING</h4>
    <div>
      YOUR_CONTENT
    </div>
  </devsite-expandable>
</div>

لاستخدام هذا النموذج، استبدِل المتغيّرات التالية:

  • UNIQUE_ZIPPY_ID: أدخِل معرّفًا وصفيًا وفريدًا لتتمكّن من الإشارة مباشرةً إلى Zippy، مثلاً، direct-admin-access.
  • ZIPPY_HEADING: أدخِل النص الذي يجب أن يراه المستخدم قبل توسيع الزر السريع.
  • YOUR_CONTENT: أدخِل المحتوى الذي يجب أن يراه المستخدم عند توسيع البطاقة السريعة.

لمزيد من المعلومات حول الأداة القابلة للتوسيع في DevSite، يمكنك الاطّلاع على دليل النشر في DevSite، الأدوات: قابلة للتوسيع .

تضمين المحتوى المشترَك

لإعادة استخدام المحتوى على صفحات متعددة، يمكنك استخدام عمليات التضمين، وهي إصدار DevSite من استخدام المقتطفات في مقالات متعددة في Composer.

للحصول على إرشادات حول إنشاء ملفات التضمين واستخدامها في المحتوى، يُرجى الاطّلاع على مقالة إعادة استخدام المحتوى في صفحات متعددة.

إضافة روابط مخصّصة إلى العناوين

تنشئ DevSite سمة معرّف HTML لكل عنوان. للحفاظ على الاتساق في حال تغيّر العنوان، يمكنك إضافة معرّف رابط ثابت مخصّص إلى العنوان من خلال إضافة {:#your-id} بجانب نص العنوان، على سبيل المثال:

## Apply filters to your search results {:#apply-filters}

ملاحظة: لإنشاء معرّفات ربط مخصّصة تلقائيًا لجميع العناوين في ملف، اضغط على Command (\⌘) + H (Ctrl + H على جهاز Windows). لن يتم تغيير معرّفات المرساة المخصّصة الحالية.

لمزيد من المعلومات، يُرجى الاطّلاع على دليل النشر في DevSite بشأن معرّفات العناوين.