현재 위치
  1. 게시판
  2. 유용한 웹 팁

유용한 웹 팁

쇼핑몰 운영에 도움이 되는 정보들입니다.

게시판 상세
제목 눈누 웹폰트 사용방법
작성자 별모아디자인 (ip:)

https://noonnu.cc/


위의 사이트에 접속 후 첫 화면의 좌측 상단에

텍스트를 입력하면

각 폰트마다 해당 문구로 보여집니다.

마음에 드는 폰트를 클릭하시면

아래처럼 해당 폰트의 소스가 나옵니다.

아래 소스는 예시입니다.



@font-face {

    font-family: 'paybooc-Bold';

    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_20-07@1.0/paybooc-Bold.woff') format('woff');

    font-weight: normal;

    font-style: normal;

}



소스를 복사하여 쇼핑몰 관리자 페이지의 디자인관리 > 디자인 보관함 > 수정 버튼을 클릭하여

스마트디자인 편집창에서 layout.css 파일 상단에 소스를 붙여넣어줍니다.

이렇게하면 쇼핑몰에 웹폰트가 설치가 된 것입니다.



그 다음, 구체적으로 어느 부분에 적용할지 원하시는 부분에 소스를 추가해주면 됩니다.

만약 메인화면 상품진열 타이틀 영역에 적용하고싶으시면

ec-base-product.css 파일에서 위의 소스 중 빨간색 부분만 복사하여 아래 소스에 추가해주시면 됩니다.



소스 추가 전

.ec-base-product .title h2 { font-weight:normal; font-size:20px; color:#2e2e2e; text-align:center; }



소스 추가 후 

.ec-base-product .title h2 { font-weight:normal; font-size:20px; color:#2e2e2e; text-align:center;  

font-family: 'paybooc-Bold';  

font-weight: normal;

    font-style: normal;

}




첨부파일
비밀번호 수정 및 삭제하려면 비밀번호를 입력하세요.
댓글 수정

비밀번호 :

/ byte

비밀번호 : 확인 취소

댓글 입력
댓글달기 이름 : 비밀번호 : 관리자답변보기

영문 대소문자/숫자/특수문자 중 2가지 이상 조합, 10자~16자

/ byte

왼쪽의 문자를 공백없이 입력하세요.(대소문자구분)

관리자에게만 댓글 작성 권한이 있습니다.