ما هي GitHub Pages؟

مكتمل

هنا، نناقش عملية إنشاء وصيانة موقع ويب GitHub Pages.

تعد GitHub Pages مواقع ثابتة مستضافة مباشرة من مستودع GitHub الخاص بك، لكنها أكثر من مجرد مجموعة من الملفات الثابتة. من خلال الاستفادة من تقنيات إنشاء المواقع مثل Jekyll وLiquid، يحدد المطورون القوالب الديناميكية التي تتم معالجتها في مواقع ويب ثابتة كاملة. في كل مرة تقوم فيها بتثبيت تغيير على الفرع المصدر المقترن بالموقع، يتم إعادة إنشاء الموقع باستخدام آخر التحديثات ونشره تلقائيا إلى عنوان URL الهدف.

تعرف على المزيد حول مصادر النشر لمواقع GitHub Pages.

تمكين GitHub Pages

تتمثل الخطوة الأولى في استخدام GitHub Pages في تمكينها من علامة تبويب Settings بالمستودع الخاص بك. يمكنك اختيار استخدام الفرع main أو تحديد المجلد docs بداخله. إذا كنت تريد تعطيل GitHub Pages يمكنك القيام بذلك هنا.

اختيار نسق مع Jekyll

Jekyll هو منشئ الموقع الثابت الذي يستخدمه GitHub لبناء موقع الويب الخاص بك من محتويات المستودع الخاص بك. بالإضافة إلى توفير راحة كبيرة للمحتوى، فإنه يتطابق أيضًا مع اصطلاح التصميم القياسي. يسمح توحيد النمط هذا بالنُسق القابلة للتبديل، والذي يمكنك تحديده من GitHub Pagesالتكوين.

يوفر GitHub نسقا مختلفة. هناك أيضا مجموعة من الموضوعات التجارية والمفتوحة المصدر المتوفرة من مجتمع Jekyll.

تعرّف على المزيد حول Jekyll Themes.

استخدام المادة الأمامية لـ YAML

يشير مصطلح المادة الأمامية إلى بيانات تعريف YAML التي تسبق محتوى ملف. بالنسبة إلى Jekyll، تتضمن بيانات التعريف هذه إرشادات المولد للإشارة إلى نمط تخطيط صفحة Markdown (post، pageوهكذا). قد يتضمن أيضا بيانات تعريف الصفحة، مثل عنوان المستند أو متغيرات محتوى الصفحة، مثل كاتب منشور مدونة.

يستخدم post المثال التالي التخطيط. يفترض المثال أن هناك ملفا _layouts/post.html يعرف HTML الحاوية. يمكن تقديم خيارات التخطيط الأخرى عن طريق إضافة ملفات HTML الخاصة بها في _layouts المجلد.

---
layout: post
title: This is set as the document title.
---

This is visible body content, which might use Markdown, HTML, and Liquid templating.

تعرّف على المزيد حول Front Matter.

تخصيص موقعك

بمجرد تشغيل موقعك، يمكنك تخصيص تفاصيل حول موقعك عبر _config.yml. يتضمن هذا الملف تقريبا جميع خيارات التكوين على مستوى الموقع بما في ذلك بيانات تعريف الموقع وقوائم التنقل وألوان النسق وخيارات المحول البرمجي والمزيد.

تعرّف على المزيد حول _config.yml Configuration.

إنشاء وتحرير المحتوى

يتبع إنشاء صفحات على موقعك وتحريرها تجربة GitHub القياسية. تتمتع الملفات التي تستخدمها لموقع GitHub Pages على الويب بجميع المزايا نفسها مثل الملفات الأخرى في مستودع GitHub الخاص بك. يمكنك تحريرها باستخدام أي أدوات، وإنشاء فروع ودمجها، والارتباط بالمشكلات أو طلبات السحب.

بالإضافة إلى Markdown وHTML، يدعم Jekyll بناء Liquid جملة لغة القالب. إن Liquid يتيح للمستخدمين إدخال المتغيرات ديناميكياً وبنى التدفق المنطقي الأساسي في ملفات المحتوى الخاصة بهم. عند التحويل البرمجي، المنتج النهائي هو HTML القياسي.

يوضح المثال التالي مجموعة من for التكرار الحلقي والإدراج المتغير.

<ul>
  {% for post in site.posts %}
    <li>
      <h2><a href="{{ post.url }}">{{ post.title }}</a></h2>
      {{ post.excerpt }}
    </li>
  {% endfor %}
</ul>

تعرف على المزيد حول لغة قالب Liquid.

العمل مع منشورات المدونة

على الرغم من عدم وجود قاعدة بيانات للعمل بها، لا يزال Jekyll يدعم مفهوم كتابة المدونة باستخدام اصطلاح محدد: _posts/2020-06-25-blog-post-name.md. كما يمكنك الاستنتاج على الأرجح، يتم تخزين جميع منشورات المدونة في _posts المجلد واستخدام اصطلاح التاريخ والاسم كما هو موضح. أثناء التحويل البرمجي، يعالج Jekyll الملفات الموجودة في هذا المجلد لإنتاج قائمة بمنشورات مدونة HTML.

يوضح المثال التالي بنية منشور مدونة بسيط. ويتضمن بيانات التعريف ل subtitleو tagsو.comments قد لا يعتمد النسق الذي تختاره بيانات التعريف هذه.

---
layout: post
title: Blog post title rendered by theme
subtitle: Blog post subtitle rendered by theme
tags: welcoming
comments: true
---

This is the first line of rendered content in the post.

تعرّف على المزيد حول إضافة محتوى إلى موقع GitHub Pages باستخدام Jekyll.