{ 태그에 닫는 태그가 없습니다. error :295 고객지원센터 웹사이트에 나눔고딕 폰트 적용하기

매뉴얼

기타 웹사이트에 나눔고딕 폰트 적용하기

웹사이트에 윈도우에서 지원하는 기본폰트 (굴림,돋움,바탕 등....)가 아닌 다른 폰트를 적용하고 싶은 경우, 해당하는 폰트파일을 업로드하여 추가해야 합니다.

 

다음을 따라하시면 간단히 나눔고딕 폰트를 적용하실 수 있습니다.

 

 

1. 첨부된 파일을 다운받아서 압축을 해제합니다.

 

 

2. FTP에 접속하여 'font' 폴더를 생성 후, 해당 폴더에 파일을 업로드 합니다.

 

 

 

3. 사이트에 적용되어있는 css 최상단에 다음을 추가 합니다.

 


/* Nanum Gothic Font */
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 400;
  src: url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Regular.eot');
  src: url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Regular.eot?#iefix') format('embedded-opentype'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Regular.woff2') format('woff2'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Regular.woff') format('woff'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Regular.ttf') format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 700;
  src: url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Bold.eot');
  src: url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Bold.eot?#iefix') format('embedded-opentype'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Bold.woff2') format('woff2'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Bold.woff') format('woff'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-Bold.ttf') format('truetype');
}
@font-face {
  font-family: 'Nanum Gothic';
  font-style: normal;
  font-weight: 800;
  src: url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-ExtraBold.eot');
  src: url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-ExtraBold.eot?#iefix') format('embedded-opentype'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-ExtraBold.woff2') format('woff2'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-ExtraBold.woff') format('woff'),
       url('/img_up/shop_pds/사이트아이디/design/font/NanumGothic-ExtraBold.ttf') format('truetype');
}
body {font-family:'Nanum Gothic';}

 

예시에는 body 에 font-fmily 를 적용하여 사이트 전체에 나눔고딕이 적용되었습니다.

특정 클래스에만 나눔고딕 폰트를 적용하고 싶으시면, 다음과 같이 추가해주세요.

 

 .class명 {font-family:'Nanum Gothic';} 
게시글 공유 URL복사 cyworld
댓글작성

열기 닫기

댓글작성
top