문제가 있습니다. 상단 왼쪽 코너에만 표시되고 전체 너비로 표시되지 않습니다. 전체 너비 및 헤더 검색 테마 구성 요소를 사용하고 있습니다. 플러그인은 설치되어 있지 않습니다.
헤더 카테고리 내비게이션 바와 전체 폭 컴포넌트를 함께 사용했을 때 문제를 재현할 수 있습니다.
전체 폭(full width) 컴포넌트와 함께 이 기능을 작동시키려면 테마에 몇 가지 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;
}
감사합니다, 문제가 해결되었습니다!
또한, 거기에 표시되는 카테고리 정렬 방법이 있는지 궁금합니다.
순서가 카테고리 페이지와 같은 것 같습니다. Reordering categories and setting fixed category positions 링크를 따라가면 변경할 수 있습니다.
다음 문제:
토픽 안에서 카테고리를 클릭하려고 하면 다음과 같은 현상이 발생합니다:
메뉴가 사라집니다.
콘솔 오류:
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 hr.render (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)
여기서도 같은 문제가 발생합니다
재현 방법: 카테고리를 클릭한 후 F5 키를 누르세요
이 문제를 수정할 수 있도록 일부 업데이트를 진행했습니다.
수고하셨습니다!
사이드바 정렬 순서를 헤더 카테고리 내비게이션에도 적용할 수 있는 옵션을 추가해 주실 수 있을까요? 이렇게 하면 사용자가 헤더 카테고리 내비게이션에 원하는 정렬 순서를 직접 적용할 수 있게 됩니다.
이 방법은 유용하지만 더 이상 작동하지 않습니다. 대신 다음을 시도해 보세요
html:not(.has-full-page-chat) .d-header:has(.horizontal-overflow-nav) {
height: 5em !important;
}
첫 번째 게시글의 미리보기 링크에서 “페이지를 찾을 수 없음” 오류 발생
아, 죄송합니다. 지금 다시 시도해 보세요. ![]()
카테고리가 몇 개뿐이라면 로고 옆 헤더에 내비게이션 바를 포함할 수 있을까요?
감사합니다.
올레
도움이 되셨다니 기쁩니다. 감사합니다.
웹사이트에서 내비게이션 바를 가운데로 정렬할 수 있는지 궁금합니다.
로고가 있는 헤더 영역에 내비게이션 바를 포함할 수도 있을까요?
또한 /login과 /signup 페이지에서는 헤더가 없는데도 내비게이션 바가 표시되므로, 이 페이지들에서는 내비게이션 바를 숨길 수 있는지 궁금합니다.
감사합니다.
올레 드림
표시 위치를 헤더 하단으로 변경하는 방법?
이미 헤더의 하단에 있지 않나요? 제가 오해하고 있다면, 포크를 해서 해당 컴포넌트의 플러그인 아웃렛을 변경해 보실 수 있습니다.
<header class="d-header"> 안에 있는 걸 말해요
가장 편안하고 사용하기 좋은 내비게이션 시스템이 얼마 전 업데이트 이후 사라져 버렸어요 ![]()
이 시스템이 다시 돌아올 가능성이 있을까요?
그리고 아니요, 콘솔에 어떤 오류가 표시되는지는 모르겠습니다. 요즘은 아이패드를 사용하고 있기 때문이죠.
수정:
너무 성급하게 행동했네요. 문제가 플러그인 https://github.com/thoka/discourse-reach-and-rights에서 비롯된 것이었습니다.
혼란을 드려 죄송합니다.
하위 카테고리가 존재할 때 메뉴 드롭다운에 이를 표시하는 방법(또는 다른 구성 요소)이 있나요?
홈페이지로 돌아가도 선택된 카테고리가 여전히 하이라이트됨
안녕하세요! 이 컴포넌트를 만들어 주셔서 감사합니다!
카테고리 내비게이션 바나 사이드바를 통해 카테고리를 선택한 후, 포럼 로고를 클릭하여 홈페이지로 돌아가면 내비게이션 바에서 해당 카테고리가 여전히 밑줄(하이라이트)이 쳐진 것을 확인했습니다.
재현 방법:
- 내비게이션 바 또는 사이드바를 통해 카테고리를 엽니다.
- 내비게이션 바에서 해당 카테고리가 하이라이트되는지 확인합니다.
- 홈페이지로 돌아가기 위해 포럼 로고를 클릭합니다.
- 이전에 선택했던 카테고리가 여전히 하이라이트 상태입니다.
예상 동작: 홈페이지로 돌아갈 때 어떤 카테고리도 하이라이트되지 않아야 합니다.
custom-categories-navbar.gjs 파일을 살펴보니, 원인은 setActiveSlug() 함수에 있는 것으로 보입니다. 현재 라우트에 카테고리가 있으면 activeSlug를 업데이트하지만, 카테고리가 없는 라우트일 경우 이를 초기화하지 않기 때문입니다.
기존 조건문에 else를 추가하면 이 문제가 해결될까요?
} else {
this.activeSlug = "";
}
이렇게 하면 홈페이지로 돌아갈 때 활성 카테고리가 초기화되면서, 카테고리 및 하위 카테고리 내부의 기존 하이라이트 동작은 유지됩니다.
감사합니다,
Prof. Caju
