일부 수익형 블로그에서는 헤더와 메뉴를 제거하여 블로그에 올라온 최신 글들을 방문자들이 쉽게 알 수 없도록 하기도 합니다. 워드프레스 인기 테마 중 하나인 GeneratePress 테마를 사용하는 경우 몇 가지 방법으로 헤더와 메뉴를 제거하거나 숨길 수 있습니다.
워드프레스 GeneratePress 테마: 헤더 및 메뉴 제거 방법
Disable Elements 애드온을 사용하여 헤더 및 메뉴를 제거하는 방법
GeneratePress 유료 버전인 GP Premium이 설치되어 있다면 Disable Elements 모듈 기능을 사용하여 특정 요소를 개별 페이지/글이나 전체 사이트에서 비활성화할 수 있습니다.
모양 » GeneratePress » Modules 섹션에서 Disable Elements 모듈을 활성화할 수 있습니다.
Activate 버튼을 누르면 모듈이 활성화되면서 Activate 버튼은 Deactivate로 바뀌게 됩니다. 즉, 위의 그림에서 Deactivate 버튼이 있는 모듈들이 현재 활성 상태입니다.
전체 사이트에서 헤더나 메뉴, 푸터 등의 요소를 제거하고 싶은 경우 모양 » Elements를 클릭하고 Add New Element 버튼을 클릭합니다.
Choose Element Type(엘리먼트 타입 선택) 팝업이 표시되면 Layout을 선택합니다.
Add New Layout (새 레이아웃 추가) 페이지가 표시됩니다.
Sidebar 탭에서 사이드바 레이아웃을 지정할 수 있습니다. Content (no sidebars)를 선택하면 사이드바가 없는 레이아웃이 됩니다.
Disable Elements (엘리멘터 비활성화) 탭을 선택합니다.
여기에서 제거할 요소들을 선택할 수 있습니다.
예를 들어, Site Header, Mobile Header, Top Bar, Primary Navigation, Secondary Navigation 등의 요소를 선택하면 헤더와 메뉴 부분이 완전히 제거됩니다.
Display Rules (표시 규칙) 탭을 선택하여 이 레이아웃 엘리먼트가 적용될 영역을 지정합니다.
Location에서 Entire Site를 선택하면 사이트 전체에 적용됩니다. 전체 블로그 글이나 특정 카테고리 글, 아카이브 페이지(카테고리, 태그 페이지 등), 전면 페이지(홈)에만 적용되도록 규칙을 설정할 수 있습니다. 또한, Exclude에서 제외할 페이지나 카테고리, 글 등을 지정하는 것도 가능합니다.
공개 버튼을 누르면 헤더와 푸터가 사이트에서 제거될 것입니다.
CSS를 사용하여 숨기기
CSS(캐스케이딩 스타일 시트)를 사용하여 헤더와 메뉴 부분을 숨기는 것도 가능합니다. 예를 들어, 다음과 같은 코드를 모양 » 사용자 정의 » 추가 CSS에 추가하여 헤더가 사라지는지 체크해볼 수 있습니다.
.site-header {display:none}변경 사항이 적용되지 않으면 캐시 플러그인의 캐시와 브라우저 캐시를 삭제하면 적용될 수도 있습니다.
만약 위의 코드가 작동하지 않는다면 다음 코드로도 테스트해 보시기 바랍니다.
#site-navigation {display:none}CSS를 사용하면 실제로는 해당 요소들이 로드되지만 브라우저에서만 표시되지 않도록 숨겨집니다. 기본적인 CSS를 익히면 이런 작업에서 많은 도움이 될 것입니다.
메뉴를 숨기는 것이 효과가 있을까?
헤더나 메뉴를 숨긴다고 해서 해당 블로그의 다른 글들을 찾지 못하는 것은 아닙니다. 가령, 해당 사이트의 사이트맵을 체크해보면 일반적으로 최근 발행된 10개 글들을 확인할 수 있습니다. 이외에도 구글에서 site:사이트주소로 검색하여 최근 발행한 포스트들을 체크하는 것이 가능합니다.
그러므로 메뉴를 숨기는 것이 그리 효과적이지 않을 수 있습니다. (다만, 이런 방법을 모르는 사용자들은 해당 블로그의 다른 글들을 찾지 못하겠죠?😄)
메뉴를 표시하면 SEO에도 도움이 될 수 있습니다. 그러므로 여러 가지를 고려하여 헤더/메뉴를 숨길지 여부를 결정하시기 바라빈다.
엘리멘터 등의 페이지 빌더를 사용하여 랜딩 페이지를 만들 때에는 헤더와 메뉴를 표시하지 않는 경우가 많습니다.
댓글 남기기