# Versatile Banner
**URL:** https://meta.discourse.org/t/versatile-banner/109133
**Category:** Theme component
**Tags:** official, versatile-banner
**Created:** [2월 14, 2019, 10:05오전 UTC](https://meta.discourse.org/t/versatile-banner/109133 "2019-02-14T10:05:24Z")
**Posts on this page:** 20
**Page:** 2
### Author:  [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [6월 29, 2021, 8:09오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/257 "2021-06-29T20:09:16Z")
이 구성 요소를 여러 번 설치하면 작동하지 않을 것 같습니다. 현재로서는 #Marketplace 를 통해 맞춤형 솔루션을 구축해 줄 사람을 고용하는 것이 최선의 선택일 것입니다.
최근에는 이 구성 요소의 버그 리포트 처리에만 시간을 할애해 왔지만, 향후 1~2년 내에 대규모 개편을 계획하고 있으며, 이를 통해 더 높은 유연성을 확보할 수 있기를 기대합니다.
---
### Author:  [@manuel](https://meta.discourse.org/u/manuel)
#### Post date: [8월 1, 2021, 1:31오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/258 "2021-08-01T13:31:28Z")
컴포넌트 설정을 통해 배너가 특정 페이지에서만 표시되도록 하고 있습니다. 그런데 CSS에서 두 가지 버그를 발견했습니다:
- 배너가 표시되어서는 안 되는 페이지에서 상단 여백(top margin)이 추가됩니다.
- 페이지 로딩 중에는 배너가 스타일 없이 표시됩니다.
이 두 문제를 해결하려면 `.banner-box {display: none;}`를 선언한 후, 배너가 표시되어야 하는 특정 페이지에 대해 display 선언을 추가해야 합니다.
---
### Author:  [@sebastianzepper](https://meta.discourse.org/u/sebastianzepper)
#### Post date: [8월 19, 2021, 2:00오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/259 "2021-08-19T14:00:44Z")
hello @tshenry
아이콘을 더 크게 만들 수 있을까요?
---
### Author:  [@fyodorovich](https://meta.discourse.org/u/fyodorovich)
#### Post date: [11월 18, 2021, 10:13오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/260 "2021-11-18T22:13:10Z")
이것은 더 일반적인 FAQ에 해당할 수도 있지만, 데스크톱과 모바일 사용자에게 각각 다른 그래픽을 전달하는 방법에 대해 궁금합니다.
---
### Author:  [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [11월 18, 2021, 10:22오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/261 "2021-11-18T22:22:36Z")
그래픽을 어디에 표시되길 원하시나요? 데스크톱/모바일 상태에 따라 조건부로 콘텐츠를 표시하는 방법은 분명히 있지만, 어떤 방식으로 접근할지는 하려는 작업에 따라 달라집니다.
---
### Author:  [@fyodorovich](https://meta.discourse.org/u/fyodorovich)
#### Post date: [11월 18, 2021, 10:38오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/262 "2021-11-18T22:38:25Z")
저는 그래픽을 포함한 크리스마스 메시지를 전달하기 위해 versatile banner를 사용하려고 합니다. 따라서 이 작업을 versatile banner의 컨텍스트 내에서 수행할 수 있도록 하고 싶습니다.
---
### Author:  [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [11월 20, 2021, 2:07오전 UTC](https://meta.discourse.org/t/versatile-banner/109133/263 "2021-11-20T02:07:15Z")
음, 그렇다면 Versatile Banner의 “content” 설정 중 하나에 다음과 같은 내용을 추가할 수 있습니다:
```plaintext
```
그리고 메인 테마나 새 컴포넌트에 CSS를 추가하세요. `LINK_TO_MOBILE_IMAGE`를 실제 이미지 링크로 교체할 수 있는 예시입니다:
```plaintext
.mobile-view .xmas-banner-image {
background-image: url("LINK_TO_MOBILE_IMAGE");
height: 50px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
.desktop-view .xmas-banner-image {
background-image: url("LINK_TO_DESKTOP_IMAGE");
height: 200px;
background-position: center;
background-repeat: no-repeat;
background-size: contain;
}
```
[CSS를 조정](https://meta.discourse.org/t/how-to-make-css-changes-on-your-site/168101)해야 하지만, 이 정도면 시작하는 데 도움이 되길 바랍니다.
---
### Author:  [@fyodorovich](https://meta.discourse.org/u/fyodorovich)
#### Post date: [11월 20, 2021, 3:10오전 UTC](https://meta.discourse.org/t/versatile-banner/109133/264 "2021-11-20T03:10:25Z")
정말 좋습니다. CSS로 해결해야 할 것 같은 느낌이 들었습니다. 시작점을 제공해 주셔서 감사합니다.
---
### Author:  [@Nick\_Chomey](https://meta.discourse.org/u/Nick_Chomey)
#### Post date: [11월 29, 2021, 8:30오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/265 "2021-11-29T20:30:59Z")
"/latest?assigned="을 구체적으로 타겟팅하여 Discourse Assign 플러그인과 함께 사용하고 싶습니다. 이렇게 하면 All, Me, Nobody에 할당된 주제에 대해 버튼을 추가할 수 있거든요.
하지만 이 방법은 작동하지 않습니다. "/latest"는 작동하므로 “?” 때문일 것 같습니다. 이 배너가 해당 페이지/뷰에서만 표시되도록 하는 방법에 대한 제안이 있을까요?
~~또한, "/latest"만 선택해도 배너가 홈페이지에도 표시됩니다. 이를 방지하는 방법은 무엇인가요?~~ 설정에서 홈페이지에 표시하도록 하는 체크박스를 찾지 못했습니다.
마지막으로, 아이콘을 클릭 가능하게 만드는 방법이 있을까요? 아이콘 아래 텍스트만 클릭 가능한 것 같습니다.
---
### Author:  [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [11월 30, 2021, 3:48오전 UTC](https://meta.discourse.org/t/versatile-banner/109133/266 "2021-11-30T03:48:23Z")
> [@Nick\_Chomey](#):
>
> "/latest?assigned="을 특정적으로 타겟팅하고 싶습니다.
> [@Nick\_Chomey](#):
>
> 마지막으로, 아이콘을 클릭 가능하게 만드는 방법이 있나요?
이것들은 별도의 컴포넌트에 추가해야 하는 더 복잡한 커스터마이징입니다. 위젯 중 하나를 다시 열고 동작을 조정하는 방법에 대한 예시는 여기에 있습니다: [Versatile Banner - #158](https://meta.discourse.org/t/versatile-banner/109133/158)
아이콘의 경우, CSS 솔루션을 조합해 시도해 볼 수도 있습니다. 컬럼 콘텐츠 설정에 앵커 요소를 추가하고, 이미지와 겹치도록 스타일을 지정하는 것이 가능합니다.
---
### Author:  [@Nick\_Chomey](https://meta.discourse.org/u/Nick_Chomey)
#### Post date: [11월 30, 2021, 4:37오전 UTC](https://meta.discourse.org/t/versatile-banner/109133/268 "2021-11-30T04:37:35Z")
정말 감사합니다! 여기서부터는 제가 알아서 할 수 있을 것 같아요.
---
### Author:  [@Richie](https://meta.discourse.org/u/Richie)
#### Post date: [12월 7, 2021, 9:08오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/269 "2021-12-07T21:08:41Z")
테마를 활성화하기 전에 다재다능한 배너를 미리 볼 수 있는 방법이 있을까요? 🤔
공개하기 전에 어떻게 보이는지 확인하고 싶어요 (그리고 부끄러운 실수를 발견하게 되는 상황을 피하고 싶어서요) 🙂
---
### Author:  [@flash](https://meta.discourse.org/u/flash)
#### Post date: [12월 7, 2021, 9:24오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/270 "2021-12-07T21:24:55Z")
변경 사항을 위해 개발용 드롭렛을 하나 유지하고 있어요. 월 5달러면, 뭔가가 망가져서 실제 환경에서 문제가 생기기 전에 미리 확인할 수 있거든요 ㅋㅋ
로컬호스트에서도 같은 방식으로 할 수 있을 것 같아요. 그래도 그 용도로 VM을 하나 만들어서 월 5달러는 아껴볼까 합니다 ㅋㅋ
---
### Author:  [@Richie](https://meta.discourse.org/u/Richie)
#### Post date: [12월 7, 2021, 9:29오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/271 "2021-12-07T21:29:58Z")
흠, 그건 생각도 못 했네 🤔
그리고 [오늘 발표된 내용](https://meta.discourse.org/t/discourse-on-a-raspberry-pi-blog/211357)과 관련해서, 나도 정확히 그렇게 할 것 같아. 다만 라즈베리파이에서 해볼 거야 😃
---
### Author:  [@hequaye](https://meta.discourse.org/u/hequaye)
#### Post date: [12월 16, 2021, 6:51오전 UTC](https://meta.discourse.org/t/versatile-banner/109133/272 "2021-12-16T06:51:58Z")
누군가 이 배너를 검색 바 컴포넌트 위에 제대로 표시할 수 있었나요?
지금까지는 검색 바 아래에만 표시할 수 있었습니다 🤧
---
### Author:  [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [12월 16, 2021, 7:06오전 UTC](https://meta.discourse.org/t/versatile-banner/109133/273 "2021-12-16T07:06:06Z")
테스트 사이트에 두 가지를 모두 설치해 두었는데, Versatile Banners의 `swap default positioning` 설정을 체크하면 위치를 바꿀 수 있습니다. 이 방법으로 해결이 될까요?
---
### Author:  [@hequaye](https://meta.discourse.org/u/hequaye)
#### Post date: [12월 16, 2021, 7:11오전 UTC](https://meta.discourse.org/t/versatile-banner/109133/274 "2021-12-16T07:11:28Z")
음… 이게 좀 이상하네요… 아마 검색창 컴포넌트에 대한 설정이라고 생각하시는 건 아닌지 모르겠어요. 제 검색창에는 '사이트 헤더 아래’가 체크되어 있습니다.
검색창 설정은 어떻게 되어 있나요?
---
### Author:  [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [12월 16, 2021, 7:31오전 UTC](https://meta.discourse.org/t/versatile-banner/109133/275 "2021-12-16T07:31:54Z")
`below-site-header`를 검색 배너에 사용할 경우, `swap default positioning` 설정을 통해 유연한 배너를 위쪽 또는 아래쪽에 배치할 수 있습니다.
검색 배너의 플러그인 아웃렛이 `above-main-container`로 설정되어 있으면, swap을 선택하든 하지 않든 유연한 배너는 항상 맨 위에 표시됩니다.
(변경 사항은 페이지 새로 고침 시 적용됩니다)
---
### Author:  [@Tara\_Walton](https://meta.discourse.org/u/Tara_Walton)
#### Post date: [1월 24, 2022, 5:13오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/276 "2022-01-24T17:13:09Z")
방금 포럼을 오픈했고 아직 호스팅 플랜을 사용 중입니다.
이 배너가 정말 마음에 드는데, 하나만 여쭤볼게요…
다크 모드와 라이트 모드(즉, 다른 색상 스킴과 다른 배경 이미지/색상)를 사용해보고 싶은데, 놓치고 있는 설정이 있거나 이걸 구현할 방법이 있을까요?
---
### Author:  [@JammyDodger](https://meta.discourse.org/u/JammyDodger)
#### Post date: [1월 24, 2022, 5:43오후 UTC](https://meta.discourse.org/t/versatile-banner/109133/277 "2022-01-24T17:43:46Z")
테마 컴포넌트를 두 번 설치해서 하나는 Light, 다른 하나는 Dark라고 이름 붙였습니다. 그리고 Light 테마에는 Light 컴포넌트를, Dark 테마에는 Dark 컴포넌트를 연결했어요. 👍
다만 `default dark mode color scheme id`가 설정되어 있을 때 Light 컴포넌트가 색상 팔레트를 변경하지 않아서 100% 완벽하진 않아요.
[이전 페이지](https://meta.discourse.org/t/versatile-banner/109133.md?page=1)
[다음 페이지](https://meta.discourse.org/t/versatile-banner/109133.md?page=3)