# 푸시 구독 버튼

더 많은 푸시 구독자를 확보하고 사용자 경험을 개선하세요! 웹사이트에 맞춤형 구독 버튼을 설정하여 옵트인율을 높이세요. 신규 방문자에게 표준 대화 상자를 자동으로 표시하는 대신, 메시지의 가치를 설명하고 사용자가 만족할 때 푸시 알림을 구독하도록 유도하세요.
**두** 가지 간단한 단계만 거치면 맞춤형 푸시 구독 버튼을 준비하고 작동시킬 수 있습니다!

## 1. 웹 SDK 구독 버튼 구현

<Aside type="caution">
#### Pushwoosh 웹 SDK

웹사이트에 Pushwoosh 웹 SDK 를 구현했는지 확인하세요. 그렇게 하려면 [가이드](/ko/developer/pushwoosh-sdk/web-push-notifications/web-push-sdk-30/#integration)를 따르세요.
</Aside>

웹사이트에 버튼을 표시하려면 Pushwoosh 웹 SDK 의 초기화 매개변수에 다음 코드를 추가하세요:

```javascript
Pushwoosh.push(['init', {
  //...
  autoSubscribe: false,
  subscribeWidget: {
    enable: true,
  }
}]);
```

버튼을 설정할 때 `autoSubscribe` 를 비활성화해야 합니다!

<Aside type="note">
Chrome 및 Mozilla 를 사용하는 방문자에게 버튼을 표시하려면 `manifest.json` 파일에 `fcm_sender_id` 를 지정해야 합니다. Safari 의 경우 `safariWebsitePushID` 를 지정하세요.
</Aside>

## 2. 버튼 사용자 지정

버튼이 웹사이트의 디자인과 일치하도록 디자인을 사용자 지정하세요! 벨 색상, 위치, 테두리, 그림자 등의 매개변수를 변경할 수 있으며, 툴팁 텍스트도 변경할 수 있습니다.

```javascript
Pushwoosh.push(['init', {
  //...
  subscribeWidget: {
    enable: true,
    position: 'bottomLeft', //possible values: ‘bottomLeft’, ‘bottomRight’, ‘topLeft’, ‘topRight’
    bgColor: '#12AE7E',
    bellColor: 'white',
    bellStrokeColor: '#08754f',
    bellButtonBorder: '1px solid #379676',
    shadow: '0px 0px 6px rgba(0, 0, 0, 0.75)',
    size: '48px',
    indent: '20px',
    zIndex: '999999',
    tooltipText: {
      successSubscribe: 'You are successfully subscribed!',
      needSubscribe: 'Get notifications about important news!',
      blockSubscribe: 'Click to see how to get notifications',
      alreadySubscribed: 'You are already subscribed'
    }
    buttonImage: 'https://url-image.jpg',
    contentImages: {
      chrome: 'https://url-image.jpg',
      mobileChrome: 'https://url-image.jpg',
      firefox: 'https://url-image.jpg',
      opera: 'https://url-image.jpg',
      safari: 'https://url-image.jpg',
      edge: 'https://url-image.jpg',
    }
  }
}]);
```

<Aside type="tip">

푸시 옵트인율을 극대화하려면 구독의 이점이 사용자에게 명확하게 전달되도록 하세요. `needSubscribe` 텍스트를 변경하여 메시지의 가치를 설명하면 사람들이 알림을 구독할 것입니다!
</Aside>