메뉴 검색 위젯 0.0.1

만들겠다 공언하기도 했고 어쨌든 부족하나마 만들어 배포해봅니다.

개요

- 사이트 메뉴의 목록을 출력하고 검색하게 해주는 위젯입니다.

- 게시판 등 사이트 메뉴를 대량으로 보유한 사이트에 적합한 위젯입니다.

- 목록 출력 방식은 사이트맵 형식, 가나다순 형식을 선택할 수 있습니다. (이온디님의 사이트맵 위젯 스킨의 아이디어와 디자인을 살짝 참조했습니다ㅜ)

- 위젯 코드 생성시 캐시를 설정하면 검색은 불가능하며 메뉴 목록만 볼 수 있습니다.

미리보기

https://bit.ly/2DxNd2V

기본 기능 및 검색

- 메뉴를 선택해서 메뉴 아이템들을 출력합니다. 메뉴를 선택하지 않으면 (노출을 허용한) 모든 메뉴를 출력합니다.

- 메뉴의 정렬 방식은 '사이트맵', '가나다순', '둘 다' 등 모두 3가지 방식이 있습니다. ('둘 다'를 선택하면 '사이트맵'과 '가나다순' 형식의 목록을 선택할 수 있는 컨버터 스위치가 출력됩니다)

- 검색을 '사용 안 함'으로 선택하면 검색 필드가 나타나지 않게 됩니다.

- 메뉴 아이템의 제목뿐 아니라 메뉴 설명도 검색할 수 있습니다.

자동 완성 기능

- jQuery UI의 autocomplete를 활용했으며, 검색어를 자소단위로 나눠 검색어 자동완성에 역동성을 더했습니다.

- 검색 필드 포커스 이벤트와 로컬 저장소 활용으로 서버 부하를 줄일 수 있습니다.

- 자동완성 드롭다운 메뉴의 목록 개수, z-index값을 지정할 수 있습니다.