혹시 다른 분들도 discuss.codeacademy.com과 비슷한 룩, 특히 커스텀 홈 페이지 배너를 어떻게 만드는지 궁금해하실까 봐 여기를 마무리하려고 합니다. 결국 @awesomerobot님의 가이드를 참고해서 홈 페이지에서만 표시되는 배너를 만들었습니다. theirs처럼 화려하지는 않지만, 목적을 달성하기에는 충분합니다!
테마 개발자로서 자주 마주치는 상황 중 하나는 커뮤니티의 홈페이지에서만 표시되는 콘텐츠를 만드는 것입니다.
테마의 “헤더 이후” 섹션에 HTML을 추가하면 해당 콘텐츠가 모든 페이지에 표시됩니다. CSS를 활용하여 홈페이지를 제외한 모든 곳에서 이를 숨기는 방법이 있지만, 대신 Discourse 테마를 사용하여 홈페이지에서만 표시되는 콘텐츠가 포함된 컴포넌트를 만들어 보겠습니다.
Discourse 테마에 익숙하지 않다면 Beginner's guide to using Discourse Themes 과 Structure of themes and theme components 을 확인해 보세요.
Discourse 테마에서 다음 디렉터리 구조를 설정해야 합니다:
javascripts/discourse/components/
javascripts/discourse/connectors/
이제 Ember 컴포넌트를 생성하겠습니다. Emb…
그리고 Category Banners를 사용했습니다.
CSS 조정 덕분에 읽지 않은 항목 수 등의 색상 스킴을 맞추는 데 도움이 되었습니다.
감사합니다!
6개의 좋아요