jrgong
(jrgong)
10월 31, 2025, 1:04오후
1
Hey guys
When I add an image, icon or emoji to a category, the category category-heading is sticky upon scrolling down and takes a lot of space.
Also affected is the category header theme component as the see my post below for reference.
I just tested the compatibility with horizon theme. all in all it’s basically working, but the only issue is that the plugin outlet currently used by the category headers theme component is inside list-controls container on Horizon theme. Hence the whole category header stays sticky.
Suggested solution is to change the plugin outlet or add an option to choose a different plugin outlet outside list-controls container, e.g. discovery-list-controls-above outlet.
tested on 3.6.0.beta2
3개의 좋아요
Yes, I agree that’s an annoying side-effect.
I don’t have a solution for it unfortunately. The category heading is in the same sticky element as the navigation, and I can’t move the sticky property a level down, because sticky doesn’t work within a flexed element…
I’d advise you to hide or minimise the logo with css on mobile.
1개의 좋아요
Aurora
(Aurora)
12월 17, 2025, 6:57오후
3
The sticky navigation also bothers me. It takes up too much space.
How can I turn that off?
There is no setting for it. You’ll have to overrule the CSS.
nathank
(Nathan Kershaw)
3월 26, 2026, 3:42오전
5
Horizon 테마에는 카테고리 설명이 주제 목록을 스크롤할 때도 계속 표시되는 유용한 기능이 있습니다:
데스크톱에서는 이 기능이 훌륭하지만, 공간이 좁아지는 경우(예: 모바일)에는 주제 목록이 읽기 어렵게 됩니다(특히 텍스트가 길 경우).
2개의 좋아요
사실 내비게이션 을 표시되게 유지하고 싶었던 것에서 발생한 의도하지 않은 부수 효과입니다. 수정이 가능한지 확실하지 않습니다(두 요소가 같은 컨테이너 안에 있는 건가요? ). 선택해야 한다면 원래 의도대로 가겠습니다.
관심 있으신 분은 편하게 살펴봐 주세요.
1개의 좋아요
Aurora
(Aurora)
3월 31, 2026, 6:08오후
8
css로 해결했습니다.
/* 모바일에서 Horizon의 고정(list-controls) 비활성화 */
@media (max-width: 767px) {
.list-controls {
position: static !important;
top: auto !important;
transform: none !important;
margin-top: 0 !important;
}
}
3개의 좋아요
nathank
(Nathan Kershaw)
4월 1, 2026, 2:34오전
9
그렇게 하면 모바일에서 설명과 내비게이션이 모두 고정되지 않게 되는 것 아닌가요?
우리는 설명은 사라지되, 내비게이션은 고정되기를 원합니다.
2개의 좋아요
Aurora
(Aurora)
4월 1, 2026, 2:12오후
10
내비게이션이 우리에게도 너무 많은 공간을 차지하고 있었습니다.
현재 스크롤 가능한 Pills를 사용하는 것을 고려하고 있습니다.
이것을 sticky로 만들고 싶은데 아직 성공하지 못했습니다.
1개의 좋아요
네, 불행히도 레이아웃을 재구성하지 않으면 CSS만으로 이를 간단하게 구현할 수 있는 방법이 없습니다.
현재 Horizon 테마는 카테고리 헤더를 포함하여 .list-controls 컨테이너 전체를 고정(sticky) 상태로 유지하고 있습니다. 고정 요소는 부모 요소의 스크롤 컨텍스트 내에서만 고정되므로, 자식 요소인 .navigation-container만 단독으로 고정 상태로 만들 수는 없습니다.
이 영역을 재구성할 수는 있지만 , 기존 구조를 기반으로 스타일을 적용하는 모든 테마에 영향을 미치는 변경 사항 중 하나입니다… 따라서 이러한 스티키 내비게이션이 없더라도 다른 테마나 사용자 정의 설정에서 회귀(regression) 문제가 발생할 가능성이 높습니다.
1개의 좋아요
nathank
(Nathan Kershaw)
4월 7, 2026, 3:31오전
12
그렇다면 이 문제의 해결책은 무엇일까요?
호라이즌(Horizon)에서 모바일 환경의 카테고리 설명을 단순히 숨기는 것이 나을지 궁금합니다. 어차피 정보의 중복이며, 공간이 매우 협소한 상황이기도 합니다.
저는 TC의 모바일 탭에서 간단한 CSS를 사용하여 이를 구현했습니다:
.category-heading.--has-logo {
display: none;
}
이것이 호라이즌에 기본으로 포함되는 것이 좋을까요?
nathank:
그렇다면 앞으로의 방향은 무엇인가요?
이미 앞으로 나아갈 길을 만들었습니다: 사용자 정의 CSS를 사용해 원하는 대로 조정하세요.
1개의 좋아요
nathank
(Nathan Kershaw)
4월 7, 2026, 7:14오후
14
네, 하지만 이 경우 내 개인적인 취향의 문제가 아니라 테마 자체의 더 큰 문제입니다. 모바일 기기에서 큰 고정형 카테고리 설명을 실제로 좋아할 사람이 있다는 상상을 하기 어렵습니다. 디자인을 기획할 때 그런 의도는 아니셨을 거라고 생각해요.
1개의 좋아요
사람들이 커뮤니티에서 무엇을 원하는지는 정말 예측하기 어렵습니다. 저는 그대로 두기로 했습니다. 원하면 쉽게 숨길 수 있고, 그렇게 하는 것이 "왜 내 카테고리 배너가 모바일에서 안 뜨지?"라는 혼란을 줄 수 있는 더 간단한 방법이기 때문입니다.
nathank
(Nathan Kershaw)
4월 7, 2026, 11:34오후
16
관리자가 사용자 정의 CSS를 추가할 수 없는 호스팅 플랜(예: 무료 플랜)은 어떻게 되나요?
정말 원하는 사람이 있다면(그럴 것 같지는 않지만), 이를 제어하는 테마 설정이 있을까요?
2개의 좋아요