[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정
워드프레스 외모 메뉴에 대해 알아 보겠습니다. 관리자 페이지의 외모 메뉴 구성은 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 테마파일 편집기 총 5가지 항목 메뉴로 나뉘어집니다. CSS 설정을 하는 테마파일 편집기를 제외한 나머지 4가지 항목에 대해 알아 보겠습니다.
♣ 워드프레스 외모 설정 개요
외모 설정에서 워드프레스 테마 선택과 설치, 테마 옵션 설정, 위젯 설정 및 워드프레스 메뉴와 메뉴바(카테고리)를 설정할 수 있습니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 1 워드프레스 외모 설정 개요](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%99%B8%EB%AA%A8-%EC%84%A4%EC%A0%95-%EA%B0%9C%EC%9A%94.png)
1. 워드프레스 테마
[외모] > [테마] 경로로 접속하면 설치된 워드프레스 테마를 확인할 수 있습니다. 설치된 테마와 함께 활성화 된 테마를 확인할 수 있습니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 2 워드프레스 테마 화면 첫 페이지(관리자 페이지)](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%ED%85%8C%EB%A7%88-%ED%99%94%EB%A9%B4-%EC%B2%AB-%ED%8E%98%EC%9D%B4%EC%A7%80%EA%B4%80%EB%A6%AC%EC%9E%90-%ED%8E%98%EC%9D%B4%EC%A7%80.png)
중앙 상단의 [새로 추가] 버튼을 눌러서 활성화 및 설치된 테마와 함께 인기 있는 순으로 테마 목록을 확인할 수 있습니다. 모두 무료로 설치할 수 있는 테마입니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 3 워드프레스 테마 추가 페이지(관리자 페이지)](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%ED%85%8C%EB%A7%88-%EC%B6%94%EA%B0%80-%ED%8E%98%EC%9D%B4%EC%A7%80%EA%B4%80%EB%A6%AC%EC%9E%90-%ED%8E%98%EC%9D%B4%EC%A7%80.png)
테마 위로 마우스를 올리면 테마 세부 정보를 클릭할 수 있습니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 4 워드프레스 테마 상세 미리보기(관리자 페이지)](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%ED%85%8C%EB%A7%88-%EC%83%81%EC%84%B8-%EB%AF%B8%EB%A6%AC%EB%B3%B4%EA%B8%B0%EA%B4%80%EB%A6%AC%EC%9E%90-%ED%8E%98%EC%9D%B4%EC%A7%80.png)
[외모]의 [테마]에서 테마 검색 및 [설치] 버튼을 눌러 설치를 진행할 수 있습니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 5 워드프레스 테마 설치(아스트라 테마)](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%ED%85%8C%EB%A7%88-%EC%84%A4%EC%B9%98%EC%95%84%EC%8A%A4%ED%8A%B8%EB%9D%BC-%ED%85%8C%EB%A7%88.png)
기존에 설치된 Neve 테마에서 아스트라 테마로 활성 테마가 변경 된 것을 확인할 수 있습니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 6 워드프레스 테마 설치(기존 Neve에서 아스트라 테마로 변경)](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%ED%85%8C%EB%A7%88-%EC%84%A4%EC%B9%98%EA%B8%B0%EC%A1%B4-Neve%EC%97%90%EC%84%9C-%EC%95%84%EC%8A%A4%ED%8A%B8%EB%9D%BC-%ED%85%8C%EB%A7%88%EB%A1%9C-%EB%B3%80%EA%B2%BD.png)
기존에 사용하지 않는 테마는 [테마 상세정보]를 통해 삭제할 수 있습니다.
2. 워드프레스 사용자 정의하기
[사용자 정의하기]는 설치한 테마의 커스터 마이징 기능입니다. 사용자 정의하기는 전역(글로벌) 설정, 헤더와 푸터, 사이드바, 상단 카테고리 메뉴(메뉴) 및 위젯과 추가 CSS 등의 설정이 가능하며, 전반적인 워드프레스 구성은 [사용자 정의하기]에서 할 수 있다고 보면 됩니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 7 워드프레스 사용자 정의하기 첫 화면](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98%ED%95%98%EA%B8%B0-%EC%B2%AB-%ED%99%94%EB%A9%B4.png)
3. 워드프레스 외모 위젯 기능
외모 위젯은 특정 기능을 헤더 및 푸터, 사이드바 등에 삽입할 수 있습니다. 위젯은 보관함, 달력, 사용자 정의 HTML, 검색 및 숏코드 등 다양한 기능을 넣을 수 있습니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 8 워드프레스 위젯의 기능 기능](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%9C%84%EC%A0%AF%EC%9D%98-%EA%B8%B0%EB%8A%A5-%EA%B8%B0%EB%8A%A5.png)
초반에 워드프레스를 설치했다면 [최신 글], [최신 댓글] 두 설정된 위젯은 삭제해주며 [+] 버튼으로 원하는 위젯을 추가할 수 있습니다. 이미지나 검색 기능, 쇼트코드를 통해 애드센스 광고 등을 넣을 수 있으니 테마를 설정하는 사용자 정의하기 플러그인 설정 다음으로 자주 사용되는 메뉴일 수 있습니다.
[사용자 정의하기]에서 직접 눈으로 보며 위젯을 설정할 수도 있습니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 13 워드프레스 사용자 정의하기 첫 화면-위젯](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98%ED%95%98%EA%B8%B0-%EC%B2%AB-%ED%99%94%EB%A9%B4-%EC%9C%84%EC%A0%AF.png)
4. 관리자 페이지 외모에서 워드프레스 메뉴 설정하기
워드프레스에서 글과 페이지의 콘텐츠를 사이트 상단에 고정하려면 메뉴 설정을 해야 합니다.
카테고리에 대한 추가 내용이 필요할 경우 워드프레스 카테고리 만들기(&메뉴 만들기) 버튼을 눌러 이동한 후에 내용을 확인할 수 있습니다.
워드프레스 메뉴바를 이용해 워드프레스 메뉴를 만들어 보겠습니다.
4.1 워드프레스 메뉴바 만들기
[외모] > [메뉴 페이지]로 접속합니다. 첫 번째 작업은 메뉴 생성입니다.
4.1.1 메뉴 생성
[메뉴 구조] > [메뉴 이름]에서 원하는 메뉴명을 입력 후(main Menu) 우측 [메뉴 생성] 버튼을 클릭합니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 14 워드프레스 메뉴 생성](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EB%A9%94%EB%89%B4-%EC%83%9D%EC%84%B1.png)
4.1.2 워드프레스 메뉴바 설정에서 카테고리 추가하기
이제 생성한 카테고리를 메뉴바에 등록하는 작업만 남았습니다. ①②③의 순서대로 진행합니다. ④의 결과를 얻을 수 있습니다. 설정이 완료 되었다면 우측의 [메뉴 저장] 버튼을 눌러서 저장하면 완성됩니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 15 워드프레스 메뉴바 설정에서 카테고리 추가하기](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EB%A9%94%EB%89%B4%EB%B0%94-%EC%84%A4%EC%A0%95%EC%97%90%EC%84%9C-%EC%B9%B4%ED%85%8C%EA%B3%A0%EB%A6%AC-%EC%B6%94%EA%B0%80%ED%95%98%EA%B8%B0.png)
④TEST 카테고리 서브 카테고리는 웹 사이트에 하위 메뉴를 만들어 주는 항목이며, 마우스로 드래그 해서 우측으로 옴겨야 적용이 가능하며 이미 마우스로 옴겨서 적용한 화면입니다. 기본 세팅 된[Uncategorized]는 [제거] 버튼을 눌러 메뉴에서 삭제할 수 있습니다. 다른 카테로리도 동일한 방법으로 삭제를 하시면 되겠지요.
기본으로 만든 워드프레스 메인 페이지 접속했을 때 결과 값입니다. ▼
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 16 워드프레스 메뉴바 설정에서 카테고리추가 결과 값(사용자 페이지)](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EB%A9%94%EB%89%B4%EB%B0%94-%EC%84%A4%EC%A0%95%EC%97%90%EC%84%9C-%EC%B9%B4%ED%85%8C%EA%B3%A0%EB%A6%AC%EC%B6%94%EA%B0%80-%EA%B2%B0%EA%B3%BC-%EA%B0%92%EC%82%AC%EC%9A%A9%EC%9E%90-%ED%8E%98%EC%9D%B4%EC%A7%80.png)
4.1.3 워드프레스 메뉴바 구성
워드프레스 메뉴바는 카테고리와 페이지를 추가할 때 주로 사용되며 메뉴에 글(Post)이나 사용자 정의 링크(다른 웹 사이트 URL이나 내 웹 사이트)를 추가할 수 있습니다.
4.1.4 사용자 정의하기를 이용한 메뉴 설정
[사용자 정의하기]에 접속 후
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 17 워드프레스 사용자 정의하기에서 메뉴 설정](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98%ED%95%98%EA%B8%B0%EC%97%90%EC%84%9C-%EB%A9%94%EB%89%B4-%EC%84%A4%EC%A0%95.png)
[메뉴] 버튼을 눌러
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 18 워드프레스 사용자 정의하기 화면 이동 후-메뉴 설정](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98%ED%95%98%EA%B8%B0-%ED%99%94%EB%A9%B4-%EC%9D%B4%EB%8F%99-%ED%9B%84-%EB%A9%94%EB%89%B4-%EC%84%A4%EC%A0%95.png)
직접 변경된 화면을 보면서 설정을 할 수 있습니다.
외모에서 테마와 사용자 정의하기, 위젯 설정, 메뉴(메뉴바) 구성 방법에 대해 알아 봤습니다.
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 9 워드프레스 외모 위젯에서 위젯추가하기](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%99%B8%EB%AA%A8-%EC%9C%84%EC%A0%AF%EC%97%90%EC%84%9C-%EC%9C%84%EC%A0%AF%EC%B6%94%EA%B0%80%ED%95%98%EA%B8%B0.png)
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 10 워드프레스 외모 위젯에서 위젯 제거하기](https://uknew.co/wp-content/uploads/2023/07/%EC%9B%8C%EB%93%9C%ED%94%84%EB%A0%88%EC%8A%A4-%EC%99%B8%EB%AA%A8-%EC%9C%84%EC%A0%AF%EC%97%90%EC%84%9C-%EC%9C%84%EC%A0%AF-%EC%A0%9C%EA%B1%B0%ED%95%98%EA%B8%B0.png)
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 19 [WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정](https://uknew.co/wp-content/uploads/2023/07/%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98%ED%95%98%EA%B8%B0-%EB%A9%94%EB%89%B4-%EC%84%B8%ED%8C%851.png)
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 20 [WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정](https://uknew.co/wp-content/uploads/2023/07/%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98%ED%95%98%EA%B8%B0-%EB%A9%94%EB%89%B4-%EC%84%B8%ED%8C%852.png)
![[WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정 21 [WP] 워드프레스 외모 | 테마 | 사용자 정의하기 | 위젯 | 메뉴 | 4가지 항목 이해 및 설정](https://uknew.co/wp-content/uploads/2023/07/%EC%82%AC%EC%9A%A9%EC%9E%90-%EC%A0%95%EC%9D%98%ED%95%98%EA%B8%B0-%EB%A9%94%EB%89%B4-%EC%84%B8%ED%8C%853.png)