[How To] Jekyll Blog font 바꾸기

• google web font import

  구글 웹 폰트를 적용하면 다른 사람의 컴퓨터에서도 내가 원하는 폰트를 적용시킬 수 있다. 폰트도 디자인 요소중 하나이기 때문에

  가독성이 좋은 폰트로 변경해보자. 구글 웹 폰트로 접속해서 원하는 폰트를 골라보자.

  아직 한글폰트는 많이 없지만 그 중에서 나눔고딕 폰트를 적용해 보겠다.

  Import 링크를 복사한 후 /assets/css/main.css 파일을 열어 Import를 해주자.

  ---
  # Only the main Sass file needs front matter (the dashes are enough)
  ---
    
  @charset "utf-8";
  @import url('https://fonts.googleapis.com/css?family=Nanum+Gothic');
  @import "minimal-mistakes/skins/air"; // skin
  @import "minimal-mistakes"; // main partials
  

  위 링크를 통해 나눔고딕 폰트를 다운받아 오는 것이다. 그래서 나눔고딕이 없는 PC에서도 전부 같은 폰트로 볼 수 있다.

• font 적용

  Import를 해주었으니 /_sass/ minimal-mistakes/ _variables.scss 파일을 열어 적용을 해주도록 하자.

  /* system typefaces */
  $serif: Georgia, Times, serif !default; // 폰트변경 위치
  $sans-serif: /*-apple-system, BlinkMacSystemFont, */"Nanum Gothic", "Malgun Gothic", "맑은 고딕", "Roboto", "Segoe UI",
    "Helvetica Neue", "Lucida Grande", Arial, sans-serif !default;
  $monospace: Monaco, Consolas, "Lucida Console", monospace !default;
  

  3번째 줄을 보면 apple system에 주석을 달아놓은 것을 볼 수 있다.

  이 코드는 apple PC를 사용하는 경우 시스템 폰트를 사용 하라는 뜻이다.

  하지만 나는 모든 PC에 나눔 고딕 폰트를 적용 할 것 이기때문에 주석처리를 해두었다.

  그리고 뒤에 “Nanum Gothic” 을 추가해주면 된다. 만약 나눔 고딕 폰트가 적용이 안된다면

  맑은 고딕으로 적용이 된다. 맑은 고딕은 왠만한 PC에 기본 폰트로 있기 때문에 따로 Import 할 필요가 없다.

  나눔 고딕뿐만 아니라 모든 구글 웹 폰트 적용 방식은 동일하니 각자 마음에 드는 폰트로 적용을 해보자 !