Reftagger テーマコンポーネント

カスタマイズ テーマコンポーネント
1

Reftagger ライブラリを使用すると、Discourse フォーラム上の聖書参照を、ホバー時にプレビューが表示されるリンクに変換できます。

@outofthebox からのリクエストにより、こちらのコード を基にしたテーマコンポーネントを作成しました。

使用する翻訳を選択できる設定を追加し、Reftagger ライブラリを含めるためにコンテンツセキュリティポリシーを拡張しています。

リポジトリはこちらです。

「いいね！」 13
2

@RGJ さん、私たちのコミュニティはこの機能を大好きです。安全でカスタマイズ可能な形で開発していただき、ありがとうございます。この作業を Discourse コミュニティと共有してくださるあなたの寛大さに感謝しています。

「いいね！」 5
3

過去 18 ヶ月ほどそれを使っており、非常にうまく機能していました。それが改良され、より利用しやすくなったことを嬉しく思います！

「いいね！」 3
4

ええ、それはとても素晴らしいですね。

カスタムキーワードやプレビューを定義できる同様のコンポーネントがあれば嬉しいです。
例えば、用語集を作成する際に非常に役立ちます。

「いいね！」 1
5

そのような機能を実装するauto abbrify wordsというテーマコンポーネントがあります。

「いいね！」 3
6

この機能をどのように実現するかについて、Metaで行われた元のスレッドに貢献してくださった皆様、そしてあなたに心から感謝しています！

「いいね！」 2
7

みなさんこんにちは。Reftagger は数ヶ月間問題なく動作していましたが、突然機能しなくなりました。書籍/章/節の形式の外部リンクは自動生成されますが、ホバー時のプレビューが表示されません。

Screenshot 2021-08-28 132207
Screenshot 2021-08-28 1322071393×432 39.4 KB

バージョンも最新になっているようです。何か心当たりはありますか？

「いいね！」 1
8

どのバージョンの Discourse を使用していますか？

「いいね！」 1
9

この情報はどのようにして見つけられますか？

10

/admin の管理ダッシュボード somewhere にあるはずです。

11

「最新の状態です」と表示されているだけです：

Image 111
Image 111745×611 16.8 KB

「いいね！」 1
12

Discourse 2.7.7（少なくとも Safari）では、私の環境では問題なく動作しているようです。

13

現在は正常に動作しています。
Reftagger は、コンテンツセキュリティポリシーで許可リストに追加する必要があった異なる CDN（reftagger.bibliacdn.com）に切り替わっていたようです。これを追加し、テーマコンポーネントの新しいバージョンをプッシュしました。必要なのは、コンポーネントを更新することだけです。

「いいね！」 3
14

そこです、ありがとうございます :slightly_smiling_face:

「いいね！」 1
15

リチャード様

古いスレッドを再確認しています。このテーマコンポーネントをインストールしたところ、2つの問題が発生しています。

1つ目は、コンポーネントのアップデートが必要であるというメッセージです。
[管理者通知] テーマ ‘Reftagger’ には、アップデートが必要なコードが含まれています。(id:discourse.script-tag-discourse-plugin) (詳細はこちら)

2つ目は、コンポーネントのアップデートが必要であるという最初の通知に関連している可能性があります。参照がタグ付けされておらず、ブラウザのタブでローディングサークルが表示されてページがハングしているようです。

このコンポーネントをアップデートしていただけますでしょうか？

16

ChatGPT を使用して、Logos RefTagger と Blue Letter Bible の両方の作業用 reftagger を作成することができました。

これらをコミュニティで使用できるテーマコンポーネントにバンドルできれば素晴らしいですが、そうでない場合は、テーマコンポーネントは単に作成するだけです。お好みのどちらかのコードを取得し、新しいテーマコンポーネントの JS タブに配置するだけです。Discourse の JS タブにあるデフォルトのコードを削除する必要があります。

改善点についてフィードバックがあれば歓迎します。私のスキルは LLM をガイドする程度です。

Logos RefTagger を使用:

import { apiInitializer } from "discourse/lib/api";
import loadScript from "discourse/lib/load-script";

export default apiInitializer("0.1", (api) => {
  // 1. スクリプトをロードする前に window で RefTagger 設定を定義します
  window.refTagger = {
    settings: {
      bibleVersion: "ESV",       // 例: デフォルトの聖書バージョン
      tagChapters: true,         // 章の参照もタグ付けする
      convertHyperlinks: false,  // 既存のリンクを再タグ付けしない
      roundCorners: true,
      socialSharing: [],
    }
  };

  // 2. Discourse の投稿レンダリングにフックします:
  api.decorateCooked((element) => {
    // 外部 RefTagger スクリプトをロードします (まだロードされていない場合)
    loadScript("https://api.reftagger.com/v2/RefTagger.js").then(() => {
      // 新しいコンテンツ要素でタグ付けを実行します
      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) => {
  // オプションで、ロード前に 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) => {
    loadScript("https://www.blueletterbible.org/assets/scripts/blbToolTip/BLB_ScriptTagger-min.js")
      .then(() => {
        if (window.BLB && window.BLB.Tagger) {
          window.BLB.Tagger.pageInit();  // 新しいコンテンツで聖句を再スキャンします:contentReference
        }
      });
  });
});
17

これは現在解決済みです。

これは、上記の問題を解決する前でさえ（これは単なる警告であり、エラーではありませんでした）、再現できません。

「いいね！」 3
18

アップデートに大変感謝しています！

「いいね！」 2