왕초보 워드프레스로 홈페이지 만들기(10) – “위젯” 이란?

메뉴 작성과 위젯 설정은 유사한 방법으로 설정합니다.

위젯(Widget)이란워드프레스의 위젯은 부가 정보를 보여주는데 사용됩니다. 고정된 위치에 위젯을 위치시키는데요. 

위젯은 위젯이 위치할 수 있는 위젯영역에 들어갈 수 있습니다. 대표적으로 사이드바라고 하는 것이 위젯영역의 하나입니다. 

반응형 테마의 경우 모바일 환경에서는 사이드바가 본문영역보다 아래로, 또는 왼쪽에 숨겨져있다가 버튼을 클릭해서 나타나는 방식으로 숨겨지게 됩니다. 스마트폰에서는 화면이 좁으니까요.

사용방법은 워드프레스 메뉴바의 하단에서 “위젯”을 선택하면 상기 화면이 출력됩니다.

위젯모음에서 사이트에 배치하기를 원하는 “위젯”을 선택하여 오른쪽 “사이드바 배치”에 순서대로 마우스로 끌어다가 배치를 합니다. 그러면 사이드바에 배치된 모양대로 오른쪽, 혹은 스마트폰에서는 하단에 배치되어 출력됩니다.

원하는 위젯은 사이드바에 출력되기를 원하는 명칭으로 상기와 같이 수정합니다.

갤러리 위젯의 경우 아래와 같이 “갤러리편집”을 클릭하여, 원하는 사진들을 선택하여 등록합니다. 등록 완료 후 저장을 하면 사이드바에 갤러리 위젯 설정이 완료됩니다. 갤러리의 사진들을 필요시 수시로 갱신을 하면 됩니다.

전 사이드바 타이틀을 별도로 지정을 하지 않았는데, 각자의 편의대로 “최근 사진” 등과 같이 명칭을 지정하셔도 됩니다.

그러면 완료된 사이드바는 사이트 접속을 하여 확인하면 아래와 같이 출력됩니다.

다른 방법으로 위젯을 변경할 수도 있습니다.

워드프레스의 메뉴에서 “사용자정의하기”를 클릭하시면 화면을 보시면서 쉽게 수정이 가능합니다.

먼저 해당 메뉴에 접속하면 아래와 같이 화면이 출력됩니다.

먼저 위젯 외의 메뉴 설정을 설명하겠습니다.

 “사이트 아이덴티티”에서는 블러그의 명칭과 설명하고, 사이트 로고를 갖고 계신 분은 반영할 수 있습니다.  또한 모바일에서 사용할 아이콘도 선정이 가능합니다.

 “색상” 메뉴에서는 상단 헤더 부분의 헤더글 색상과 등록글 하단의 작은 글(작성자 및 작성일자 표시 문구)의 색상을 지정할 수 있습니다.  

 “헤더 이미지”에서는 소유하고 계신 사진을 활용하여 상단 헤더의 분위기를 연출이 가능합니다. 

상기 화면의 위젯을 클릭하면 “사이드바”를 선택하여 수정할 수 있는 화면으로 이동하여 아래와 같이 작업이 가능합니다.

앞서 위젯 메뉴에서 설명한 것처럼 원하는 모양의 순서를 배치하여 설정할 수 있고, 원하는 위젯을 추가할 수 있습니다. 작업을 진행 한 후 꼭 “발행됨”을 클릭하여 저장 및 최종 종료 설정을 하시길 바랍니다.

메뉴의 배치도 위젯의 배치와 동일한 방법으로 하면 됩니다. 워드프레스 “메뉴”를 클릭하면 아래 화면이 출력됩니다.

추가가능 리스트에서 상위메뉴를 선정하고, 하위 메뉴를 리스트에서 선택하여 “추

가” 한 후에, 마우스로 클릭하여 우측으로 상위메뉴보다 옮겨 주면 됩니다.

마지막으로 “메뉴저장”을 클릭하여 마무리하시면 모든 작업이 종료됩니다.

메뉴구조가 상기 화면 처럼 출력되었다고, 그대로 위젯처럼 배치가 되는 것은 아닙니다. 테마에 따라 메뉴바 설치 위치에 본인이 작업한 순서가 반영되는 것입니다.

제 사이트의 테마는 상기 화면 처럼 출력됩니다. 마우스를 블로그에 위치하면 하위 메뉴가 출력되는 형태입니다. 참고하시길 바랍니다. 또한 스마트폰에는 하단의 그림과 같이 출력됩니다.

연습삼아서 배치 수정 배치하셔도 내용에 변형이 발생하지 않으니, 여러번 테스팅하시길 바랍니다.

댓글 남기기