본문 바로가기

고도몰 나눔고딕 적용하기

by dig it 2014. 7. 22.

일반적으로 웹상에서 보여지는 폰트는 돋움, 굴림, 바탕체 정도입니다.

 

이쁘고 귀여운 웹폰트를 사용하면 훨씬 더 샵분위기가 달라집니다.

웹폰트를 보유하거나 구매하셨다면, 아래와 같이 활용해보세요.

 

1. 먼저 갖고있는 웹폰트를 온라인상에 올려줘야 합니다.

e나무 독립형은 FTP를 이용해서 원하는 폴더에 올리세요.

관리자모드에 있는 'webFTP이미지관리'는 이미지파일만 등록이 가능하므로 업로드가 안됩니다.

꼭 일반 FTP프로그램을 이용해서 업로드하세요.

무료형은 FTP 사용이 불가하며, 임대형의 FTP에서는 지정된 형식의 파일 외에는 업로드가 불가하므로

다른 온라인 계정이 있다면 그곳을 이용하세요.

 

[e나무시즌1] 해당파일 : 관리자페이지 접속 -> 상단의 디자인관리 -> 왼쪽의 스타일시트관리 파일을 선택

하시고 소스 맨위쪽에 아래소스를 복사해서 넣으세요 그리고 폰트명과 폰트경로를 입력하세요.

폰트경로란 위 1번에서 업로드한 경로를 말합니다.

 

[e나무시즌2] 해당파일

관리자페이지 접속 -> 상단의 디자인관리-> 왼쪽의 기본관리 -> 스타일시트 파일을 선택하시고 소스맨위쪽에 아래소스를 복사해서 넣으세요 그리고 폰트명과 폰트경로를 입력하세요 폰트경로란

위 1번에서 업로드한 경로를 말합니다.

 

@font-face {font-family: 폰트명; src:url(폰트경로);}
a:link {font-family: 폰트명;font-size: 9pt;}
a:visited {font-family: 폰트명;font-size: 9pt;}
a:hover {font-family: 폰트명;font-size: 9pt;}
a:acvite {font-family: 폰트명;font-size: 9pt;}
p,br,body,td,form,div,form,center,option,select,textarea,input {font-family: 폰트명;font-size: 9pt;}

 

 

예를 들어 'NanumGothic' 폰트를 사용한다면, 아래와 같이

 

@font-face {font-family: NanumGothic; src:url(http://abcd.godo.co.kr/data/NanumGothic.ttf);}
a:link {font-family: NanumGothic;font-size: 9pt;}
a:visited {font-family: NanumGothic;font-size: 9pt;}
a:hover {font-family: NanumGothic;font-size: 9pt;}
a:acvite {font-family: NanumGothic;font-size: 9pt;}
p,br,body,td,form,div,form,center,option,select,textarea,input {font-family: NanumGothic;font-size: 9pt;}

 

 

그리고 저장하면,

내 쇼핑몰의 폰트가 나눔고딕 서체로 바뀌어져 있음을 보실 수 있습니다.

 

** 주의하세요 **

반드시 폰트가 온라인상에 업로드 되어 있어야 하고, 그 경로가 올바르게 입력되어야 합니다.

업로드가 안되거나, 경로가 틀리다면 운영자화면에서는 제대로 나오지만, 다른 사용자는 해당 폰트로 보이지 않습니다.

다른 PC에서 제대로 폰트가 보이는지 꼭 확인해보세요.





반응형

댓글

최신글 전체

이미지
제목
글쓴이
등록일