# SNS

CdBd 에디터의 SNS 카드는 여러분이 운영하는 다양한 소셜 미디어 채널들을 페이지에 쉽고 멋지게 연결해 주는 편리한 도구예요. 방문자들이 내 페이지를 통해 원하는 소셜 미디어로 바로 찾아갈 수 있도록 연결하는 모든 방법을 지금부터 친절하게 알려드릴게요

***

## 1. SNS 카드 추가하고 채널 연결하기

먼저, 페이지에 SNS 카드를 추가하고, 연결하고 싶은 채널들을 넣어볼까요?

### 1.1 SNS 카드 선택

* 페이지에 SNS 카드를 추가한 뒤 카드를 선택해 보세요.

### 1.2 연결할 SNS 채널 고르기

* SNS 카드 설정에서 연결하고 싶은 소셜 미디어 채널들을 고를 수 있어요. CdBd는 다양한 채널을 지원한답니다.
* 지원 채널 : 웹사이트, 인스타그램, 카카오톡, 유튜브, 엑스(X) 등 여러 채널을 연결할 수 있어요.

<figure><img src="/files/URI128JGYm2nkPdSMpjx" alt=""><figcaption></figcaption></figure>

### 1.3 채널 주소(URL) 입력하기

* 선택한 채널에 해당하는 주소(URL)를 입력해야 해요.
* 간편한 입력 : 주소를 입력할 때 'http', 'http\://', 'www' 같은 머리글은 따로 입력하지 않아도 된답니다.

### 1.4 미리보기로 확인

* 주소를 입력하고 설정을 마치면 미리보기 화면에서 SNS 아이콘이 어떻게 보이는지 바로 확인할 수 있어서 편리해요.

***

## 2. SNS 아이콘 디자인 예쁘게 꾸미기

SNS 카드를 선택한 후, 디자인 공간으로 가면 SNS 아이콘들의 모양과 스타일을 다양하게 꾸밀 수 있는 설정들이 나타나요. 내 페이지에 딱 맞는 멋진 아이콘을 만들어 보세요!

### 2.1 아이콘 크기 조절하기

* SNS 아이콘들의 크기를 조절하는 막대(슬라이더)를 움직여 보세요. 1부터 4까지 원하는 크기로 섬세하게 조절할 수 있답니다.

<figure><img src="/files/0QFnR7oB4pLhENdTa0bZ" alt=""><figcaption></figcaption></figure>

### 2.2 아이콘 색깔 바꾸기**콘 색깔 바꾸기**

* 아이콘의 색깔을 변경해서 페이지의 전체적인 디자인과 조화를 이루게 할 수 있어요.

<figure><img src="/files/e0oNCWAfwrN0oieVqFSx" alt=""><figcaption></figcaption></figure>

* 기본 제공 색상 : 미리 준비된 여러 가지 색상 중에서 고르거나,
* 색상 팔레트 사용 : 원하는 색깔을 직접 골라 세밀하게 설정할 수도 있답니다.

### 2.3 테두리/여백 추가

* 아이콘에 테두리를 넣거나 주변 여백을 조절해서 다른 내용들과 분리되도록 깔끔하게 꾸밀 수 있어요.

***

## 3. SNS 카드 관리하기

SNS 카드에 여러 채널을 추가했다면, 채널들을 효율적으로 관리할 수 있어요.

### 3.1 채널 추가/삭제

* 언제든지 새로운 SNS 채널을 추가하거나, 더 이상 사용하지 않는 채널을 목록에서 지울 수 있답니다.

### 3.2 채널 순서 변경

* SNS 아이콘이 페이지에 표시되는 순서를 바꾸고 싶다면, 목록에서 원하는 채널을 끌어서 위치를 변경할 수 있어요.


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://cdbd.gitbook.io/guide/editor/sns.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.