구글 블로그 블로거(blogger) 가독성 좋은 나눔고딕 폰트 적용하기 - 티스토리 탈출

티스토리를 탈출 하면서 구글 블로거(blogger)를 시작하기에 설정할 것들이 많다. 

1. 구글 블로거(blogger) 또는 블로그스팟(blogspot)에 도메인 연결하기

2. 가독성 좋은 폰트로 설정하기

3. 단락을 구분 지어주고, 가독성이 좋게 하는 제목 디자인 꾸미기

4.  구글, 다음, 네이버 등 웹마스터 등록하기

오늘은 설정 두 번째 가독성이 좋은 무료 폰트를 구글 블로그에 적용하여 본다. 

구글 블로그, 블로거(blogger)에 나눔고딕 폰트 적용하기 


나눔고딕은 무료 폰트이며, 가독성이 좋아 블로그에 많이 사용되어 지고 있다.
설정을 위해 두 번만 복사, 붙여넣기 하면 되니, 매우 간단하다. 

1. HTML 편집란에 나눔고딕 소스코드를 입력한다.

구글 블로그에 로그인한다. 사이드 바 - 테마 - 맞춤설정 옆 화살표 - HTML 편집 란에 들어간다.
HTML 편집란의 헤더<Head>와 헤더</head> 사이에 아래 소스코드를 복사, 붙여넣기 한다. 


<!-- 나눔고딕 웹폰트 시작 -->
<link href='http://fonts.googleapis.com/earlyaccess/nanumgothic.css' rel='stylesheet'/>
<!-- 나눔고딕 웹폰트  -->

2. CSS 추가 란에 나눔고딕 소스코드를 입력한다.

사이드 바 - 테마 - 맞춤설정 - 고급 - CSS추가 
CSS 추가 란에 아래 소스코드를 복사, 붙여넣기 한다.

@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);@import url(//fonts.googleapis.com/earlyaccess/nanumgothic.css);body, h1, h2, h3, h4, a, div, input, p, span, td, label, select, textarea, iframe {
    font-family: 'Nanum Gothic';
}
.post-body {
    font-family: 'Nanum Gothic';
}
.Header .description, .Header h1 {
    font-family: 'Nanum Gothic';
}
.main-inner .widget h2.date-header span {
    font-family: 'Nanum Gothic';
}
h3.post-title {
    font-family: 'Nanum Gothic';
}
h3.post-title a {
    font-family: 'Nanum Gothic';
}
.sidebar .widget {
    font-family: 'Nanum Gothic';
}

설정이 완료되면 구글 블로거(blogger)에 나눔고딕 폰트가 적용된 것을 볼 수 있다. 

구글 블로그, 블로거(blogger)에 소스코드 이쁘게 적는 법 알아보기.




댓글 없음:

댓글 쓰기

관련 글