눈누 사이트 폰트 적용 법: 티스토리에서 간단하게 설정하는 방법

눈누는 무료 한글 폰트를 제공하는 사이트로, 티스토리에 개성 있는 폰트를 적용하고 싶은 사용자들에게 유용한 도구입니다. 티스토리에서는 기본적으로 제공하는 폰트 외에도 외부 폰트를 불러와 사용할 수 있습니다. 이번 글에서는 눈누 사이트에서 폰트를 다운받아 티스토리에 적용하는 방법을 자세히 설명하겠습니다.

눈누 사이트에서 폰트 다운로드하기

눈누 사이트 접속: 눈누(nununi.com)에 접속합니다.
사용할 폰트 검색: 마음에 드는 폰트를 선택합니다.
폰트 상세페이지 확인: 선택한 폰트가 무료이며 상업적으로 사용 가능한지 확인합니다.
CSS 코드 복사: 폰트 페이지에 제공된 CSS 링크를 복사합니다.
- 예시:
```
@import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic&display=swap');
```

티스토리에 눈누 폰트 적용하기

티스토리에서 폰트를 적용하는 방법은 두 가지가 있습니다. HTML/CSS를 직접 수정하는 방법과 스킨 편집을 활용하는 방법입니다.

1. CSS 코드 추가하는 방법

티스토리 관리자 페이지 접속: 티스토리에 로그인 후, 블로그의 관리 페이지로 이동합니다.
스킨 편집 선택: 스킨 > HTML/CSS 편집으로 이동합니다.
CSS 파일 수정: <style> 태그 안에 눈누에서 제공한 @import 코드를 추가합니다.
폰트 적용: 원하는 요소에 font-family 속성을 추가합니다.
- 예제:
- @import url('https://fonts.googleapis.com/css2?family=Nanum+Gothic&display=swap'); body { font-family: 'Nanum Gothic', sans-serif; }
저장 및 반영: 변경 사항을 저장하고 블로그에서 적용되었는지 확인합니다.

2. HTML 태그 내 적용하기

글 작성 페이지 이동: 티스토리에서 새 글을 작성하거나 기존 글을 수정합니다.
HTML 편집 모드 사용: 글쓰기 화면에서 HTML 편집 모드로 전환합니다.

폰트 스타일 직접 적용: HTML 태그에 style 속성을 추가하여 적용합니다.

예제:

<p style="font-family: 'Nanum Gothic', sans-serif;">이 글은 눈누에서 가져온 폰트로 작성되었습니다.</p>

글 저장 및 확인: 변경 사항을 저장하고 블로그에서 폰트가 적용되었는지 확인합니다.

폰트 적용이 안될 때 체크할 사항

폰트 URL이 정확한지 확인: 눈누에서 제공하는 @import 코드가 올바르게 입력되었는지 확인합니다.
브라우저 캐시 삭제: 변경 후에도 폰트가 반영되지 않으면 브라우저 캐시를 삭제하고 다시 확인합니다.
CSS 적용 우선순위 문제: 다른 CSS 코드가 우선 적용될 경우 !important를 사용하여 강제 적용할 수 있습니다.
```
body {
  font-family: 'Nanum Gothic', sans-serif !important;
}
```

4. 글 저장 및 확인: 변경 사항을 저장하고 블로그에서 폰트가 적용되었는지 확인합니다.

마무리

눈누에서 제공하는 무료 폰트를 티스토리에 적용하면 블로그의 개성을 더욱 살릴 수 있습니다. @import 방식으로 간단하게 폰트를 적용할 수 있으며, CSS를 활용하여 다양한 요소에 적용이 가능합니다. 원하는 폰트를 활용해 더욱 멋진 블로그를 만들어보세요!

Money Brain 보관소