워드프레스 웹폰트 나눔고딕 적용하기
홈페이지에서 타이포그래픽 또는 원하는 형태의 문자를 출력하기 위해 많은 노력을 하는것이 사실입니다. 웹이라는 다양한 브라우저 환경에서 디자이너가 원하는 형태의 문자를 출력하기 위해 이미지를 사용하거나, 웹폰트를 사용해 화면에 출력하는데 있어 웹폰트의 경우 변환된 내용이 많이 없어 사용에 제약이 많습니다.
국내에서 많이 사용하는 웹폰트중 나눔고딕 사용법에 대해 알아보도록 하겠습니다.
https://fonts.google.com/?query=nanum
빨간색 박스에서 Regular 을 클릭하시면 3가지의 폰트 굵기가 표기 됩니다. 한가지씩 선택하면서 + 표기를 누르시면 샘플에 담겨집니다.
위 코드를 복사하여 워드프레스 테마내에 header.php 메타태그 하단에 붙여넣기를 합니다. 그리고 font-family 의 경우는 테마내에 style.css 파일에 등록을 합니다.
워드프레스 사이트 전체에 대해 나눔고딕을 설정할때는 아래와 같이 style.css 파일 가장 상단에 위치하도록 합니다.
* {
font-family: 'Nanum Gothic', sans-serif;
}
Header 태그에만 볼드 형태의 폰트를 적용하기 위해서는 아래 처럼 합니다.
h1,h2,h3,h4,h5,h6 {
font-family: 'Nanum Gothic', sans-serif;
font-weight:700;
}
