Wix 홈

Studio 에디터: 사이트 스타일 관리하기

6 분 분량
사이트의 텍스트 스타일, 색상, 페이지 전환 효과 및 최대 너비를 한 곳에서 관리하세요. 클라이언트 사이트의 테마를 생성하는 것은 시간을 절약하고 디자인의 일관성을 유지할 수 있는 훌륭하고 종합적인 방법입니다. 
사이트 스타일 패널이 표시되어 글꼴, 텍스트 스타일, 최대 너비 섹션을 클릭해 확장되어 있는 GIF
다음 지침을 참고하세요.

글꼴 및 텍스트 스타일 편집하기

사이트 전체에서 사용되는 텍스트를 원하는 모양에 맞게 사용자 지정하세요. 사이트 글꼴을 변경하거나 9개의 개별 텍스트 스타일(6개의 제목, 3개의 단락)의 디자인을 조정할 수 있습니다.   
도움말:
H1 - H6은 이러한 제목에 자동으로 지정되는 제목 태그입니다.제목 태그에 따라 제목의 하향식 계층 구조를 유지하면, SEO와 접근성 모두에 도움이 됩니다. 

글꼴 스타일을 업데이트하려면:

  1. 에디터 왼쪽에서 사이트 스타일을 클릭합니다.
  2. 글꼴 또는 텍스트 스타일 중 사용자 지정할 항목을 선택합니다.

페이지에 텍스트 스타일 추가하기

테마가 있는 제목과 단락은 요소 추가 패널에서 사용할 수 있습니다. 텍스트를 클릭한 후 텍스트 테마 아래에서 해당 스타일을 원하는 위치로 끌어다 놓습니다. 
요소 추가 패널에서 사용할 수 있는 텍스트 테마의 스크린샷 추천 디자인 부제목이 강조 표시되어 있습니다.

텍스트 요소에 스타일 적용하기

페이지의 기존 텍스트 요소에 스타일을 적용할 수도 있습니다. 요소에서 텍스트 편집을 클릭한 후 속성의 드롭다운에서 해당 스타일을 선택합니다.
속성 패널의 잘린 디자인 섹션 스크린샷. 스타일 드롭다운이 강조 표시되어 있습니다.

텍스트 스타일 재정의하기

스타일(테마)을 선택한 후 텍스트 요소의 디자인을 변경하면 "디자인 재정의"가 생성됩니다. 이는 선택한 스타일의 업데이트 사항이 해당 텍스트 요소에 적용되지 않음을 의미합니다. 
재정의가 적용된 텍스트 요소를 원래 스타일로 재설정할 수 있습니다. 또한, 스타일 자체에 원하는 재정의를 적용할 수도 있습니다. 스타일에 마우스오버한 후 추가 작업 아이콘을 클릭해 원하는 작업을 선택합니다.
속성 내 텍스트의 디자인 탭입니다. 커서를 텍스트 스타일에서 초기화 옵션에 마우스오버하고 있습니다.

사이트 색상 변경하기

사이트의 테마 색상을 정의합니다. 테마 색상은 카테고리로 나누어져 사이트의 특정 부분에 맞게 조정할 수 있습니다. 카테고리의 전체 범위 또는 범위의 특정 음영을 사용자 지정하세요.
도움말:
이 작업은 변경하려는 색상을 사용하는 요소에 즉시 영향을 미칩니다. 예를 들어, 추가한 테마 요소 또는 해당 색상을 사용한 기타 요소가 될 수 있습니다.

사이트 색상을 변경하려면:

  1. 에디터 왼쪽에서 사이트 스타일을 클릭합니다.
  2. 색상 범위 또는 개별 색상 중 조정할 항목을 선택합니다.

페이지 전환 효과 추가하기

페이지 전환 효과를 추가해 방문자에게 더 매력적인 탐색 환경을 제공하세요.사이트 스타일 패널에서 전환 효과를 선택하면 사이트의 모든 페이지에 표시됩니다. 

페이지 이동 효과를 추가하려면:

  1. 에디터 왼쪽에서 사이트 스타일을 클릭합니다.
  2. 페이지 전환 효과를 클릭합니다.
  3. 목록에서 전환 효과를 선택합니다.
    • 없음: 방문자가 페이지 간 이동 시 전환이 표시되지 않습니다.
    • 아웃-인: 현재 페이지가 페이드 아웃되고 새 페이지가 페이드 인됩니다.
아웃-인 전환을 선택하고 페이지 전환 효과 섹션이 열려 있는 사이트 스타일 패널의 스크린샷

자주 묻는 질문

아래 질문을 클릭해 사이트 스타일에 대해 자세히 알아보세요.
사이트 스타일 패널이 표시되어 글꼴, 텍스트 스타일, 최대 너비 섹션을 클릭해 확장되어 있는 GIF
요소 추가 패널에서 사용할 수 있는 텍스트 테마의 스크린샷 추천 디자인 부제목이 강조 표시되어 있습니다.
속성 패널의 잘린 디자인 섹션 스크린샷. 스타일 드롭다운이 강조 표시되어 있습니다.
속성 내 텍스트의 디자인 탭입니다. 커서를 텍스트 스타일에서 초기화 옵션에 마우스오버하고 있습니다.
아웃-인 전환을 선택하고 페이지 전환 효과 섹션이 열려 있는 사이트 스타일 패널의 스크린샷