프로젝트 ABC..

[휘게프레스] 헤더(Header)부터 만들어보자 (1)

z9e5 2023. 7. 12. 01:53

프로젝트 ABC 카테고리는 웹사이트를 만드는 모든 과정을 기재합니다.

워드프레스를 이용해서 제작되며 사용한 테마는 Hello Elementor를 사용하고, 플러그인은 Elementor, Elementor Pro를 기본적으로 사용합니다.

 

안녕하세요 유피입니다.

이번주는 웹사이트 리뉴얼 작업을 진행할 계획입니다.

로고를 변경하면서 웹사이트도 한번..ㅎㅎ

 

만드는 과정에서 생략된 부분이 있을 수 있습니다. 궁금한 부분이 있다면 댓글로 남겨주세요!

 

웹사이트는 기본적으로 헤더(Header), 메인(Main), 푸터(Footer)로 구성되어 있습니다.

헤더(Header)는 웹사이트의 상단에 위치하며, 웹사이트의 이름, 로고, 메뉴 등이 포함됩니다.

 

엘리멘터 프로는 헤더와 푸터를 만들 수 있게 지원합니다.

대시보드 - 템플릿 - 새로 추가 - 헤더선택 - 이름입력 - 템플릿 만들기 버튼 클릭

 

우선 로고, 메뉴, 아이콘, 이미지로 구성했으며

아이콘과 이미지 클릭시 팝업 형태로 나올 수 있도록 설정했습니다.

(이미지의 오른쪽 내비게이터에서 구성된 위젯을 확인할 수 있습니다!)

 

사라진 메뉴는 팝업안의 템플릿 페이지에 만들 예정이기 때문에 메뉴를 숨겼습니다.

모바일에서도 팝업 형태의 디자인은 보기 좋고 사용에 문제없어 보입니다!

이렇게 심플한 헤더의 작업이 끝났네요. 다음은 푸터를 작업하러 가볼까요?