تنزيل md2googleslides - تنزيل كود المصدر md2googleslides

md2googleslides

شفرة المصدر الأخرى

0.5

تنزيل

إنشاء شرائح Google من تخفيض السعر وHTML. قم بالتشغيل من سطر الأوامر أو تضمينه في تطبيق آخر.

تم تطوير هذا المشروع كمثال لكيفية استخدام Slides API.

على الرغم من أنها لا تنتج بعد مجموعات جميلة بشكل مذهل، إلا أننا نشجعك على استخدام هذه الأداة لإنشاء نماذج أولية للعروض التقديمية بسرعة.

المساهمات هي موضع ترحيب.

التثبيت والاستخدام

لاستخدام سطر الأوامر، قم بتثبيت md2gslides عالميًا:

npm install -g md2gslides

ثم احصل على بيانات اعتماد معرف عميل OAuth:

قم بإنشاء (أو إعادة استخدام) مشروع مطور على https://console.developers.google.com
تمكين Google Slides API في صفحة مكتبة API
انتقل إلى صفحة بيانات الاعتماد وانقر على "+ إنشاء بيانات اعتماد" في الأعلى
حدد بيانات اعتماد "معرف عميل OAuth".
اختر نوع "تطبيق الكمبيوتر" وأعطه بعض الاسم.
قم بتنزيل ملف بيانات اعتماد العميل.
انسخه إلى client_id.json (يجب أن يتطابق الاسم) واحفظه في ~/.md2googleslides .

بعد التثبيت، قم باستيراد الشرائح الخاصة بك عن طريق تشغيل:

md2gslides slides.md --title " Talk Title "

سيؤدي هذا إلى إنشاء شرائح Google جديدة في حسابك بعنوان Talk Title .

ملاحظة: في المرة الأولى التي يتم فيها تشغيل الأمر، ستتم مطالبتك بالترخيص. يتم تخزين بيانات اعتماد رمز OAuth محليًا في ملف يُسمى ~/.md2googleslides/credentials.json .

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

 # To reuse deck available at: https://docs.google.com/presentation/d/<some id>/edit#
md2gslides slides.md --title "Talk Title" --append <some id> --erase

قواعد تخفيض السعر المدعومة

يستخدم md2gslides مجموعة فرعية من قواعد CommonMark وGithub Flavored Markdown للتخفيض.

الشرائح

عادةً ما يتم تمثيل كل شريحة برأس، يتبعه صفر أو أكثر من عناصر الكتلة.

ابدأ شريحة جديدة بمسطرة أفقية ( --- ). قد يتم حذف الفاصل للشريحة الأولى.

توضح الأمثلة التالية كيفية إنشاء شرائح ذات تخطيطات مختلفة:

شريحة العنوان

 ---

    # هذه شريحة عنوان
    ## اسمك هنا

شريحة العنوان

شرائح عنوان القسم

 ---

    # هذا عنوان القسم

شريحة عنوان القسم

عنوان القسم وشرائح الجسم

 ---

    # عنوان القسم والشريحة الأساسية

    ## هذا عنوان فرعي

    هذا هو الجسم

عنوان القسم والشريحة الأساسية

شرائح العنوان والجسم

 ---

    # شريحة العنوان والجسم

    هذا هو جسم الشريحة.

العنوان والشريحة الأساسية

شريحة النقطة الرئيسية

أضف {.big} إلى العنوان لإنشاء شريحة تحتوي على نقطة واحدة كبيرة

 ---

    # هذه هي النقطة الرئيسية {.كبيرة}

شريحة النقطة الرئيسية

شريحة ذات أرقام كبيرة

استخدم {.big} على الرأس مع النص أيضًا.

 ---

    # 100% {.كبيرة}

    هذا هو الجسم

شريحة ذات أرقام كبيرة

شريحتان ذات عمودين

افصل بين الأعمدة باستخدام {.column} . يجب أن تظهر العلامة على السطر الخاص بها مع وجود فراغ قبلها وبعدها.

 ---

    # تخطيط عمودين

    هذا هو العمود الأيسر

    {.عمود}

    هذا هو العمود الأيمن

