مُغلف BBcode عام لمكونات السمة

الأخبار والأحداث إعلانات
1

أضفت هذه الميزة منذ فترة وأدركت أنني لم أنشر عنها. يمكنك الآن استخدام صيغة خاصة في Markdown لتحويلها واستخدامها في مكونات السمة دون الحاجة إلى كتابة إضافة.

// محاطة بـ div.d-wrap
[wrap=baz foo=bar]المحتوى[/wrap]

// محاطة بـ div.d-wrap
[wrap=baz foo=bar]
المحتوى
[/wrap]

// محاطة بـ div.d-wrap
[wrap=baz foo=bar]
[/wrap]

// سيتم عرض هذا كـ span.d-wrap بدلاً من div.d-wrap
a [wrap=baz]المحتوى[/wrap] b

سيتم إضافة اسم المكون كسمة بيانات: data-wrap="baz"، وستكون كل خاصية أيضًا سمة بيانات: data-foo="bar" على العنصر.

إذا أردت الاطلاع على حالة استخدام حقيقية، راجع

20 إعجابًا
Guidance whitelisting arbitrary HTML attributes?
Discourse Coloured Text
MD Composer extras
Adding classes to paragraphs for styling
How to use variables/bbcode in a post?
Interaction among theme component, theme javascript, and "previews"
BBcode color tags in a theme
Best practices for creating custom CSS styles for sections of posts?
Warning, Success & Info Blocks
Help finding a specific post functionality
Hide parts of a post
Add border to image
Adding classes to links in post body for styling
Custom image based on tag?
Topic List Thumbnails
Highlight moderator messages
Best Course of Action on Supporting Custom BBCode?
Discourse Icon
Whitelisting certain CSS tags in posts
Whitelist HTML element which is a custom element (web component)
2

مرحبًا جوفري،

شكرًا لك على اقتراح هذه الميزة في الموضوع الآخر.

كنت متحمسًا لتجربة استخدامها ورؤية ما إذا كانت تعمل في حالتي، ومع ذلك واجهت مشكلة.

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

أنا أستخدم الإصدار v2.4.0.beta2 +33، وأعتذر إذا تم إصلاح هذه المشكلة في إصدار أحدث منذ ذلك الحين.

أمثلة:

// لا توجد شرطات متعددة، هذا يعمل بشكل صحيح: data-bloodmallet="chart".
[wrap=test bloodmallet=chart]المحتوى[/wrap]

// بهذه الطريقة يتم حذف "user" من اسم السمة، وتكون المخرجات data-id="1" بدلاً من data-user-id="1".
[wrap=test2 user-id=1]المحتوى[/wrap]

هذا الطلب اختياري: هل توجد طريقة لعدم تغليف المحتوى داخل div بوسم <p>؟

شكرًا لك على هذه الميزة، وآمل أن أتمكن من استخدامها لحل مشكلتي!

3

يمكنني إصلاح المشكلة الأولى

إعجاب واحد (1)
4

لقد دفعت للتو إصلاحًا لهذه المشكلة، والفرق البسيط هو أنني لن أدعم foo-bar بل fooBar. لذا يمكنك الآن كتابة:

[wrap=foo userId=1]
[/wrap]

وستحصل على:

<div data-wrap="foo" data-user-id="1">
</div>
5 إعجابات
5

مرحباً @j.jaffeux
شكراً لك على هذه الميزة! هل تعرف أفضل طريقة لإضافة ميزة لأشياء مثل

<button class="snipcart-add-item" data-item-id="product-1" data-item-url="/" data-item-name="Product #1" data-item-price="10.99">
  أضف إلى السلة
</button>

في المواضيع. وبشكل عام - لإدراج في القائمة البيضاء

class="snipcart-add-item" data-item-id="product-1"

مثال يعمل - https://codepen.io/thatfrankdev/pen/xxwRXQw

6

يجب عليك تزيين الـ wrap الخاص بك في مكون موضوع، كما نفعل هنا على سبيل المثال: discourse-placeholder-theme-component/javascripts/discourse/initializers/setup.js at main · discourse/discourse-placeholder-theme-component · GitHub

4 إعجابات
7

@j.jaffeux شكراً لك على النصيحة الرائعة!

8

حديثًا قمنا بتوسيع هذا لدعم المكونات العامة باستخدام:

```customblock param=1
```

سيتم ترجمة هذا إلى:

<pre data-code-param="1" data-code-wrap="customblock"><code></code></pre>

وبالتالي، كمكون، يمكنك استخدام data-code-wrap لتحديد معالجة خاصة، ويتم تعطيل تمييز الصيغة.

لقد استخدمنا هذا النمط هنا:

وهو مكون سمة mermaid رسمي.

9 إعجابات