Sign In
Subscribe

디자인

사이트 배경과 텍스트, 블록 등의 스타일 전반을 변경합니다. 테마를 적용해 사이트 전체 디자인을 한 번에 수정하거나, 각 요소의 설정값을 개별로 수정할 수 있습니다. 디자인은 실시간으로 반영되어 사이트 방문자에게 바로 노출됩니다.

사이트 전체 스타일 변경

편집 모드 오른쪽 패널의 디자인 > 색상 탭에서 사이트 전체에 적용할 테마와 팔레트를 선택합니다.
➕
테마와 팔레트를 선택하면 각종 기본 색상과 기본값이 변경돼요. 공개 상태인 사이트의 디자인을 수정할 때는 테스트 사이트를 만들어 변경된 모습을 확인 후 수정하시길 추천해요.

사이트 테마

테마는 배경, 텍스트, 버튼의 색상, 모서리 둥글기, 테두리, 그림자 등이 미리 세팅된 것입니다. 디자인 메뉴 맨 위의 테마 영역을 클릭해 원하는 것을 선택하여 적용하면, 모든 요소의 기본 색상과 기본값이 자동 변경됩니다.

색상 팔레트

팔레트는 어울리는 색상 조합을 미리 세팅한 것입니다. 색상 탭에서 팔레트 영역을 클릭해 원하는 것을 선택하여 적용하면, 모든 요소의 기본 색상이 해당 팔레트의 색상으로 자동 변경됩니다.
팔레트의 각 색상을 클릭하면 다른 색상으로 수정할 수 있습니다. 이때 변경한 색상이 팔레트 아래의 개별 요소 색상에 도 적용돼 있었다면, 해당 요소 색상도 함께 변경됩니다.
라이트다크 를 클릭하면 방문자의 화면 모드에 따라 다르게 보일 팔레트 색상을 따로 지정할 수 있습니다.
➕
사이트를 방문자의 모드에 관계 없이 라이트 모드 또는 다크 모드로 고정하고 싶다면?
라이트 또는 다크 를 선택한 채로 원형 아이콘을 클릭하여 시스템 컬러 대응 을 비활성화해주세요.

각 요소별 기본 스타일 변경

편집 모드 오른쪽 패널의 디자인 > 색상 , 폰트 , 모양 탭에서 요소별로 스타일의 기본값을 변경합니다.
➕
디자인 메뉴에서 스타일을 변경해도 적용되지 않는 블록이 있다면?
해당 블록의 색상, 크기, 두께 등이 개별적으로 커스텀된 상태이므로, 해당 블록 설정에서 되돌리기 아이콘을 클릭해 주세요.

사이트 배경, 헤더 스타일

색상 탭의 사이트 전체 영역에서 배경과 사이트 헤더 색상을 변경합니다.

텍스트 스타일

텍스트 색상 변경
색상 탭에서 사이트 전체 타이틀과 기본 텍스트 색상을 변경합니다.
텍스트 크기, 두께, 줄 간격, 폰트 종류 변경
폰트 탭에서 사이트 전체에 적용할 기본 폰트와 제목에 적용할 제목 폰트를 각각 선택합니다.
페이지 제목, 페이지 본문, 제목 1~3을 클릭하여 각각의 두께, 크기, 줄 간격 값을 수정합니다.

➕
채널 글의 스타일을 따로 지정하고 싶다면 '포스트' 옵션을 활성화하여 값을 수정해 주세요.
➕
텍스트마다 스타일을 개별 설정하는 방법은 텍스트 가이드(클릭)에서 확인해 주세요.

버튼 스타일

버튼 배경, 텍스트 색상 변경
색상 탭의 버튼 영역에서 배경과 텍스트 색상을 변경합니다.
버튼 텍스트 크기, 두께, 줄 간격 조절
폰트 탭의 기본값 영역에서 버튼을 클릭하여 두께, 크기, 줄 간격 값을 수정합니다.
버튼 패딩, 모서리 둥글기 조절
모양 탭의 버튼 영역에서 패딩(안쪽 여백)과 둥근 모서리 값을 조절합니다.
버튼 테두리, 그림자 추가
모양 탭의 버튼 영역에서 테두리와 그림자를 활성화해 테두리 두께, 그림자 흐리기, 위치를 조절합니다. 색상 탭으로 이동하여 버튼 영역에서 테두리와 그림자의 색상을 변경합니다.
➕
버튼마다 스타일을 개별 설정하는 방법은 아래 가이드를 클릭해 확인해 주세요.

미디어(이미지, 동영상) 스타일

미디어 모서리 둥글기 조절
모양 탭의 이미지, 동영상 영역에서 둥근 모서리 값을 각각 조절합니다.
미디어 테두리, 그림자 추가
모양 탭의 이미지, 동영상 영역에서 테두리와 그림자를 활성화해 테두리 두께, 그림자 흐리기, 위치를 조절합니다. 색상 탭으로 이동하여 미디어 영역에서 테두리와 그림자의 색상을 변경합니다.
➕
미디어 블록마다 스타일을 개별 설정하는 방법은 아래 가이드를 클릭해 확인해 주세요.

카드(배경, 컬럼) 스타일

카드 배경, 텍스트 색상 변경
색상 탭의 카드 영역에서 배경과 타이틀, 텍스트 색상을 변경합니다.
카드 모서리 둥글기 조절
모양 탭의 카드 영역에서 둥근 모서리 값을 조절합니다.
카드 테두리, 그림자 추가
모양 탭의 카드 영역에서 테두리와 그림자를 활성화해 테두리 두께, 그림자 흐리기, 위치를 조절합니다. 색상 탭으로 이동하여 카드 영역에서 테두리와 그림자의 색상을 변경합니다.
➕
카드 블록마다 스타일을 개별 설정하는 방법은 아래 가이드를 클릭해 확인해 주세요.

채널 미리보기 스타일

채널 미리보기 배경, 텍스트 색상 변경
색상 탭의 채널 영역에서 배경과 텍스트 색상을 변경합니다.
채널 미리보기 모서리 둥글기 조절
모양 탭의 채널 영역에서 둥근 모서리 값을 조절합니다.
채널 미리보기 테두리, 그림자 추가
모양 탭의 채널 영역에서 테두리와 그림자를 활성화해 테두리 두께, 그림자 흐리기, 위치를 조절합니다. 색상 탭으로 이동하여 채널 영역에서 테두리와 그림자의 색상을 변경합니다.