ホームページのロゴをクリックしたときにエラーが発生する

こんにちは。
画像で説明します。
最後のアップデート前にこのエラーが出ていました。
アップデートをインストールした後もこのエラーが出続けます。

(Güncel - 現在)
Ekran görüntüsü 2024-05-03 153512

そして、サイトからすべてのコードを削除してもう一度試しましたが、エラーは解消されませんでした。

翻訳
間違い
何か問題が発生しました。

セーフモードでも発生しますか?また、それをクリックしたときにブラウザのコンソールでエラーを確認したり、/logs を調べて詳細を確認したりすることもできますか?

「いいね!」 1

セーフモードが有効になっており、ログページにエラーは表示されていません。理解できていないのかもしれません。

最後のログ。
Ekran görüntüsü 2024-05-03 154929

セーフモードをオフにしようとしましたが、同じエラーが発生します。

ちなみに、2回目にクリックするとエラーが消え、ホームページが表示されます。

テーマコンポーネントの読み込み時やプラグインのアンロード時に、いくつかのエラーが表示されます。

最近のカスタマイズを確認することをお勧めします。

「いいね!」 1

ご関心をお寄せいただきありがとうございます。

最後のプラグイン:GIF

すべてのプラグイン

リモートコンポーネント以外のJSカスタマイズはありますか?

エラーが発生するまで、すべてのコンポーネントを無効にしてから1つずつ有効にしてみてください。

function moveTagsToTitle() {
    const mainLinks = document.querySelectorAll('.main-link');
    mainLinks.forEach(mainLink => {
        const discourseTags = mainLink.querySelector('.discourse-tags');
        const titleElement = mainLink.querySelector('.title');

        if (discourseTags && titleElement) {
            const tags = discourseTags.querySelectorAll('.discourse-tag');

            tags.forEach(tag => {
                const tagSpan = document.createElement('span');
                tagSpan.className = 'discourse-tag box';
                tagSpan.textContent = tag.textContent;
                tagSpan.style.fontSize = 'var(--font-down-2)';
                tagSpan.style.borderRadius = '10px';
                tagSpan.style.border = '1px solid #444460';
                tagSpan.style.backgroundColor = '#1f1f33';
                tagSpan.style.margin = '2px';
                tagSpan.style.display = 'inline-block';
                tagSpan.style.overflow = 'hidden';
                tagSpan.style.whiteSpace = 'nowrap';
                tagSpan.style.textOverflow = 'ellipsis';
                tagSpan.style.verticalAlign = 'middle';
                tagSpan.style.marginRight = '5px';
                tagSpan.style.marginLeft = '-6px';
                titleElement.insertBefore(tagSpan, titleElement.firstChild);
            });

            if (discourseTags.parentNode) {
                discourseTags.parentNode.removeChild(discourseTags);
            }
        }
    });

    const topicHeaderExtras = document.querySelectorAll('.topic-header-extra');

    topicHeaderExtras.forEach(topicHeaderExtra => {
        const discourseTags = topicHeaderExtra.querySelector('.discourse-tags');
        const tags = discourseTags.querySelectorAll('.discourse-tag');

        tags.forEach(tag => {
            tag.className = 'discourse-tag box';

            tag.style.borderRadius = '10px';
            tag.style.border = '1px solid #444460';
            tag.style.backgroundColor = '#1f1f33';
            tag.style.margin = '1px';
            tag.style.padding = '2px 8px';
            tag.style.display = 'inline-block';
            tag.style.overflow = 'hidden';
            tag.style.whiteSpace = 'nowrap';
            tag.style.textOverflow = 'ellipsis';
            tag.style.verticalAlign = 'middle';
            tag.style.marginRight = '5px';
            tag.style.marginBottom = '5px';
        });
    });
}

window.addEventListener('load', moveTagsToTitle);
const observer = new MutationObserver(moveTagsToTitle);
const targetNode = document.body;
const observerOptions = {
    childList: true,
    subtree: true
};
observer.observe(targetNode, observerOptions);

これらのコードがこのエラーを引き起こしています。
どうすれば修正できるかわかりません。
これらのコードが必要です :frowning:

Ember.js コンポーネントを含む要素(ここではタグのリスト)を移動しています。これはコンポーネントのライフサイクルを妨げる可能性が高いと思われます。

最善の方法は API を使用することです。

