إضافات MD Composer

[Steven]

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

التوافق

يعتبر مكون هذا القالب بديلاً لـ شريط تنسيق Discourse، ولا أنصح باستخدامهما معًا.

أنصح باستخدام الإضافة، ولكن إذا لم ترغب في (أو لم تستطع) تثبيت إضافة، فقد يضيف هذا المكون خيارات كافية في المحرر لتلبية احتياجاتك.

أيضًا، لتكييف المكون مع الأجهزة المحمولة، قمت بإخفاء بعض الأزرار: القائمة النقطية، القائمة، والمحاذاة الممتدة. فقد بدت هذه الأزرار الأقل فائدة على هذه الأجهزة.

بالنسبة للمنتديات التي تستخدم لغات من اليمين إلى اليسار، إليك الإصدار المخصص لذلك: GitHub - MonDiscourse/md-composer-extras-rtl: Add some formatting option in your discourse composer (rtl version) · GitHub

أخبرني إذا واجهت أي مشكلة!

	معاينة	md-composer-extras - معاينة
	المستودع	md-composer-extras
	دليل التثبيت	كيفية تثبيت قالب أو مكون قالب
	جديد في قوالب Discourse؟	دليل المبتدئين لاستخدام قوالب Discourse

[Anatolia]

It becomes like this if I use alignin together with underline.

[Steven]

That’s a limitation of the div align code, you need to add a line between the div align and your text

<div align="center">

[u]underline[/u]
</div>

That’s why I used a bbcode in my formatting toolbar, but I could only use the div in this theme component.

I’ll probably add an extra line by default and a little explanation

[Steven]

I upgraded the component to add those extra lines by default, now, when you use a align button and the underline button, you’ll have something like this

[tophee (Christoph)]

@Steven

I recommend the plugin

What are the disadvantages of using the theme-component?

[Steven]

The plugin is easier to customize, we can choose which buttons will appear or not, and there are some additional options like color or a float button that can do something like this with the image

[jtbayly]

ما يمكن إنجازه باستخدام مكونات السمات مذهل حقًا! أحسنت.

[verilog15 (verilog)]

أحسنتَ
هل تظن أنه من الممكن تحويل وسوم HTML إلى وسم افتراضي مثل [Center]، ثم يقوم شيء ما في الخلفية بإعادته مرة أخرى (لأسباب تتعلق بواجهة المستخدم)؟

[Steven]

في ذلك الوقت، لم يكن من الممكن إنشاء بعض أكواد BB بسهولة باستخدام مكونات السمات، ولا أعرف ما إذا كان ذلك ممكناً الآن.

في الوقت الحالي، إذا كنت ترغب في إضافة محاذاة للوسط وأزرار في محرر الرسائل، فإن أفضل طريقة هي استخدام الإضافة: Formatting toolbar

[Johani (Joe)]

ستظل علامة مثل [center] تتطلب إضافة، لكنك محق يا @Steven

في وقت إنشاء هذا المكون، كان عليك استخدام علامات HTML <div>. ومع ذلك، يمكنك الآن استخدام [wrap="foo"][/wrap] في السمات أو المكونات.

يمكنك قراءة المزيد حول ذلك هنا:

Generic bbcode wrapper for theme components

I added this feature a while back and realised I didn’t post about it. You can now use a special syntax in markdown to have it cooked and usable in theme components without having to write a plugin. // wrapped in div.d-wrap [wrap=baz foo=bar]Content[/wrap] // wrapped in div.d-wrap [wrap=baz foo=bar] Content [/wrap] // wrapped in div.d-wrap [wrap=baz foo=bar] [/wrap] // this one will be rendered as a span.d-wrap instead of a div.d-wrap a [wrap=baz]Content[/wrap] b The name of the component w…

إليك مثال بسيط:

[wrap="center"] 
نص مضمّح في المنتصف 
[/wrap]

سيؤدي ذلك إلى إنشاء هذا الوسم عند معالجة المنشور:

<div class="d-wrap" data-wrap="center">
  <p>نص مضمّح في المنتصف</p>
</div>

يمكنك بعد ذلك استهدافه باستخدام مُحدد سمة CSS على النحو التالي:

[data-wrap="center"] {
  text-align: center;
}

وسينتج عن ذلك شيء مثل هذا في معاينة المحرر وفي المنشور المعالج:

