페이지 내용의 길이가 길 경우, 사용자는 사이드바의 유용한 위젯이나 메뉴를 놓칠 수 있습니다. 사이드바를 고정함으로써, 방문자는 스크롤하는 동안에도 항상 사이드바의 내용을 볼 수 있게 되어 사용자 경험이 향상됩니다. GeneratePress에서는 기본값으로 사이드바 고정이 안되기 때문에 설정이 필요합니다. WP Sticky Sidebar를 이요해서 사이드바 고정하는 방법을 기록합니다.
WP Sticky Sidebar 설치
플러그인 > 새로추가 > WP Sticky Sidebar 검색하여 설치 와 활성화를 진행합니다.
사이드바 고정 설정
플러그인 기본값으로 고정시킬 클래스 이름이 #secondary로 되어 있습니다.
이건 테마에 따라 달라지는 부분인데요. 저는 GeneratePress 테마를 사용중인데 클래스 이름 변경이 필요 했습니다.
(Astra 테마는 이 값을 변경하지 않아도 괜찮다고 합니다.)
고정시킬 클래스 (Sticky Class) 찾기
입력해야할 클래스 이름은 GeneratePress 테마파일 편집기에서 확인할 수 있습니다.
고정시킬 클래스 설정
#right-sidebar 입력 후 저장합니다.
글 스크롤을 아래로 내려도 사이드바는 딱 고정되어 있습니다… 다만
고정된 위치가 조금 삐딱한 것이 상당히 마음이 불편합니다.
사이드바 고정 높이 값 조정
WP Sticky Sidebar 플러그인의 설정으로 이동하여 top margin을 조정합니다.
오호~~ 두번만에 딱 맞췄습니다.
참고 글