코딩

워드프레스 다이나믹 메뉴 설정하기

코딩저니 렉스 2022. 12. 13. 20:58

워드프레스에서 html 리스트 기능을 사용해서 메뉴를 추가할 수 있지만 function과 wp_nav_menu 워드프레스 기능을 사용해서 관리자 패널에서 쉽게 워드프레스 메뉴를 수정하고 저장할 수 있도록 할 수 있습니다.

 

function에서 register_nav_menu 기능을 사용하여 argument 2개를 추가할 수 있습니다. 'headerMenuLocation' 그리고 'Header Menu Location'이 추가되었습니다.

헤더 메뉴를 위한 기능 추가입니다.

그럼 아래와 같이 관리자 패널에서 테마 메뉴 옵션이 생깁니다.

코드를 삭제하지 않고 보존하면서 숨기기 위해서는 <!-- --> 를 추가하면 위와 같이 그 사이에 있는 코드는 모두 숨겨집니다.

그리고 그 위에 wp_nav_menu php 코드를 추가합니다.

해당 코드는 associative array를 사용할 필요가 있습니다. 

따라서 array에 더해 'theme_location' => 'headerMenuLocation' (아까 만든 기능을 불러올 필요가 있습니다.)

그럼 이렇게 위와 같이 관리자 패널에서 설정한 메뉴만 표시가 됩니다.

또 footer 메뉴를 추가하기 위해서 위와 같이 동일한 function을 추가하였습니다. 

register_nav_menu 그리고 footerLocationOne, footerLocationTwo를 추가하였습니다.

이렇게 하여 아래 두 개의 옵션이 추가되었습니다.

footer.php 파일로 이동을 해서 헤더와 동일하게 footerLocation을 위한 php 코드를 추가하였습니다.

이렇게하여 아래와 같이 푸터 메뉴도 역시 관리자 패널에서 설정한대로 나오게 됩니다.