워드프레스 헤더 메뉴 폰트 디자인|아스트라

워드프레스 아스트라 테마 헤더 메뉴

워드프레스 사이트 디자인을 위해 아스트라 테마를 사용하고 있다면 웹사이트의 거의 모든 부분을 사용자 정의할 수 있습니다. 아스트라 테마의 경우 메인 헤더, 메인 헤더 위 헤더, 메인 헤더 아래 헤더, 모바일 헤더, 투명 헤더 등의 기능을 지원합니다. 이 가이드는 아스트라 테마의 메인 헤더 및 모바일 헤더를 사용자 정의하는 방법에 대해 설명합니다.

워드프레스 테마 디자인 사용자 정의

01. 워드프레스 테마 디자인 사용자 정의

먼저 워드프레스에서 아스트라 테마를 커스터마이징하기 위해 [테마 디자인] ▶[사용자 정의하기]로 이동합니다.

아스트라 테마 헤더 디자인으로 이동

02. 아스트라 테마 헤더 디자인으로 이동

사용자 정의하기 메뉴내에 [헤더] 설정을 선택합니다.

메인 메뉴 디자인 설정 선택

03. 메인 메뉴 디자인 설정 선택

헤더 커스텀 설정 중 [주 메뉴] 설정을 선택합니다.

메뉴에 포함할 아이템 선택

04. 메뉴에 포함할 아이템 선택

첫 번째 사용자 정의 항목은 [메뉴]입니다. 헤더에서 메뉴를 비활성화하거나 메뉴에 위젯, 검색, 문구, 버튼 등을 추가할 수 있습니다.

서브메뉴 디자인

05. 서브메뉴 디자인

다음으로 [서브 메뉴] 디자인입니다. 메뉴 항목 아래에 하위 항목이 추가될 경우 서브 메뉴로 표시되며, 서브 메뉴가 나타날때 애니메이션을 설정하고 서브 메뉴를 담는 컨테이너 박스의 테두리 색상을 커스텀할 수 있습니다.

모바일 메뉴 디자인

06. 모바일 메뉴 디자인

[모바일 메뉴] 사용자 정의에서는 모바일 메뉴로 변환되는 중단점, 메뉴 스타일, 메뉴 버튼의 디자인 등을 사용자 정의할 수 있습니다. 특정 색상을 선택하지 않은 경우 테마 특성 색상이 기본값입니다.

메뉴의 색상 및 폰트, 공간 디자인

07. 메뉴의 색상 및 폰트, 공간 디자인

마지막으로 헤더에 포함되는 메뉴의 폰트, 폰트 색상, 폰트 크기, 굵기 등을 커스텀할 수 있습니다. 모니터 아이콘 클릭 시 태블릿, 모바일에 적용되는 폰트를 실시간으로 확인하며 디자인할 수 있습니다.

아스트라 테마 헤더 메뉴 디자인 완료
아스트라 테마 헤더 메뉴 모바일 버전 디자인

아스트라 테마 [주 메뉴]에서 헤더에 포함되는 메뉴를 위와 같이 디자인할 수 있습니다. PC에서 확인할 수 있는 메뉴만 디자인하는 경우가 있는데, 모바일에서 표시되는 메뉴 디자인도 잊지말고 설정하시기바랍니다

댓글 남기기

이메일은 공개되지 않습니다.