こんにちは、アイコンのカスタマイズについて質問があります。サイト全体でアイコンを置き換えるのではなく、たとえばメッセージを送信するためだけにプラス記号「+」を紙飛行機のアイコンに変更したい場合、サイト全体の「+」アイコンがすべて置き換わってしまいます。ドキュメントでこのオプションを見逃していない限り、アイコンを特定して置き換えることができるID/クラスまたはアイテムを指定する機能があれば、非常にありがたいです。
「いいね！」 1
CSS を使用すると、アイコンの特定のインスタンスをターゲットにして置き換えることができます。
このトピックには、いくつかの情報が含まれているようです。
それを試しましたが、最近インストールしたディスコースでは機能しませんでした。また、指定したアイコンセレクターに基づいてすべてのアイコンが置き換えられるため、単一のアイコンインスタンスを置き換えることはできません。
現在、新しいトピックのアイコンを置き換える方法は次のとおりです。
api.onPageChange(() => {
const button = document.querySelector("#create-topic");
if (button) {
const oldSvg = button.querySelector("svg");
if (oldSvg) {
oldSvg.remove();
}
const ns = "http://www.w3.org/2000/svg";
const svg = document.createElementNS(ns, "svg");
svg.setAttribute("xmlns", ns);
svg.setAttribute("viewBox", "10 10 30 30");
svg.setAttribute("width", "28");
svg.setAttribute("height", "28");
svg.setAttribute("class", "svg-icon custom-icon");
svg.innerHTML = `
(svg アイコンコードをここに挿入)
`;
button.insertBefore(svg, button.firstChild);
}
});
私が望む領域でこれを複製することはできますが、共有されたリンクで言及されているように、グローバルなアイコン置換を行う必要があったコンポーザーアイコンではあまりうまくいきません。
現時点では、特別な場合を除いて不可能です。
このトピックは重複したリクエストのため、Change single instance of icon を優先してこちらを閉じます。そこにはCSS経由でアイコンを追加する方法の例も含まれています。
そちらで投票していただき、必要であればさらに詳細を追加してください。
「いいね！」 3