728x90
티스토리 커스텀 스킨을 적용해서인지
구글링하여 나오는 방법으로 코드블록 폰트 변경이 안됩니다...
그래서 찾은 간단한 방법입니다!
스킨 편집에서 HTML과 CSS 파일에 간단한 코드만을 추가하여 코드블록 폰트를 변경할 수 있습니다
Google Fonts
기본 폰트 이외에 다른 폰트를 구글 폰트에서 골랐습니다!
Google Fonts
Making the web more beautiful, fast, and open through great typography
fonts.google.com
Google Fonts 코드 복사
1. Google Fonts에서 폰트 선택
- 저는 Roboto Mono를 선택했습니다!
2. 원하는 굵기, 타입의 스타일 선택
3. link에서 첫번째 코드를 HTML, 두번째 코드를 CSS코드에 넣을 겁니다.
Tistory에 Fonts 설정 코드 넣기
1. 코드블록을 우클릭하여 '검사' 선택
2. Styles을 보고 css파일에서 어디를 수정해야할지 파악한다.
- 저는 pre code라는 키워드로 수정 위치를 검색했습니다.
- HTML 파일에서의 위치는 찾을 필요가 없습니다.
3. 블로그관리 > 꾸미기 > 스킨편집 >HTML 편집
4. 구글폰트에서 복사한 코드 붙여넣기
1) HTML문서의 <HEAD> 안 아무데나 복사한 다음과 같은 코드 붙여넣기
<link rel="preconnect" href="https://fonts.gstatic.com">
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap" rel="stylesheet">
2) CSS 파일를 누르고 Ctrl + F로 2. 에서의 위치를 검색하여 코드 붙여넣기
5. 적용하면 끝!
- 다음과 같이 예쁜 폰트의 코드를 볼 수 있습니다
728x90