그간 블로거를 정비하면서, 모바일 환경에서도 나눔고딕을 매끄럽게 적용하는 방법을 검색해왔지만..
무엇보다 더 간단하고 미려하게 바꿀 수 있는 방법을 찾게 되서 여기서도 알려주고자 합니다.
먼저, 구글 폰트 사이트에서 원하는 폰트를 찾습니다. 아마 대부분이 한글이 미려하게 보이는 나눔고딕을 찾고자 하실테니, 이 강좌에서는 나눔고딕을 사용하겠습니다.
구글 폰트 링크 : https://fonts.google.com/
원하는 폰트를 찾아 선택하셨다면, 이 폰트를 블로거로 불러올 수 있는 link 태그를 제공합니다.
먼저, 구글 폰트 사이트에서 원하는 폰트를 찾습니다. 아마 대부분이 한글이 미려하게 보이는 나눔고딕을 찾고자 하실테니, 이 강좌에서는 나눔고딕을 사용하겠습니다.
구글 폰트 링크 : https://fonts.google.com/
원하는 폰트를 찾아 선택하셨다면, 이 폰트를 블로거로 불러올 수 있는 link 태그를 제공합니다.
이제, blogger에서 좌측 '테마' 페이지에 들어간 후, 'HTML 편집' 페이지로 들어가면 소스코드가 잔뜩 나열되어 있는 것을 보실 수 있습니다,
※ 혹시 모를 오류를 대비해서, 블로거의 테마 페이지의 우측 상단의 '백업/복원' 기능을 이용하여 먼저 테마 소스코드를 백업하시는 것을 권장합니다.
※ 혹시 모를 오류를 대비해서, 블로거의 테마 페이지의 우측 상단의 '백업/복원' 기능을 이용하여 먼저 테마 소스코드를 백업하시는 것을 권장합니다.
거기서 ctrl + F(Mac인 경우 command + F) 를 누른 후 <head> 태그를 찾은 후, <head> 태그 바로 밑에 구글 폰트에서 제공하는 link 태그를 붙여넣습니다.
<link href="https://fonts.googleapis.com/css?family=Nanum+Gothic" rel='stylesheet'/>
※ 이 부분에서 많은 이들이 실수하시는데, 반드시 link 태그의 'stylesheet' 뒤에 붉은색 강조를 해놓은 슬래쉬 (/) 기호를 꼭 넣어야합니다. 안하면 100% 오류가 발생합니다.
이제, 주황색 '테마 저장'을 누르고 저장합니다. 여기까지는 웹폰트를 그저 블로그로 불러오는 것 뿐, 그것만 해놓고는 블로그에 적용이 되지 않습니다.
이제, 블로그에 적용하는 방법 중에서 제가 사용했던 방법을 알려드릴텐데요,
Blogger의 '테마' 창의 주황색 '맞춤 설정'으로 들어간 후, '고급' 탭에서 웹폰트로 바꾸고 싶은 부분을, 블로그에서 사용되지 않은 다른 폰트로 적용합니다. 되도록이면 개인적으로 기억하기 쉬운 이름으로 적용해두는 것을 권장합니다.
Blogger의 '테마' 창의 주황색 '맞춤 설정'으로 들어간 후, '고급' 탭에서 웹폰트로 바꾸고 싶은 부분을, 블로그에서 사용되지 않은 다른 폰트로 적용합니다. 되도록이면 개인적으로 기억하기 쉬운 이름으로 적용해두는 것을 권장합니다.
저는 이 강좌에서 Dancing Script체를 사용하였습니다.
변경사항을 '블로그에 적용' 버튼을 눌러 적용 후, 다시 Blogger의 '테마' 창의 'HTML 편집' 창으로 들어가서, 바꾸고 싶은 부분의 폰트의 이름을 검색한 후, 바꾸고자 하는 폰트로 변경합니다.
Dancing Script (바꾸고 싶은 부분의 폰트) => 'Nanum Gothic', sans-serif; (바꾸고자 하는 폰트)
이제, '테마 미리보기' 를 누르고 잘 적용되었다 싶으면 주황색 '테마 저장'을 누르시면 됩니다.
그럼 PC 환경 뿐만 아니라 모바일 환경에서도 미려하게 나눔고딕으로 적용되신 것을 볼 수 있습니다.
댓글
댓글 쓰기