수년간 Discourse를 지켜봐 왔지만, 코딩이나 커맨드라인 설정에 익숙하지 않아 전환을 망설였습니다. 하지만 흥미로운 기능들과 오픈소스라는 점이 결국 XenForo에서 Discourse로 이주하게 만들었고, 기술에 밝은 친구의 도움도 받았습니다.
이제 포럼을 커스터마이징하고 싶은 마음이 간절합니다. UI/UX 디자이너로서 아이디어는 많지만, 어디서부터 시작해야 할지 막막합니다. XenForo에서는 제 비전에 잘 맞는 테마를 사용하고 CSS로 소소한 수정을 했습니다. 내장된 테마 옵션을 통해 게시글 배경이나 사이드바 테두리 같은 특정 UI 요소도 GUI로 조정할 수 있었죠.
Discourse에서는 색상 팔레트 옵션은 확인했는데, 더 세밀한 스타일링을 위한 내장된 컨트롤이 있나요, 아니면 모든 것을 위해 코드를 사용해야 하나요? 조언을 주시면 정말 감사하겠습니다. 그렇더라도 Discourse의 기능에 깊은 인상을 받았고, 그 잠재력을 탐구하는 데 기대가 큽니다.
환영합니다 
색 팔레트 외에도 CSS/SCSS를 사용하게 되며, 필요에 따라 JS, HTML 등도 추가로 사용됩니다.
아래 내용이 도움이 될 수 있습니다:
테마와 컴포넌트를 생성할 수 있습니다. 컴포넌트는 일종의 “서브테마”(스타일과 기능을 포함할 수 있음)이며, 각 컴포넌트는 하나 이상의 테마에서 활성화할 수 있습니다.
테마와 컴포넌트 생성을 돕는 명령줄 도구가 있으며, 이를 확인해 보시는 것을 권장합니다:
또한, Discourse의 대부분의 HTML 요소를 나열한 특별 페이지도 있습니다. 이 페이지를 통해 요소들의 외형을 한눈에 파악하고, 그에 맞게 스타일을 작성할 수 있습니다.
이 페이지는 스타일 가이드 활성화 사이트 설정을 통해 활성화해야 합니다.
예시:
조금 부담스럽게 느껴지긴 하지만, 여전히 긍정적인 마음으로 받아들이고 있어요. 정말 멋진 답변 감사드립니다. 스타일 가이드 관련 내용은 분명 도움이 될 것 같아요. 정말 감사합니다!
@manuel 님은 테마 빌딩 및 커스터마이징을 위한 비(또는 덜) 코딩 옵션을 확장하고 있습니다. 저는 거기서 시작할 것 같습니다(자아, 제가 직접 파고들 시간을 찾을 때까지 그 진행 상황을 따라가 보고 싶으니 
, 만약 그렇게 하신다면, 진행 과정에서 피드백과 보고를 공유해 주세요!!!). UI/UX 마니아들을 위한 몇 가지 단순화를 혁신적으로 도입하고 있는 것 같습니다.
모든 것은 아니지만, 더 많은 사용자 지정 디자인을 구현하려면 코드를 작성해야 한다고 생각합니다. 제가 권장하는 단계는 다음과 같습니다:
@Canapin이 이미 언급한 Theme CLI gem 사용법을 배워보세요. 첫 단계로 다소 부담스러울 수 있지만, Discourse 커스터마이징에 빠지게 만드는 것은 바로 이 작은 gem입니다! 디자이너에게는 마법 지팡이와도 같습니다 
이것 없이는 진행 과정에서 계속 마찰을 느낄 가능성이 높습니다.
CSS 커스텀 프로퍼티를 사용하여 스타일을 구현하는 연습을 해보세요.
이 부분에 대해 가이드가 최신이 아닌 것 같습니다. 일관된 디자인 토큰 시스템을 구축할 일은 여전히 많지만, Discourse는 이미 상당한 발전을 이루었습니다! Discourse 프론트엔드의 프론트에서 커스텀 프로퍼티가 어디에 어떻게 사용되는지 파악하는 것이 모범 사례를 이해하는 데 큰 도움이 될 것입니다.
브라우저 인스펙터를 사용하여 커스텀 프로퍼티를 찾을 수 있으며, 첫인상을 위해 이 목록을 참고해 보세요: Documenting custom properties. 그리고 사이드바와 같은 최신 템플릿은 거의 전적으로 커스텀 프로퍼티로 스타일링할 수 있습니다.
@denvergeeks가 제안했듯이, Canvas 테마 템플릿을 살펴볼 수 있습니다. 이 템플릿은 코어에서 사용할 수 없는 레이아웃 스타일링용 커스텀 프로퍼티 세트를 추가하는 역할을 합니다.
지금까지 저는 이 접근 방식만 사용하고 있으며, 브라우저의 검사(inspect) 옵션을 이용해 요소를 확인하고 필요한 부분을 조정하고 있습니다.
