구글 블로그에서 글꼴과 줄 간격을 일관되게 설정하는 방법

구글 블로그에서 글꼴과 줄 간격을 통일하는 방법

구글 블로그를 운영하다 보면 글마다 글씨 크기나 간격이 조금씩 달라 보일 때가 있습니다. 이는 글 작성 시마다 직접 지정한 서식이 HTML 코드로 중첩되기 때문입니다.

또한 템플릿 자체의 기본 서식과 글쓰기 화면에서 수동으로 지정한 서식이 동시에 적용될 경우, 일관성 없는 글꼴, 크기, 줄 간격이 발생하게 됩니다.


1. 템플릿 전체에 기본 스타일을 설정하는 방법

관리자 페이지의 ‘테마 → HTML 편집’으로 이동합니다. HTML 코드에서 <head> 태그를 찾아 아래와 같은 스타일 코드를 추가합니다.

<style>
.post-body {
    font-family: "Noto Sans KR", sans-serif;
    font-size: 17px;
    line-height: 1.8;
    color: #333333;
}
</style>

2. 개별 글에 직접 스타일을 지정하는 방법

작성 화면에서 HTML 모드로 전환한 뒤, 글 본문 시작 부분에 아래 스타일을 삽입합니다.

<style>
.post-body {
    font-family: "Noto Sans KR", sans-serif;
    font-size: 16px;
    line-height: 1.7;
    color: #444444;
}
</style>

3. 줄간격이 맞지 않는 원인과 수정 방법

기존 서식을 초기화한 뒤, 다음과 같이 본문 전체를 감싸주는 방식이 유용합니다.

<div style="font-size:17px; line-height:1.8; font-family:'Noto Sans KR'; color:#333;">
    본문 내용 전체
</div>

4. 글꼴 충돌을 방지하는 방법

여러 대체 글꼴을 지정해 운영체제별 차이를 줄입니다.

font-family: "Noto Sans KR", "Malgun Gothic", sans-serif;

5. 글자 크기와 줄 간격의 기준 예시

항목권장 값
글자 크기16~18px
줄 간격1.6~1.8
글꼴Noto Sans KR, 맑은 고딕

댓글 쓰기