ヘッダー カテゴリー ナビバー

テーマコンポーネント
,
21

問題が解決しました。左上にのみ表示され、全幅表示されません。全幅とヘッダーの検索テーマコンポーネントを使用しています。プラグインはインストールしていません。

image (1)
image (1)1894×127 7.38 KB

「いいね！」 2
22

ヘッダーカテゴリのナビバーとフル幅コンポーネントを組み合わせると、問題を再現できます。

「いいね！」 3
23

これをフル幅コンポーネントと連携させるには、テーマにいくつかのCSSを追加する必要があります…

以下のようなものが、より良い状態にするのに役立つはずです：

html:not(.has-full-page-chat) .custom-categories-navbar {
  grid-column-start: 1;
  grid-column-end: -1;
}

.has-sidebar-page .d-header > .wrap .contents {
  gap: 0 1em;
}
「いいね！」 4
24

ありがとうございます、これで問題が解決しました！

また、そこに表示されるカテゴリを並べ替える方法はありますか？

「いいね！」 1
25

カテゴリページと同じ順序だと思います。Reordering categories and setting fixed category positions で変更できます。

「いいね！」 3
26

次の問題：

image
image1390×125 10.8 KB

トピック内でカテゴリをクリックしようとすると、
次のようになります。

image
image1662×113 6.46 KB

メニューが消えます。

コンソールエラー：

custom-categories-navbar.js:64 Uncaught (in promise)
TypeError: Cannot read properties of null (reading 'scrollIntoView')
    at n.setActiveSlug (custom-categories-navbar.js:64:52)
    at new n (custom-categories-navbar.js:48:12)
    at EmberGlimmerComponentManager.createComponent (base-component-manager.js:26:14)
    at EmberGlimmerComponentManager.createComponent (ember-component-manager.js:51:29)
    at M.create (manager.js:543:1)
    at Object.evaluate (runtime.js:2676:1)
    at Object.evaluate (runtime.js:1052:1)
    at It.evaluateSyscall (runtime.js:4204:1)
    at It.evaluateInner (runtime.js:4175:1)
    at It.evaluateOuter (runtime.js:4168:1)
    at Wt.next (runtime.js:4999:1)
    at Wt._execute (runtime.js:4986:1)
    at Wt.execute (runtime.js:4979:1)
    at $t.insertItem (runtime.js:4468:1)
    at $t.sync (runtime.js:4429:1)
    at $t.evaluate (runtime.js:4366:1)
    at Dt._execute (runtime.js:4247:1)
    at Dt.execute (runtime.js:4232:1)
    at qt.rerender (runtime.js:4547:1)
    at index.js:4674:1
    at index.js:4934:1
    at Nt (runtime.js:4080:1)
    at gr._renderRoots (index.js:4916:1)
    at gr._renderRootsTransaction (index.js:4960:1)
    at gr._revalidate (index.js:4992:1)
    at invoke (backburner.js.js:280:1)
    at h.flush (backburner.js.js:197:1)
    at p.flush (backburner.js.js:358:1)
    at B._end (backburner.js.js:798:1)
    at B.end (backburner.js.js:589:1)
    at B._run (backburner.js.js:842:1)
    at B._join (backburner.js.js:819:1)
    at B.join (backburner.js.js:629:1)
    at Array.<anonymous> (index.js:4765:1)
    at B._trigger (backburner.js.js:896:1)
    at B._end (backburner.js.js:811:1)
    at B._boundAutorunEnd (backburner.js.js:523:1)
「いいね！」 3
27

ここでも同じ問題が発生しています

再現方法：カテゴリをクリック + F5

「いいね！」 5
28

いくつか修正を加えたので、これで解決するはずです。

「いいね！」 5
29

修正いただきありがとうございます！

サイドバーのソート順をヘッダーカテゴリナビバーにも適用するオプションを追加することを検討していただけますでしょうか？これにより、ユーザーがヘッダーカテゴリナビバーに独自の選択を適用する機会が得られます。

「いいね！」 1
30

これは役立ちますが、もう機能しません。こちらをお試しください

html:not(.has-full-page-chat) .d-header:has(.horizontal-overflow-nav) {
    height: 5em !important;
}
「いいね！」 2
31

最初の投稿のプレビューリンクで「ページが見つかりません」というエラーが表示されています

「いいね！」 2
32

ああ、申し訳ありません。今もう一度お試しください。:+1:

「いいね！」 1
33

ロゴの横にナビバーをヘッダーに含めることは可能ですか？カテゴリが少数しかない場合。

よろしくお願いいたします。
Olle

34

お役に立てて嬉しいです。ありがとうございます。

ウェブサイトのナビゲーションバーを中央揃えにすることは可能でしょうか？

ナビゲーションバーをロゴがあるヘッダーに含めることは可能でしょうか？

また、ヘッダーがないにもかかわらずナビゲーションバーが表示される /login および /signup ページでナビゲーションバーを非表示にすることは可能でしょうか？

よろしくお願いいたします。
Olle