شريحة ذات عمودين

المواضيع

لا يقوم md2googleslides بتحرير أو التحكم في أي خيارات متعلقة بالموضوع. ما عليك سوى تعيين السمة الأساسية التي تريدها على شرائح Google مباشرة. حتى إذا كنت ستستخدم خيار --append لإعادة استخدام المجموعة، فلن يتغير المظهر.

الصور

الصور المضمنة

يمكن وضع الصور على الشرائح باستخدام علامات الصور. يمكن تضمين صور متعددة. يتم ترتيب الصور المتعددة في فقرة واحدة في أعمدة، ويتم ترتيب الفقرات المتعددة في صفوف.

ملاحظة: يتم حاليًا تغيير حجم الصور وتوسيطها لتلائم قالب الشريحة.

 ---

    # يمكن أن تحتوي الشرائح على صور

    ![](https://placekitten.com/900/900)

الشريحة مع الصورة

صور الخلفية

قم بتعيين صورة الخلفية للشريحة عن طريق إضافة {.background} إلى نهاية عنوان URL للصورة.

 ---

    # يمكن أن تحتوي الشرائح على صور خلفية

    ![](https://placekitten.com/1600/900){.background}

الشريحة مع صورة الخلفية

فيديوهات

قم بتضمين مقاطع فيديو YouTube مع علامة صورة معدلة.

 ---

    # يمكن أن تحتوي الشرائح على مقاطع فيديو

    @[youtube](MG8KADiRbOU)

الشريحة مع الفيديو

ملاحظات المتحدث

قم بتضمين ملاحظات المتحدث لشريحة باستخدام تعليقات HTML. قد يتضمن النص الموجود داخل التعليقات تخفيضًا للتنسيق، على الرغم من السماح بتنسيق النص فقط. يتم تجاهل مقاطع الفيديو والصور والجداول داخل ملاحظات المتحدث.

 ---

    # عنوان الشريحة

    ![](https://placekitten.com/1600/900){.background}

    <!--
    هذه هي ملاحظات المتحدث.
    -->

التنسيق

يُسمح بقواعد التنسيق الأساسية، بما في ذلك:

عريض
مائل
شفرة
يتوسطه خط
الارتباطات التشعبية
قوائم مرتبة
قوائم غير مرتبة

يوضح تخفيض السعر التالي بعض الأنماط الشائعة.

 يمكن استخدام **غامق**، و*مائل*، و~~يتوسطه خط~~.

القوائم المرتبة:
1. البند 1
1. البند 2
  1. البند 2.1

قوائم غير مرتبة:
* البند 1
* البند 2
  * البند 2.1

بالإضافة إلى ذلك، يتم دعم مجموعة فرعية من علامات HTML المضمنة للتصميم.

أنماط CSS المدعومة للاستخدام مع عناصر  :

color
background-color
font-weight: bold
font-style: italic
text-decoration: underline
text-decoration: line-through
font-family
font-variant: small-caps
font-size (يجب استخدام النقاط للوحدات)

يمكنك أيضًا استخدام السمات {style="..."} بعد عناصر تخفيض السعر لتطبيق الأنماط. يمكن استخدام هذا في الرؤوس والعناصر المضمنة وكتل التعليمات البرمجية وما إلى ذلك.

الرموز التعبيرية

استخدم الرموز التعبيرية بنمط Github في النص الخاص بك باستخدام :emoji: .

يقوم المثال التالي بإدراج رموز تعبيرية في رأس الشريحة ونصها.

 ### أنا :القلب: القطط

:heart_eyes_cat:

كتل التعليمات البرمجية

يتم دعم كل من كتل التعليمات البرمجية ذات المسافة البادئة والمسيجة، مع تمييز بناء الجملة.

يعرض المثال التالي التعليمات البرمجية المميزة.

 ### مرحبا بالعالم

```جافا سكريبت
console.log('مرحبا بالعالم');
```

لتغيير سمة تمييز بناء الجملة، حدد خيار --style <theme> في سطر الأوامر. جميع سمات Highlight.js مدعومة. على سبيل المثال، لاستخدام موضوع جيثب

md2gslides slides.md --style github

يمكنك أيضًا تطبيق تغييرات إضافية على النمط على الكتلة بأكملها، مثل تغيير حجم الخط:

 ### مرحبا بالعالم

```جافا سكريبت
console.log('مرحبا بالعالم');
```{style="font-size: 36pt"}

الجداول

يتم دعم الجداول عبر بناء جملة GFM.

ملاحظة: قد يؤدي تضمين الجداول وعناصر الكتلة الأخرى في نفس الشريحة إلى نتائج سيئة مع عناصر متداخلة. إما تجنب التخطيط أو ضبطه يدويًا بعد إنشاء الشرائح.

ما يلي يقوم بإنشاء جدول 2x5 على الشريحة.

 ### أفضل الحيوانات الأليفة في الولايات المتحدة

حيوان | رقم
-------|--------
سمك | 142 مليون
القطط | 88 مليون
كلاب | 75 مليون
طيور | 16 مليون

الصور المحلية

الصور التي تشير إلى المسارات المحلية تم تحميلها مؤقتًا واستضافتها على file.io. File.io هي خدمة تقديم ملفات مؤقتة تنشئ عناوين URL عشوائية قصيرة العمر لملف التحميل وتحذف المحتوى بعد وقت قصير من الاستخدام.

نظرًا لأنه يتم تحميل الصور المحلية إلى طرف ثالث، يلزم الاشتراك الصريح لاستخدام هذه الميزة. قم بتضمين خيار --use-fileio للاشتراك في تحميل الصور. ينطبق هذا على الصور المستندة إلى الملفات بالإضافة إلى المحتوى النقطي تلقائيًا مثل التعبيرات الرياضية وSVG.

تنقيط الصورة

يمكن أن تتضمن الشرائح أيضًا صورًا تم إنشاؤها باستخدام كتل مسيجة $$$ للبيانات. الصور التي تم إنشاؤها المدعومة حاليًا هي التعبيرات الرياضية (TeX وMathML) بالإضافة إلى SVG. يتم التعامل مع الصور النقطية كما لو كانت الصور المحلية تتطلب الاشتراك في تحميل الصور إلى خدمة جهة خارجية عبر خيار --use-fileio .

باستخدام تكس:

 # ماذا عن بعض الرياضيات؟

$$$ الرياضيات
cos (2theta) = cos^2 theta - sin^2 theta
$$$

SVG

 # أو بعض SVG؟

$$$ إس في جي
<svg xmlns="http://www.w3.org/2000/svg"
     xmlns:xlink = "http://www.w3.org/1999/xlink"
     viewBox="0 0 48 48">
  <تعريف>
    <معرف المسار = "a" d = "M44.5 20H24v8.5h11.8C34.7 33.9 30.1 37 24 37c-7.2 0-13-5.8-13-13s5.8-13 13-13c3.1 0 5.9 1.1 8.1 2.9l6.4-6.4C34.6 4.1 29.6 2 24 2 11.8 2 2 11.8 2 24s9.8 22 22 22c11 0 21-8 21-22 0-1.3-.2-2.7-.5-4z"/>
  </ ديفس>
  <clipPath معرف = "ب">
    <استخدام xlink:href="#a" overflow="visible"/>
  </clipPath>
  <مسار مقطع المسار = "url (#b)" ملء = "#EA4335" d = "M0 11l17 13 7-6.1L48 14V0H0z"/>
  <مسار مقطع المسار = "url (#b)" ملء = "#34A853" d = "M0 37l30-23 7.9 1L48 0v48H0z"/>
  <مسار مقطع المسار = "url (#b)" ملء = "#4285F4" d = "M48 48L17 24l-4-3 35-10z"/>
</svg>
$$$

مثل الصور المحلية، يتم عرض الصور التي تم إنشاؤها مؤقتًا عبر file.io.

نرحب بطلبات السحب لمولدات الصور الأخرى (مثل حورية البحر، وchartjs، وما إلى ذلك)!