この場合、次のいずれかになります。

  • 前回のトピックで示したように、プラグインのアウトレットを使用します。ただし、カテゴリ ページでの最新トピックには存在しないため、リクエストする必要があります。

  • テンプレートを上書きします。これは互換性の理由から良い解決策ではありませんが、即時の代替策となります。

「いいね!」 1

これらのコードを見つけました。

これは私が望んでいたものではありませんが、今のところこれで十分でしょう。

 var pElement = document.getElementById('site-logo').parentNode;
                    //var pElement = document.createElement('a');
                    //pElement.innerHTML = aElement.innerHTML;
                    //aElement.replaceWith(pElement);
                    pElement.href = '#';
                    pElement.style.cursor = 'pointer';
                    pElement.onclick = function() {
                      window.location.href = '/';
                    };
                    //document.getElementById('site-logo').parentNode.href = '/';

もし誰か手伝える人がいたら、待っています。ありがとうございます :pray:

そのパスは絶対におすすめしません。それは問題の根本原因を修正するのではなく、副作用に絆創膏を貼るようなものです。それによって、さらに多くの問題が発生します(最新のトピックが上記のコードのために発生したように)。

JSをDiscourseフレンドリーにすることができます(可能な限りプラグインのアウトレットを使用するのが最善の方法です)。
例を挙げます。ページ変更時にAPIを使用し、特定のルートでコードを実行し、リンクの前のHTMLをコピーします(タグをクリックできるように)。

JS
<script type="text/discourse-plugin" version="0.8">
  const { next } = require("@ember/runloop");
  
  function moveTags() {
    const mainLinks = document.querySelectorAll(".main-link:not(.tags-moved)");
    
    mainLinks.forEach((mainLink) => {
      const discourseTags = mainLink.querySelector(".discourse-tags");
      const titleElement = mainLink.querySelector("a[data-topic-id]");

      if (discourseTags && titleElement) {
        titleElement.insertAdjacentHTML("beforebegin", discourseTags.outerHTML);
        mainLink.classList.add('tags-moved');
      }
    });
  }

  api.registerModelTransformer("topic", async (topics) => {
    next(() => {
      moveTags();
    })
  });

  api.onPageChange((url) => {
    if (url.startsWith("/categories")) {
      moveTags();
    }
  });
</script>
CSS
.top-row, 
.link-top-line {
    .discourse-tag {
        font-size: var(--font-down-2) !important;
        padding: 2px 8px;
        margin: 2px 5px 2px -6px;
        border-radius: 10px;
        border: 1px solid #444460;
        background-color: #1f1f33;
    }
    
    .discourse-tag::after {
        content: '' !important;
        margin-left: 0 !important;
    }
}

.bottom-row, 
.link-bottom-line {
    .discourse-tags {
        display: none;
    }
}
「いいね!」 2

こんにちは @Arkshine

ロゴのリンクを変更しても役に立ちませんでした。これらのコードを削除しました。

しかし、他に方法がありません。タグをこのように配置する必要があります。
https://pvpfarm.com

誰かに料金を支払えば、機能するまともなコードを書いてくれるでしょうか?

そして、これらのコードはどこで見つけますか? (JS) GitHub - discourse/discourse: A platform for community discussion. Free, open, simple. からですか?

有料のサポートが必要な場合は、Marketplace でトピックを作成できます。:+1:

「いいね!」 1

#11でそのコードを提供しました。

こんにちは、Arkshineさん。

これらのコードを削除した後、あなたがくれたコードを追加しましたが、動作しません。何か間違っていますか?

私の方では動作しています。

\u003cscript type=\"text/discourse-plugin\" version=\"0.8\"\u003e を維持するようにしてください。そうしないと動作しません。

はい、動作しています!
ただ、小さな間違いが一つあります。
ロゴをクリックすると、タグの数が増えます。

コードを更新しました。

「いいね!」 2

どうお礼を言ったらいいかわかりません。本当にありがとうございます!:pray: :heart:

@Arkshine トピックを再び掘り起こしてしまい申し訳ありません。
重ねてお礼申し上げます。いただいたコードにエラーを見つけました。
手伝っていただけますか?
コードを修正しようとしましたが、できませんでした。

最新セクションでは、最近開かれたタグ付きトピックにタグのみが表示されます。


カテゴリに入ると、タグが表示されません。

@ogulcan1787 コードを更新しました。

「いいね!」 1