CSS를 사용하여 수정할 수 있습니다.
새로운 #customization:theme-component를 만들고 아래 내용을 공통 CSS에 추가하세요.
// Who's Online Customization
.discovery-list-container-top-outlet.online_users_widget {
margin-top: 0.75em;
margin-bottom: 0.75em;
padding-top: 0.5em
padding-bottom: 0.5em;
}
커스텀 배경색, 테두리 등도 추가할 수 있습니다.
정말 감사합니다!
원하는 경우 이렇게 강조할 수도 있습니다
이 대신 다음 코드를 사용하세요
// Who's Online Customization
.discovery-list-container-top-outlet.online_users_widget {
padding-top: 0.45em;
padding-bottom: 0.05em;
background-color: var(--secondary);
border: 2.0px solid rgba(var(--primary-rgb), 0.2);
border-radius: 0.65em;
margin-top: 0.75em
margin-bottom: 0.75em;
}
조금 주제에서 벗어난 이야기인데, @bekircem 이 폰트 조합은 무엇인가요? 두 폰트가 함께 사용할 때의 조화가 정말 마음에 듭니다!
이 컴포넌트에 큰 개선을 가져다줄 작은 기능 요청이 있습니다. 카테고리 설명으로 연결되는 “더 보기…” 링크를 가지고 싶습니다. 이는 카테고리 페이지를 지저분하게 만들지 않으면서도 긴 설명을 포함할 수 있는 매우 우아한 해결책입니다. 이 링크를 수동으로 추가할 수는 있지만, 그렇게 하면 카테고리 페이지에도 표시되어 깔끔하지 않습니다.
이 코드에는 5번째 줄에 ;가 누락되어 있으며, 후속 예제에도 마찬가지입니다.
저에게는 다음과 같은 코드가 작동했습니다:
.discovery-list-container-top-outlet.online_users_widget {
margin-top: 0.75em !important;
margin-bottom: 0.75em !important;
display: block !important;
}
결과:
좋아요. 불행히도 제 게시글이 너무 오래되어 코드를 수정할 수 없습니다. ';'를 놓쳤다는 걸 알려주셔서 감사합니다.
태그와 카테고리 링크에도 동일한 문제가 있습니다. 이 수정에 .hashtag-cooked 클래스를 포함해 주실 수 있을까요?
어떤 이유인지 모르겠지만, 제 환경에서는 제대로 작동하지 않습니다.
일부 카테고리 및 하위 카테고리에는 배너가 표시되고, 일부에는 표시되지 않습니다.
설명문(또는 설명문의 부재) 때문은 아닌 것 같습니다. 설명문이 있는 항목도 배너가 표시되지 않기 때문입니다.
새로운 Discourse 업데이트로 인해 무언가가 깨진 건지 모르겠습니다.
categories 설정에 카테고리 ID를 정의했나요?
네, Objects Setting Editor에 추가했습니다.
설명이 없을 때 이를 숨기는 옵션과 관련된 버그가 있는 것 같습니다.
추가로 몇 가지 테스트를 더 해보고 어떻게 되는지 확인해 보겠습니다.
방금 버그를 발견했습니다.
부모 카테고리 Tiago | Music에 있는 상태에서 Sir Giant 하위 카테고리를 클릭하면 배너가 표시됩니다. 그다음 사이드바의 “documentation” 링크 중 하나를 클릭하여 태그 페이지 Announcements로 이동합니다. 여기서 General Discussion 링크를 클릭하면 하위 카테고리 Sir Giant의 루트로 돌아오는데, 이때 배너가 사라져 있습니다.
처음 Announcements로 갔을 때는 배너가 없었습니다. 태그 페이지 Music로 이동한 뒤 다시 Announcements로 돌아오면 배너가 이제 표시됩니다.
또 다른 점을 발견했습니다. Announcements 페이지에 있을 때 배너가 보이지 않는 상태에서 같은 링크(Announcements)를 다시 클릭하면 배너가 나타납니다. 이는 분명히 버그입니다.
추가로 2가지 문제가 있습니다:
설명이 있는 카테고리 페이지에 있습니다. 배너에서 설명을 볼 수 있습니다. 해당 설명에는 온라인 스토어로 연결되는 외부 링크가 있습니다. 이 링크를 클릭하면 모든 외부 링크를 새 탭에서 열도록 설정되어 있음에도 불구하고 같은 탭에서 열립니다. 배너의 설명을 정의하는 주제 자체는 새 탭에서 링크가 열리므로 설정이 정상적으로 작동하고 있음을 확인할 수 있습니다.
이제 같은 탭에서 열린 해당 외부 링크 웹사이트에 있으면, 하위 카테고리로 돌아가기 위해 브라우저의 뒤로 버튼을 눌러야 합니다. 이때 설명이 완전히 사라집니다. 배너와 제목은 남아 있지만 설명은 없습니다. 브라우저를 새로고침하거나 강제 새로고침을 해도 다시 나타나지 않습니다. 설명을 다시 보려면 메인 카테고리로 돌아간 후 다시 하위 카테고리로 들어가야 합니다.
수정: 무언가 알아냈습니다. 물론 백그라운드에서 무슨 일이 일어나고 있는지 정확히 알 수는 없지만, 빨간색 옵션이 문제를 일으키고 있습니다. 녹색 옵션은 예상대로 정상 작동합니다(클릭한 위치에 관계없이 항상 화면에 표시되며, 사이드바 메뉴를 두 번 클릭해서 배너를 다시 표시할 필요가 없음):
재현은 되는데, 원인을 설명하긴 어렵네요. 
기술적인 측면에서(제 발언은 무시해 주세요), 이 아웃렛 header-list-container-bottom에서 관찰되는 내용은 다음과 같습니다:
하위 카테고리 → 태그를 선택하면 컴포넌트가 삽입되고, 바로 그 직후 teardownComponent가 호출됩니다(?). 하지만 컴포넌트는 파기되지 않습니다. 클린업 함수에서 <body>에서 category-header 클래스가 제거되면서 일부 CSS가 배너를 숨깁니다. 다른 태그를 선택하면 컴포넌트가 다시 삽입됩니다.
삽입된 직후 will-destroy가 바로 호출되는 이유를 이해하기 어렵습니다.
음, 적어도 나만 그런 게 아니라는 걸 알았으니 다행이네요.
원하지 않아도, 설명에서 무슨 말을 하는지 전혀 모르겠네요. 하하. 하지만 특정 방식으로 작동해야 하는 것이 실제로는 그렇지 않다는 것을 알고 있다는 건 좋은 일이에요. 문제를 해결하는 데 올바른 방향으로 나아가는 한 걸음일 가능성이 큽니다.
그러므로 문제는 배너의 위치와 관련된 것 같습니다. 왜냐하면 제가 말했듯이, 옵션 중 하나(실제로 다른 두 가지는 시도해 보지 않았지만)는 작동하거든요.
‘카테고리 로고 표시’를 선택하면 로고가 두 번 표시됩니다. 하나는 카테고리 설정에서, 다른 하나는 이 테마 컴포넌트에서 가져오는 것이죠. 제가 뭔가 잘못하고 있는 건가요?
또한, ‘소개’ 제목과/또는 설명을 로고 아래에 표시할 수 있나요?
아니요, 알려진 버그입니다. 해당 주제에서 로고 하나를 숨기기 위해 추가할 수 있는 CSS도 있습니다.
고마워, Moin! CSS 덕분에 이미지가 제대로 수정됐어.
카테고리 이름을 이미지 아래에 배치하려면, 저에게는 아래 방법이 잘 작동했습니다:
.category-title-contents,
.category-title-header.category-banner-1slug .category-title-contents {
display: flex !important;
flex-direction: column !important;
align-items: flex-start !important;}
.category-logo,
.category-title-header.category-banner-1slug .category-logo {
width: 100%;
margin-bottom: 10px;
margin-right: 0;}
.category-title,
.category-title-header.category-banner-1slug .category-title {
width: 100%;
margin-top: 20px;
text-align: left;}
안녕하세요! 갑자기 발생한 좀 이상한 문제를 해결하는 데 도움을 주실 분이 있을까요?
배너의 모든 제목이 원래 흰색이었는데, 지금은 일부 카테고리에서만 검은색으로 바뀌어 있습니다. 알려진 버그인가요, 아니면 제가 직접 확인해야 할 부분이 있을까요?
예를 들어:
혹시 모르니 우리 커뮤니티 링크도 첨부합니다: https://community.elfsight.com/
