워드프레스 아카이브(카테고리, 태그 등) 페이지 헤더 숨기거나 높이 조절하기

워드프레스의 아카이브(author, date, category, tag) 주소로 접속하면 마주할 수 있는 두툼한 아카이브 페이지 헤더. (예 : https://~~~~~.com/category/ㅇㅇㅇ/)

사실 아카이브는 개인적으로 사용할 일이 많지 않다. 특히 블로그에서는 저자가 한 명인 경우가 대부분일 테니 author archive를 사용할 일이 없고, date archive도 쓸 일이 없다. 그나마 사용할까 싶은 게 category나 tag 정도. 사실 거의 안 쓰다 보니 신경을 안 쓰고 있었는데 접속해 보면 나오는 커다란 헤더가 참 마음에 안 든다.

리디렉션을 시키는 등 아예 사용하지 않는 방법도 있겠지만 일단 접속 가능한 기본 환경에서 헤더의 높이를 줄여 보기 수월하게 만들거나 헤더를 숨겨버릴 수 있다.


아래 CSS에서는 모든 아카이브 항목(author, date, category, tag)에 적용하기 위해 .archive를 사용했다. 개별 아카이브 항목에서만 적용하려면 .archive 대신 .category나 .tag 등으로 바꾸어 적용하면 된다.

archive
- author archive
- date archive
- category archive
- tag archive

  • 적용한 테마 : Generatepress
  • CSS 수정 : 외모 > 사용자 정의하기 > 추가 CSS

1. 아카이브 페이지 헤더 높이 조절하기

.archive  .page-header {
padding-top: 5px;
padding-bottom: 5px;
}

2. 아카이브 페이지 헤더 숨기기

.archive .page-header {
display: none;
}

3. 결과 (적용전, 헤더 높이 줄이기, 헤더 숨기기)

original archive page header
기존 아카이브 페이지 헤더
adjust height of archive page header
헤더 높이 줄이기
hide archive page header
헤더 숨기기

카테고리의 다른 글

  1. apple-touch-icon.png 404 에러 탈출기 (feat. precomposed, 120x120, favicon)
  2. HTML 앵커 <a> 태그 속성으로 alt는 없었구나
  3. 구글 애널리틱스 내부 트래픽 설정하기 (분석 제외 IP 설정)
  4. 구글 애널리틱스와 태그 매니저 페이지뷰 중복측정 방지하기
  5. 구글 애드센스 클릭은 있지만 수익은 없는($0.00) 원인

댓글 남기기