The Reftagger library allows you to convert bible references on your Discourse forum into links with a hover-preview.
By request of @outofthebox we made a theme component based on this code.
I’ve added a setting that allows you to select the translation you want to use, and the component extends the content security policy to allow for the reftagger library to be included.
Repository here.
@RGJ, our community loves this feature. Thank you for developing in a secure and customizable manner. I appreciate your generosity in sharing this work back to the Discourse community.
We’ve been using that for the last 18 months or so, and it’s worked like a charm. Happy to see it improved and made more easily available!
Wow, that’s super cool.
I would love to see a similar component in which custom keywords and previews can be defined.
That would be super useful to create a glossary for example
There is the auto abbrify words theme component which does such a thing.
I really appreciate you and everyone who contributed to the original conversation on Meta about how to make this feature work!
Hello everyone, Reftagger was working swimmingly for a few months, and then it just stopped. It will still automatically generate an external link for the book/chapter/verse format, but it will not load the hover preview.
It appears to be up to date too. Any ideas?
What Discourse version are you running?
How can I find this info?
It should be somewhere in the admin dashboard at /admin
Seems to be working fine on Discourse 2.7.7 (at least in Safari) for me.
It’s working again now.
Reftagger apparently switched to a different CDN (reftagger.bibliacdn.com) which had to be whitelisted in the content security policy. I have added it and pushed a new version of the theme component. All you need to do is update the component.
There it is, thank you sir 
مرحباً ريتشارد،
أقوم بفحص موضوع قديم. لقد قمت بتثبيت مكون السمة هذا ويحدث شيئان.
الأول هو الرسالة التي تفيد بأن المكون يحتاج إلى تحديث.
[إشعار المسؤول] السمة ‘Reftagger’ تحتوي على رمز يحتاج إلى تحديث. (المعرف: discourse.script-tag-discourse-plugin) (اعرف المزيد)
الثاني قد يكون متعلقًا بالإشعار الأول حيث يحتاج المكون إلى تحديث. لا يتم وضع علامة على المراجع وتبدو الصفحات معلقة مع عرض دائرة التحميل في علامة تبويب المتصفح.
هل سيكون من الممكن تحديث هذا المكون؟
لقد أحرزت بعض التقدم في هذا باستخدام ChatGPT ولديّ علامات مرجعية عاملة لكليهما باستخدام Logos RefTagger و Blue Letter Bible.
إذا كان يمكن تجميع هذه في مكون سمة للاستخدام المجتمعي، فهذا رائع، وإذا لم يكن كذلك، فإن مكون السمة هو ببساطة لإنشاء. تحتاج فقط إلى أخذ الكود لأي منهما تفضله ووضعه في علامة التبويب JS لمكون سمة جديد. تحتاج إلى إزالة الكود الافتراضي الموجود في علامة التبويب JS من Discourse.
إذا كان لدى أي شخص ملاحظات حول كيفية التحسين، فهي مرحب بها. مهاراتي تقتصر على توجيه LLM.
باستخدام Logos RefTagger:
import { apiInitializer } from “discourse/lib/api”؛
import loadScript from “discourse/lib/load-script”؛export default apiInitializer(“0.1”, (api) =\u003e {
// 1. حدد إعدادات RefTagger على النافذة قبل تحميل البرنامج النصي
window.refTagger = {
settings: {
bibleVersion: “ESV”، // على سبيل المثال، إصدار الكتاب المقدس الافتراضي
tagChapters: true، // وضع علامة على مراجع الفصول أيضًا
convertHyperlinks: false، // لا تضع علامة على الروابط الموجودة مرة أخرى
roundCorners: true،
socialSharing: ،
}
};// 2. ربط عرض منشور Discourse:
api.decorateCooked((element) =\u003e {
// تحميل برنامج RefTagger النصي الخارجي (إذا لم يتم تحميله بالفعل)
loadScript(“https://api.reftagger.com/v2/RefTagger.js”).then(() =\u003e {
// تشغيل وضع العلامات على عنصر المحتوى الجديد
window.refTagger.tag(element);
});
});
});
باستخدام BLB ScriptTagger:
import { apiInitializer } from “discourse/lib/api”؛
import loadScript from “discourse/lib/load-script”؛export default apiInitializer(“0.1”, (api) =\u003e {
// اختياريًا، قم بتعيين إعدادات BLB ScriptTagger قبل التحميل (الإعدادات الافتراضية موضحة)
window.BLB ||= {}; // تأكد من وجود كائن BLB العام
window.BLB.Tagger ||= {};
window.BLB.Tagger.Translation = “NKJV”; // إصدار الترجمة الافتراضي
window.BLB.Tagger.HyperLinks = “all”; // وضع علامة على المراجع المرتبطة بالفعل
window.BLB.Tagger.TargetNewWindow = true; // تفتح الروابط في علامة تبويب جديدة
// … (إعدادات أخرى مثل DarkTheme، إلخ، حسب الحاجة)api.decorateCooked((elem) =\u003e {
loadScript(“https://www.blueletterbible.org/assets/scripts/blbToolTip/BLB_ScriptTagger-min.js”)
.then(() =\u003e {
if (window.BLB \u0026\u0026 window.BLB.Tagger) {
window.BLB.Tagger.pageInit(); // إعادة مسح المحتوى الجديد للآيات:contentReference[oaicite:6]{index=6}
}
});
});
});
تم حل هذا الآن.
هذا لا يمكنني إعادة إنتاجه، حتى قبل حل المشكلة المذكورة أعلاه - والتي كانت مجرد تحذير، وليست خطأ.
ممتن جدًا للتحديث!
