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

[j.jaffeux (Joffrey Jaffeux)]

أضفت هذه الميزة منذ فترة وأدركت أنني لم أنشر عنها. يمكنك الآن استخدام صيغة خاصة في 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" على العنصر.

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

Placeholder Forms

Summary Placeholder Forms will let you build dynamic documentation, by creating a form that replaces any occurrence of a =PATTERN= in your post with the value from a text or selectable input field. Preview Preview on Discourse Theme Creator Repository Link https://github.com/discourse/discourse-placeholder-theme-component New to Discourse Themes? Beginner’s guide to using Discourse Themes Install this theme component …

[lcestou (Lutechi)]

Hello Joffrey,

Thanks for suggesting this feature in the other topic.

I was excited to try to use it and see if it worked for my case, however I encountered a problem.

It seems to ignore attribute names that has multiple hyphens in between and defaults to only pick the characters after the last hyphen.

I am using v2.4.0.beta2 +33, I apologize if this has been fixed in a newer commit since.

Examples:

// No multiple hyphen this works fine: data-bloodmallet="chart".
[wrap=test bloodmallet=chart]Content[/wrap]

// This way it omits "user" from the attribute name and output is data-id="1" instead of data-user-id="1".
[wrap=test2 user-id=1]Content[/wrap]

This following request is optional: Is there a way to not wrap the content inside the div with <p> tag?

Thanks for this feature and hopefully I can use it to fix my problem!

[j.jaffeux (Joffrey Jaffeux)]

I can fix the first issue

[j.jaffeux (Joffrey Jaffeux)]

I just pushed a fix for this, slight difference is that I won’t support foo-bar but fooBar. So you can now write:

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

And you will get:

<div data-wrap="foo" data-user-id="1">
</div>

[4ong (Anatol Myshkin)]

مرحباً @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

[j.jaffeux (Joffrey Jaffeux)]

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

[4ong (Anatol Myshkin)]

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

[sam (Sam Saffron)]

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

```customblock param=1
```

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

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

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

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

GitHub - discourse/discourse-mermaid-theme-component

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