أو:

[wrap="right"] 
نص مضمّح على اليمين 
[/wrap]

وسينتج عن ذلك هذا الوسم المعالج:

<div class="d-wrap" data-wrap="right">
  <p>نص مضمّح في المنتصف</p>
</div>

يمكنك بعد ذلك إضافة كود CSS التالي:

[data-wrap="right"] {
  text-align: right;
}

ليكون الناتج النهائي:

بما أن المكون يستخدم حاليًا سمة HTML align، فإن هذا التغيير يجب أن يكون متوافقًا بالكامل مع الإصدارات السابقة (100% backwards compatible).

جرّب ذلك متى ما أتيحت لك الفرصة، ولا تتردد في مراسلتي عبر الرسائل الخاصة إذا كان لديك أي أسئلة حول ذلك.

[thwright]

لقد قمت للتو بإرسال طلبات دمج (pull requests) لمكونات التغليف.

https://github.com/iunctis/md-composer-extras/pull/1
https://github.com/iunctis/md-composer-extras/pull/2
https://github.com/iunctis/md-composer-extras/pull/3

[thwright]

لقد أضفت طلبات سحب إضافية لـ float left، مع خيار CSS لـ float right، ونقلت زر شطب النص ليكون مع أزرار التمييز العريض والمائل والتسطير، وأنشأت زر أعمدة أساسي. قد يكون الأخير أفضل كعنصر مستقل أو يتم نقله إلى القائمة المنبثقة.

لقد أزلت طلب السحب؛ فهو يحتاج إلى تعديلات إضافية. أنا أيضًا أبحث عن إضافة أزرار الأس العليا والأس السفلى، ولكن بمجرد إضافة أحداث التقويم وSlick والبلاطات، يصبح هناك عدد كبير جدًا من الأزرار في المحرر على الإصدار العمودي للجوال. لا ينبغي أن يكون ذلك مشكلة في الإصدار الأفقي، ولكن إذا كان يجب أن تكون جميع الأزرار قابلة للوصول من أي قائمة، فيجب نقلها إلى القائمة المنبثقة.

أي أفكار، يا @Steven، حول كيفية رغبتك في التعامل مع هذا؟

سأقوم فقط بتقسيم ملف js الرئيسي إلى ملفين والعمل على بعض تنسيقات CSS المتجاوبة.

من الناحية المثالية، يجب أيضًا إضافة إعدادات لتعطيل/إخفاء الأزرار حسب الرغبة.

---

تعديل: لقد طبقت التغييرات المذكورة (لكن العناصر لا تملك خيارًا للإخفاء خارج CSS) وأحتاج فقط إلى اختبار التغييرات قبل تقديم طلب سحب.

[thwright]

يجب أن يكون طلب السحب هذا جيدًا الآن، @Steven.

https://github.com/iunctis/md-composer-extras/pull/8

يُنفذ هذا الطلب السحب الاستجابة، والطفو، والأعمدة، والرفع، والخفض. راجع ملف README لمعرفة كيفية عمل الأعمدة.

[ondrej]

مرحبًا،
لا أعرف السبب في حصولي على هذه الرسالة. لقد قمت برفعها في اليوم الآخر. أنا على أحدث إصدار من هذا التطبيق، على الأقل هذا ما يخبرني به.
شكرًا لك

[Steven]

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

هل يمكنك تجربة حذف المكون وإعادة تثبيته؟ يبدو أنه معطّل في منتداك.

أو هل تستخدم أيضًا إضافة شريط أدوات التنسيق؟ قد يؤدي ذلك إلى إنشاء أيقونات مكررة.

[ondrej]

حسنًا، شكرًا لك. سأبحث وأفعل ما تقوله. وكل عام وأنت بخير أيضًا

[zuker (Matías)]

هل من الممكن إخفاء بعض الأيقونات؟

[Steven]

أيها تريد إخفاؤه؟ سأساعدك في ذلك

[zuker (Matías)]

strike, sub, sup شكراً!

[Steven]

الطريقة الأسهل هي إضافة سطور CSS هذه في قالبك، ضمن عام > CSS

.d-editor-button-bar .strikethrough_button, .d-editor-button-bar .superscript_button, .d-editor-button-bar .subscript_button {
    display: none;
}