مرحباً -
لم أتمكن بعد من تشغيل هذا بأي من الطرق التي وجدتها، وأود أن أعرف ما إذا كانت توقعاتي خاطئة فقط.
أنا أتكامل مع تثبيت pretix الخاص بي (لبيع تذاكر الفعاليات). يجب أن يتكون هذا ببساطة من إضافة HTML إلى منشور، والتأكد من تضمين HTML و CSS الخاص بـ pretix.
<link rel="stylesheet" type="text/css" href="https://pretix.eu/demo/democon/widget/v1.css">
<script type="text/javascript" src="https://pretix.eu/widget/v1.en.js" async></script>
<!-- في مكان آخر، في منشور -->
<pretix-widget event="https://pretix.eu/demo/democon/"></pretix-widget>
<noscript>
<div class="pretix-widget">
<div class="pretix-widget-info-message">
JavaScript is disabled in your browser. To access our ticket shop without JavaScript,
please <a target="_blank" href="https://pretix.eu/demo/democon/">click here</a>.
</div>
</div>
</noscript>
من الواضح أن نصوص pretix البرمجية تفحص المستند بحثًا عن العناصر المناسبة حسب العلامة، ثم تستبدلها بإدخالات قابلة للتخصيص (كما أسعى إليه)
أعتقد أنه يمكنني (وأرغب في) تحقيق هذا التكامل بشكل خفيف، وكنت أفكر في أنه يمكنني ببساطة استخدام مكونات السمات المخصصة لتحقيق ذلك عن طريق تضمين نصوص وأساليب pretix الخارجية، وإضافة HTML الخاص بالـ widget إلى المنشورات (أي، مع مجرد “تكوين”).
واجهت أولاً حمايات CSP (جيد) وقائمة السماح (جيد أيضًا). وبالمثل، لقد أضفت تكوين CSP، ولكن الآن يبدو أنني لا أستطيع تعديل قائمة السماح دون تعديلات فعلية على الكود - لذلك أجد نفسي مضطرًا إلى إدراج HTML “منكه” في المنشورات، ثم محاولة تعديلها بعد العرض.
شرعت في محاولة استخدام بعض JavaScript الخفيفة في مواصفات مكون السمة (فقط كبرنامج نصي مضمن) - شيء مثل هذا، باستخدام استثناء [data-*] الخاص بقائمة السماح
function upgradeWidgets() {
const divsWithDataEvent = document.querySelectorAll('div[data-event]');
divsWithDataEvent.forEach((div) => {
const attributes = div.attributes;
for (let i = 0; i < attributes.length; i++) {
const attr = attributes[i];
if (attr.nodeName.startsWith('data-')) {
const newAttrName = attr.nodeName.replace('data-', '');
const attrValue = attr.nodeValue;
div.setAttribute(newAttrName, attrValue);
div.removeAttribute(attr.nodeName);
}
}
});
}
بالطبع، هذا يخضع الآن لمشاكل التوقيت - لا يمكنني ربطه بـ onload (هل يتم إزالة البرنامج النصي من مكون السمة؟!) وكل حدث DOM آخر يمكنني التقاطه من البرامج النصية ليس في نقطة يكون فيها HTML هذا متاحًا بشكل موثوق في المستند.
أنا متأكد من أن هناك طريقة معينة خاصة بـ Discourse للقيام بكل هذا - لكنني كنت آمل ألا أكون خبيرًا في هذا المجال لإجراء هذا النوع من التكامل الخفيف.
يسعدني الحصول على بعض التوجيهات هنا.