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

워드프레스의 아카이브(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. 티스토리 본문 리스트 목록(ul li)의 간격 조정하기 (square 스킨)
  2. 티스토리에서 유니버설 애널리틱스(UA) 속성을 구글 애널리틱스 4(GA4)로 변경하기
  3. 구글 애널리틱스 내부 트래픽 설정하기 (분석 제외 IP 설정)
  4. 티스토리 첨부파일 이름이 잘릴 때 해결방법 (스퀘어 스킨)
  5. 워드프레스 5개월간 살아남은 플러그인 (feat. 클라우드웨이즈)

댓글 남기기