Reduce Post Spacing with Simple CSS in WordPress

워드프레스 블로그에서 **포스트 간 간격(posting spacing)**을 줄이려면, 다음의 CSS 코드를 적용하면 됩니다. 현재 사용하는 Astra 테마와 blog-layout-5 구조를 기준으로 최적화했습니다. 각 website 마다 다릅니다. chatgpt에 website html을 넣고 분석하면, 바로 조정할 수 있습니다.


방법: 포스트 간 간격 줄이기 (margin-bottom 조절)

CSS 코드

css복사편집.ast-article-post {
  margin-bottom: 1em !important; /* 기본값은 약 2em 또는 3em */
}

.ast-separate-container .ast-article-post {
  padding-bottom: 1em !important;
  padding-top: 1em !important;
}

더 줄이고 싶으면 1em0.5em 또는 0.2em으로 변경해보세요.


적용 방법

  1. 워드프레스 관리자 > 외모 > 사용자 정의 > 추가 CSS
  2. 위 CSS 코드를 붙여넣고 “게시” 클릭

확인 포인트

  • class="ast-article-post"는 각 포스트 블록을 감싸는 요소입니다.
  • 간격을 줄이면 목록형 블로그 페이지가 더 컴팩트하게 보입니다.

Leave a Comment

Your email address will not be published. Required fields are marked *

Scroll to Top