질문/공유팁 게시판

메뉴 검색 위젯 0.0.1

윤삼
조회 수 1616 추천 수 6
크게 작게 댓글로 가기
크게 작게 위로 아래로 댓글로 가기

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

 

 

개요

 

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

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

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

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

 

 

미리보기

 

https://bit.ly/2DxNd2V

 

 

기본 기능 및 검색

 

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

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

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

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

 

 

자동 완성 기능

 

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

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

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

Atachment
첨부

윤삼

profile
아무래도 중급 초반 수준의 코딩 오타쿠인 것 같습니다.
위로 아래로
댓글 28
  • ?
    오호..제가 이거 스킨 꾸미면 default로 지정해주실건가요?
    농담이에요 ㅎㅎ 잘쓸게요!
  • ? profile
    넵, 당연 default로 갈 겁니다!
    진심으로요!
  • ? profile
    위젯 클래스 파일을 업데이트해야겠어요.
    혹시 만약 어쩌면 정말로 스킨을 만들어주신다면 위젯이 안정화된 다음으로 부탁드려요~
  • profile ?
    넹 ㅎㅎ
    현재는 그냥 어떻게 할지 구상중..(디시인사이드를 좀 따라해야할듯 ㅋㅋ)
  • ? profile
    네, 감사합니다!!
  • ?
    고생하셨네요 쉽지않은 작업인데
  • ? profile
    이것저것 신경쓸 게 많긴 했는데 예전에 회원 검색 위젯 만들면서 헤멨던 경험이 있어서 그나마 시행착오를 줄일 수 있었어요ㅎ
  • profile ?
    역시 다시한번 삽질의 위대함을 느낍니다 ㅎㅎ
  • profile
    감사하고 수고 많으셨습니다.
  • profile profile
    아직 스킨이 밍밍해서 민망합니다;;;
  • ?
    와 이걸 구현하시다니 대단해요
  • ? profile
    네, 써보시고 피드백 주시면 감사하겠습니다~
  • profile
    오~~ 좋은거 완성하셨네요.
    그런데 한가지....

    생각보다 많은 사이트들이 메뉴그룹은 1,2개 에
    1차메뉴 - 2차 메뉴 계층 구조로 많이 제공할 것 같습니다. 저희는 XE타운 처럼요. 커뮤니티 성격의 경우는 ..


    그래서
    메뉴 그룹의 1차메뉴가 그룹처럼 나열이 되고 그 그룹 아래에 2차메뉴-3차메뉴가 보이는 식으로 표현하는 것이 있으면 좋겠닸는 생각을 했습니다.
  • profile

    펑~~~~~~~~~~

     

     

    저희 사이트맵 인데요.

     

    상단,하단 메뉴 2개만 출력하고 있어요. 중간메뉴 하나가 더 있긴 한데 그건 빠져 있구요.

  • profile profile
    아 그렇겠네요.
    역시 제 위주로 생각하면 이래요.
    메뉴그룹은 탭으로 둔다든가 하고 그 아래에 1차 메뉴 중심으로 메뉴 아이템을 뿌리는 것도 방법이겠습니다.
    스킨에서 충분히 구현 가능할 것 같아요.
  • profile profile
    아마 메뉴 그룹을 굉장히 많이 만들어 사용하는 대형 사이트는 지금 구성해 주신 것이 적합할 것 입니다.
    선택지가 있다면 정말 좋겠지만 개발자분은 머리가 아파지죠... 이미지는 보셨으니 펑 하겠습니다 ㅋ
  • profile
    그리고 추가로 언급드리고 싶은 내용은 위젯캐시는 0으로 사용하지 않는 것으로 하는 것이 좋습니다 물론 위젯 생성할때 운영자가 알아서 할일이긴 하지만요.
    관리자가 편하게 보기위한 메뉴들이 있다면 관리자가보는 것을 캐시되어 버리면 다른 방문자들에게도 관리자만 봐야하는 메뉴가 노출됩니다.

    물론 위젯캐시를 다른 방법으로 사용한다면 문제가 되지 않겠지만요. html 자체를 캐시하는 경우 문제가 발생할 것 입니다.

    저희도 지금 사용하는 사이트맵 위젯으로 사이트맵을 방문자에게 제공하지만 제가 편하게 접근하는 일부 메뉴가 혼용되어 있어 캐시시간은 0으로 해서 매번 불러오게 해 놓았습니다.
  • profile profile

    권한별로 메뉴 노출이 다를 수 있으니 캐시 설정을 0으로 두는 게 낫겠다는 말씀이신 거죠?
    사실 캐시 적용을 하면 검색 결과를 뿌려줄 수 없어서 고민이 됐었는데, 아예 캐시를 0으로 고정해둘 방법이 있을지도 생각해봐야겠습니다.

    덧. 검색창 입력값에 따라 실시간으로 메뉴 리스트를 필터링해주는 것도 방법이겠네요.

  • profile profile
    주의사항 정도로 안내해주시면 될 것 같습니다. 기존 사이트맵 위젯들도 마찬가지 문제가 있어요.
  • profile
    감사합니다
  • profile
    존경합니다...
  • profile
    감사합니다:)
  • ?
    자료 감사합니다.
    가상서버에서는 캐시 랑 검색어 로컬 저장 시간 을 평균적으로 어떻게 지정해야 하는지 궁금합니다.
  • ? profile
    업데이트된 버전이 있으니 그걸 사용하시면 좋겠구요.
    https://xetown.com/tips/1164208

    메뉴검색 기능을 위해 캐시 적용은 무효화시켰구요.
    검색어 로컬 저장 시간은 운영자의 메뉴 구조 갱신 주기를 고려해서 설정하시면 좋을 것 같습니다.
  • profile ?

    감사합니다. 링크 주신 (0.1.0)걸로 수정 없이 설치를 했는데요.
    위젯 추가 페이지에서 아래 이미지 파란색 과 제일 하단 공백 부분을 눌러도 " 메뉴 목록 및 검색' 위젯창이 뜨는데 혹시 이부분은 어디가 문제일까요?

    xe 최신버젼 따로 위젯 수정은 하질 않았습니다. 

    2019-04-09 11,17,31.JPEG

  • ? profile
    글쎄요. 0.0.1을 삭제하고 설치하신 건가요?
    저렇게 나오는 이유는 저도 잘 모르겠습니다;;;
  • profile ?
    네 0.1.0만 설치를 했습니다. 사용에 큰 영향을 끼치는 부분이 아닌것 같습니다.
    잘 쓰겠습니다. ^^
  • ? profile
    캐시파일 재생성 말고는 저도 잘 모르겠네요ㅜ
    암튼 유익하게 사용되길 빌겠습니다~