블로그 폰트 '마포꽃섬체' 적용했어요~ (+무료 폰트 사이트 추천, 웹폰트 블로그에 적용방법)

블로그 폰트 '마포꽃섬체' 적용했어요~ (+무료 폰트 사이트 추천, 웹폰트 블로그에 적용방법)

 

얼마전 제 블로그의 폰트를 변경했습니다.

상업용 무료폰트인 ‘마포꽃섬체’ 로 적용해 보았는데요,

현재 사용중인 스킨이 티스토리에서 기본으로 제공되는 스킨이다보니 살짝 밋밋한 느낌도 있고 해서

폰트를 이용해 약간의 차별화를 시켜보자! 하는 생각에 폰트를 변경해 보았습니다. 🙂

제가 이번에 사용한 마포꽃섬체는 저도 무료 폰트 사이트를 통해 알게 되었는데,

서울시 마포구에서 제공하는 상업용 무료폰트이더라구요.

뭔가 정갈한 느낌이 들어서 개인적으로는 마음에 쏙 듭니다.ㅎㅎ

그럼 지금부터 제가 이번에 이용했던 무료 서체 다운이 가능한 무료 폰트 사이트에 대한 소개와 함께

웹폰트를 블로그에 적용시켰던 과정들을 함께 공유해보도록 할게요.

 

 

 

 

 

 

 

# 무료 서체 다운 가능한 무료 폰트 사이트 추천, ‘눈누’

 

저도 이것저것 검색을 하다가 찾게 된 무료 폰트 사이트인데요,

상업용으로 사용이 가능한 한글 폰트들을 한 페이지에 모아서 보여주는 곳입니다.

 

▼▼

 

noonnu.cc/

 

무료 서체 다운도 가능하고, 웹폰트로 사용 가능한 코드를 제공해주기도 합니다.

예쁜 글씨체들이 많고 보기도 편하고 깔끔하게 되어 있어서 저도 무료 폰트 사이트는 여기로 정착하게 될 것 같아요.ㅋㅋ

 

 

 

‘눈누’ 사이트에 접속한 모습입니다. 여러가지 폰트들이 보기 좋게 나열되어 있어요.

 

 

 

 

 

 

 

 

 

나열된 폰트를 이용해 바로 타이핑을 해 볼 수도 있고,

폰트 이름을 클릭하면 해당 폰트로 직접 텍스트를 입력해 볼 수 있는 페이지가 열리는데요,

여기서 무료 서체 다운이 가능할 뿐 아니라 웹폰트로 사용할 수 있는 코드도 확인할 수 있습니다.

 

 

 

 

 

 

 

 

 

해당 폰트의 라이센스(사용 범위)에 대해서도 함께 정리가 되어 있으니

포토샵 무료 폰트를 찾고 계셨던 분들이나 무료 서체 다운이 필요하신 분들한테 참 유용할듯 하네요.^^

 

 

 

 

 

 

 

 

# 웹폰트 블로그에 적용하는 방법

보통 폰트 파일을 티스토리 서버에 직접 이용하거나,

구글 폰트 등 폰트가 업로드되어 있는 곳에서 코드를 복사해 스킨에 넣어주는 방법 두 가지를 많이 이용하시는데요,

전 위 ‘눈누’ 사이트에서 제공하는 ‘웹폰트로 사용’ 코드를 복사해서 붙여넣는 방식을 이용했어요.

지금부터 제가 사용했던 방식을 공유해 볼게요.
(100% 정확한 방법인지 여부는 저도 모릅니다.ㅋㅋ 일단 전 이렇게 해서 성공했어요~)

먼저 눈누 사이트에서 원하는 폰트를 고른 뒤, 폰트 이름을 눌러 해당 폰트 페이지로 이동합니다.


오른쪽에 있는 ‘웹폰트로 사용’ 부분에서 ‘복사하기’를 눌러 코드를 복사해 주세요.

 

 

 

 

 

 

 

 

 

티스토리 관리자 화면에서 ‘꾸미기’ - ‘스킨편집’ 으로 들어간 뒤,

 

 

 

 

 

 

 

 

 

오른편의 ‘html 편집’ 을 눌러줍니다.

 

 

 

 

 

 

 

 

 

오른편 상단의 ‘css’ 를 클릭한 뒤,

가장 위에 방금 복사했던 코드를 붙여넣기 해 주세요.

 

 

코드를 살펴보면 font-family 라고 되어 있는 부분 옆에 ‘MapoFlowerIsland’라고 되어 있는게 폰트 이름인데요,
요 부분을 다시 복사합니다.

 

 

 

 

 

 

 

그리고 ctrl+f를 눌러 font-family라고 검색한 뒤,
나오는 곳마다 폰트 이름인 ‘MapoFlowerIsland’를 전부 추가해 주었어요.

 

 

 

 

 

 

 

 

 

ctrl+g를 누르면 계속검색이 가능하니 눌러가면서 추가하면 편합니다.ㅎㅎ

(사실 전부 추가하는건지는 정확하지 않은데.. 일단 이렇게 하니까 제대로 적용이 되더라구요!!)

 

 

 

 

마지막으로 ‘적용’ 버튼을 눌러주면 끝입니다.



블로그 폰트만 바뀌어도 분위기가 확 달라지는 느낌이네요. 🙂

무료 서체 다운이 가능한 무료 폰트 사이트 ‘눈누’에 다시한번 감사드립니다~ㅎㅎ


저도 한때는 포토샵을 배우겠다고 책도 사서 공부도 하고 그랬는데..

그때마다 예쁜 포토샵 무료 폰트를 찾아 이곳저곳 헤맸던 기억이 나네요.

요즘에는 정말 예쁘고 퀄리티 좋은 폰트들이 무료로 배포되는 경우가 많아서 참 좋은 것 같아요!

저처럼 예쁜 포토샵 무료 폰트를 찾아 헤매셨던 분이나,

안심하고 사용할 수 있는 상업용 무료 폰트를 찾고 계셨던 분들은 제가 소개해드린 사이트 한번 방문해보셔도 좋을 것 같습니다.^^