WordPress 테마에 슬라이드 패널 메뉴를 추가하는 방법

최근 게시물 게시판 wordpress WordPress 테마에 슬라이드 패널 메뉴를 추가하는 방법

  • WordPress 사이트에 슬라이드 패널 메뉴를 추가하시겠습니까?

    반응형 메뉴를 추가하면 사용자가 모바일 장치를 사용할 때 웹사이트를 더 쉽게 탐색할 수 있습니다. 메뉴 아이콘을 탭하면 패널 메뉴가 아름다운 애니메이션을 사용하여 화면으로 슬라이드됩니다.

    이 기사에서는 코드를 작성하지 않고 WordPress 테마에 슬라이드 패널 메뉴를 추가하는 방법을 보여줍니다.

    WordPress 테마에 슬라이드 패널 메뉴를 추가하는 방법

    WordPress 테마에 슬라이드 패널 메뉴를 추가하는 이유는 무엇입니까?

    잘 디자인된 메뉴는 방문자가 귀하의 사이트에서 길을 찾는 데 도움이 됩니다. 워드프레스 웹사이트. 많은 방문자가 휴대기기를 사용하므로 WordPress 사이트의 모바일 버전 미리보기 탐색 메뉴가 작은 화면에서 어떻게 보이는지 확인합니다.

    운 좋게도 많은 WordPress 테마에는 작은 화면에서 볼 때 모바일 친화적인 메뉴를 자동으로 표시하는 스타일이 내장되어 있습니다.

    그러나 모바일 탐색을 훨씬 더 맞춤설정하고 추가할 수 있습니다. 전체화면 반응형 메뉴 또는 애니메이션 슬라이드 패널 메뉴.

    이를 염두에 두고 WordPress 테마에서 슬라이드 패널 메뉴를 추가하는 방법을 살펴보겠습니다.

    WordPress 테마에 슬라이드 패널 메뉴를 추가하는 방법

    가장 먼저해야 할 일은 설치하고 활성화하는 것입니다. 반응형 메뉴 플러그인. 자세한 내용은 에 대한 단계별 가이드를 참조하십시오. WordPress 플러그인을 설치하는 방법.

    의 프리미엄 버전이 있습니다. 반응형 메뉴 추가 테마 및 다음과 같은 추가 기능으로 조건부 논리하지만 이 튜토리얼에서는 무료 플러그인을 사용할 것입니다.

    활성화되면 다음으로 이동합니다. 반응형 메뉴 » 메뉴 페이지. 여기에서 화면 상단의 ‘새 메뉴 만들기’ 버튼을 클릭해야 합니다.

    새로운 반응형 메뉴 만들기

    그러면 새로운 반응형 메뉴에 사용할 수 있는 네 가지 테마가 표시됩니다. 추가 테마를 구매할 수 있습니다.

    이 자습서에서는 자동으로 선택된 테마를 사용합니다. 그런 다음 ‘다음’ 버튼을 클릭할 수 있습니다.

    반응형 메뉴 테마 선택

    메뉴 설정 페이지로 이동합니다. 여기에서 반응형 메뉴의 이름을 입력한 다음 패널에 표시할 WordPress 메뉴를 선택할 수 있습니다.

    이 튜토리얼에서는 ‘탐색’ 메뉴를 선택했습니다. 새 메뉴를 만들어야 하는 경우 다음 가이드에 따라 방법을 배울 수 있습니다. WordPress에 탐색 메뉴를 추가하는 방법.

    메뉴에 이름을 지정하고 사용하려는 WordPress 메뉴와 연결

    사용자가 새 슬라이드 패널 메뉴만 볼 수 있도록 WordPress 테마와 함께 제공되는 일반 메뉴를 숨길 수도 있습니다. ‘테마 메뉴 숨기기’ 필드에 CSS 코드를 입력하면 됩니다.

    여기에 입력해야 하는 코드는 테마마다 다르며 ‘자세히 알아보기’ 링크를 클릭하면 자세한 내용을 확인할 수 있습니다.

    Pro 버전 사용자에게는 몇 가지 추가 설정이 있습니다. 예를 들어, Pro 사용자는 메뉴가 표시되어야 하는 장치와 페이지를 선택할 수 있습니다.

    설정에 만족하면 페이지 하단의 ‘메뉴 만들기’ 버튼을 클릭해야 합니다. 그러면 메뉴 사용자 지정을 완료할 수 있는 페이지로 이동합니다.

    화면 오른쪽에 웹사이트 미리보기가 표시되고 하단에는 전화, 태블릿 및 데스크톱 보기 간에 전환할 수 있는 버튼이 있습니다. 또한 왼쪽에서 사용자 정의 옵션을 찾을 수 있습니다.

    이제 반응형 메뉴를 사용자 정의할 수 있습니다

    메뉴 위에 일부 텍스트가 표시됩니다. 이것은 메뉴의 제목 텍스트이자 플러그인이 ‘추가 콘텐츠’라고 부르는 한 줄의 텍스트입니다.

    페이지 왼쪽 메뉴에서 ‘모바일 메뉴’를 클릭한 다음 ‘컨테이너’를 클릭하여 텍스트를 편집하거나 숨길 수 있습니다.

    메뉴 상단에 표시되는 텍스트 사용자 지정 또는 숨기기

    ‘주 메뉴’ 또는 ‘내비게이션’과 같이 ‘제목 텍스트’ 필드에 원하는 것을 입력할 수 있습니다. 제목을 표시하지 않으려면 ‘제목’ 스위치를 끄기 위치로 밉니다.

    그런 다음 ‘추가 콘텐츠’ 설정까지 아래로 스크롤해야 합니다. 이 설정을 끄거나 대체 콘텐츠를 입력할 수 있습니다. 아래 스크린샷에서 스위치가 꺼져서 ‘여기에 콘텐츠 추가…’라는 단어가 숨겨져 있음을 알 수 있습니다.

    메뉴에 대한 추가 콘텐츠 사용자 지정 또는 숨기기

    메뉴 설정에 만족하면 페이지 하단의 ‘업데이트’ 버튼을 클릭하여 설정을 저장합니다.

    반응형 메뉴 플러그인에는 슬라이드 패널 메뉴의 동작과 모양을 변경할 수 있는 다른 많은 옵션이 있습니다. 플러그인의 설정 페이지에서 이러한 옵션을 탐색하고 필요에 따라 조정할 수 있습니다.

    이제 웹 사이트를 방문하여 작동 중인 메뉴를 볼 수 있습니다. 다음은 데모 웹사이트에서 볼 수 있는 방법입니다. 현재 페이지가 메뉴에 있으면 색상 밴드로 강조 표시됩니다.

    WordPress의 슬라이드 패널 메뉴 애니메이션

    이 튜토리얼이 WordPress 테마에 슬라이드 패널 메뉴를 추가하는 방법을 배우는 데 도움이 되었기를 바랍니다. 당신은 또한 배우고 싶을 수도 있습니다 WordPress 사이트 방문자를 추적하는 방법또는 우리의 목록을 확인하십시오 사이트 성장을 위한 필수 플러그인.

    이 기사가 마음에 들면 구독하십시오. 유튜브 채널 WordPress 비디오 자습서용. 당신은 또한 우리를 찾을 수 있습니다 트위터 그리고 페이스북.

    Source link

    신고하기
'WordPress 테마에 슬라이드 패널 메뉴를 추가하는 방법'에 답변달기
글쓴이 정보:




+ 73 = 81