# 헤더에서 로그인 버튼을 숨기는 방법

**URL:** https://meta.discourse.org/t/how-hide-login-button-in-header/317637
**Category:** Development
**Tags:** css
**Created:** [7월 22, 2024, 4:57오후 UTC](https://meta.discourse.org/t/how-hide-login-button-in-header/317637 "2024-07-22T16:57:57Z")
**Posts on this page:** 3
**Page:** 1

<div class="post-metadata">

### Author: ![thaidb](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/thaidb/32/68488_2.png) [@thaidb](https://meta.discourse.org/u/thaidb)
#### Post date: [7월 22, 2024, 4:57오후 UTC](https://meta.discourse.org/t/how-hide-login-button-in-header/317637/1 "2024-07-22T16:57:57Z")

</div>

![This image shows the mobile website of discourse.org, which appears to be an online community platform, featuring a welcome message and options to sign up or search for topics. (Captioned by AI)](https://global.discourse-cdn.com/meta/original/4X/6/b/b/6bbb2866dcd6c7b206bf1c0af64ce8d906774c39.jpeg)

헤더에서 로그인 버튼을 숨기고, 예를 들어 햄버거 메뉴와 같은 다른 곳에 표시하는 방법은 무엇인가요?

---

<div class="post-metadata">

### Author: ![Lilly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lilly/32/575047_2.png) [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [7월 22, 2024, 5:22오후 UTC](https://meta.discourse.org/t/how-hide-login-button-in-header/317637/2 "2024-07-22T17:22:59Z")

</div>

스크린샷에 표시된 대로 모바일용을 원하신다면, 이 코드를 테마 구성 요소의 모바일 CSS 탭에 추가하세요:

 ![Screenshot 2024-07-22 at 10.09.46 AM](https://global.discourse-cdn.com/meta/original/4X/1/2/7/127d8648c922c31b63617db78bb49c1945443670.png)

그런 다음 상단 사이드바 섹션에 사용자 정의 링크를 생성하세요:

 ![Screenshot 2024-07-22 at 10.21.51 AM](https://global.discourse-cdn.com/meta/original/4X/6/c/2/6c2149336ce10a58b45af528e763fec1a68f1636.png)

이렇게 하면…

 ![Screenshot 2024-07-22 at 10.22.15 AM](https://global.discourse-cdn.com/meta/original/4X/b/7/5/b75199d9d22e90d6178c42198a7d661ab97f4056.png)

클릭하면 모달이 나타납니다:

 ![Screenshot 2024-07-22 at 10.24.04 AM](https://global.discourse-cdn.com/meta/original/4X/c/0/8/c08fc21e9c39b8b74efd21ecd6472e1496f5d434.png)

---

<div class="post-metadata">

### Author: ![Lilly](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/lilly/32/575047_2.png) [@Lilly](https://meta.discourse.org/u/Lilly)
#### Post date: [7월 22, 2024, 5:33오후 UTC](https://meta.discourse.org/t/how-hide-login-button-in-header/317637/3 "2024-07-22T17:33:01Z")

</div>

또한, 로그인 사이드바 링크를 익명 사용자만 표시하려면 다음 코드를 대신 사용할 수 있습니다:

```scss
.sidebar-section-link-wrapper[data-list-item-name="login"] {
    display: none;
}
.anon .sidebar-section-link-wrapper[data-list-item-name="login"] {
    display: flex;
}

.d-header .login-button {
    display: none;
}

```

 ![Screenshot 2024-07-22 at 10.32.39 AM](https://global.discourse-cdn.com/meta/original/4X/3/c/7/3c7d0e5435736802e791151ca4e0307f72b35aca.png)

`data-list-item-name`은 대소문자를 구분하므로, 링크가 "Login"이라면 CSS 코드에서도 동일하게 작성해야 합니다.