Custom Header Links

Hey @andreas_can Metaへようこそ :wave:

このコンポーネントは、各リンクのテキストに基づいてCSSクラスを追加します。追加されるクラスは、リンクに指定したテキストと同じですが、スペースはハイフン(-)に置き換えられ、テキストは小文字に設定されます。その後、文字列 -custom-header-links が末尾に追加されます。

たとえば、テキストが

privacy

のリンクを追加すると、リンク要素には

privacy-custom-header-links

というクラスが追加されます。

リンクテキストが

Visit Shop

の場合は、CSSクラスは

visit-shop-custom-header-links

になります。

これで、各リンクに追加されるクラスがわかりました。ご質問に戻ります。

Discourseは、ユーザーがログインしていない場合に<html>タグにCSSクラスを追加します。そのクラスは

anon

です。

そのため、ログインしていないユーザーに対して特定のリンクを非表示にするために、それを使用できます。たとえば、テキストが

Customer Support

のリンクがあり、ログインしていないユーザーに表示したくないとします。

その場合、このCSSを

.anon {
  .customer-support-custom-header-links {
    display: none;
  }
}

メインテーマの common > CSS タブに追加します。

これにより、ログインしていないユーザーに対して、その特定のリンクが非表示になります。

「いいね!」 11