이 글을 통해 얻게 되는 정보
- GeneratePress Premium 글자 스타일(Typography) 셋팅하는 방법
- System Stack 폰트로 글자 스타일을 셋팅하는 이유
글의 순서
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 00 - GeneratePress Premium 글자 스타일(Typography)
테마로 웹사이트를 꾸며나갈때 글자 스타일(Typography)을 지정하게 됩니다. 예를 들어 개별 포스트 페이지에 있는 제목의 글자 크기 및 글씨체, 본문 내용의 글자 크기 및 글씨체, 아카이브 페이지(글 모음 페이지)에 있는 제목의 글자 크기 및 글씨체 등의 글자 스타일을 지정하게 됩니다.
글자 스타일 지정의 경우 글로벌 셋팅을 통해 사이트 전반적으로 글자 스타일을 지정한 다음, 특정 페이지를 부분적으로 타겟해서 셋팅하는 과정을 거치게 됩니다.
- 글로벌 셋팅과 부분적 셋팅의 의미가 무엇인가요?
- 글로벌 셋팅 : 하나를 셋팅하면 사이트 전체에 일괄적으로 적용되는 셋팅을 의미합니다.
- 부분적 셋팅 : 특정 부분만 달리 셋팅하기를 원할 때 특정 부분을 타겟해서 적용하는 셋팅을 의미합니다.
STEP 01 - System Stack 폰트 적용 (글로벌 셋팅)
[ System Stack 폰트 적용 절차 ]
> 테마의 ‘사용자 정의하기’ 패널 OPEN
> Typography 섹션 클릭
> Font Manager에 있는 Lora, Heebo 폰트 모두 삭제
> System Stack 폰트 적용
> 공개 버튼 클릭
- System Stack 폰트란?
- 사용하는 운영체제에서 이미 적용되고 있는 폰트 스타일을 의미합니다.
- 왜 System Stack 폰트를 사용해야 하나요?
- 가장 기본적인 System Stack 폰트를 사용한다는 것은 사용하는 다른 폰트가 없다는 것을 의미합니다. 다시말해 폰트를 사용하는데 별다른 다운로드가 필요없다는 뜻입니다. 이것은 웹사이트의 무게를 준다는 의미와 동일합니다.
- 웹사이트의 무게를 줄여줌 = 사이트 최적화에 긍정적인 영향 = 구글 랭킹에 긍정적인 영향 = 수익에 긍정적인 영향
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 02 - Body 글자 스타일 셋팅 (글로벌 셋팅)
[ Body 글자 스타일 셋팅 절차 ]
> 테마의 ‘사용자 정의하기’ 패널 OPEN
> Typography 섹션 클릭
> BASE 섹션에 있는 Body 아이콘(∨) 클릭
> 입력값 셋팅 (아래 보라색 박스 참고)
> 공개 버튼 클릭
[PC 버전]
TARGET ELEMENT : Body
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Default | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 20px
Line Height : 1.8 em
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
[태블릿 버전]
TARGET ELEMENT : Body
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Default | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 19px
Line Height : 1.8 em
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지 (1.5)
[모바일 버전]
TARGET ELEMENT : Body
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Default | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 18px
Line Height : 1.6 em
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지 (1.5)
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 03 - HEADER (Site Title) 글자 스타일 셋팅 (글로벌 셋팅)
- 기본값 유지
HEADER의 Site Title의 경우 로고이미지로 대체해서 사용하는 경우가 많기 때문에 별다른 기본 셋팅값은 지정하지 않습니다.
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 04 - PRIMARY NAVIGATION 글자 스타일 셋팅 (글로벌 셋팅)
- 기본값 유지
PRIMARY NAVIGATION의 위치는 우측 상단에 보이는 메뉴입니다. 메뉴에 있는 글자 크기를 수정하고 싶다면 PC 버전, 태블릿 버전, 모바일 버전 각각 취향에 맞게 지정해주시면 됩니다. 이 글에서는 기본값이 가장 깔끔하다고 판단하여 별다른 셋팅은 하지 않습니다.
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 05- CONTENT 글자 스타일 셋팅 (글로벌 셋팅)
[ CONTENT 섹션 스타일 셋팅 절차 ]
> 테마의 ‘사용자 정의하기’ 패널 OPEN
> Typography 섹션 클릭
> CONTENT 섹션에 있는 Heading 1 (H1) 섹션에 있는 아이콘(∨) 클릭 후 지정
> CONTENT 섹션에 있는 Heading 2 (H2) 섹션에 있는 아이콘(∨) 클릭 후 지정
> CONTENT 섹션에 있는 Heading 3 (H3) 섹션에 있는 아이콘(∨) 클릭 후 지정
> 공개 버튼 클릭
Heading 1 (H1) 스타일 셋팅
[ CONTENT 섹션 스타일 셋팅 절차 ]
> 테마의 ‘사용자 정의하기’ 패널 OPEN
> Typography 섹션 클릭
> CONTENT 섹션에 있는 Heading 1 (H1) 섹션에 있는 아이콘(∨) 클릭 후 지정
> 공개 버튼 클릭
[PC 버전]
TARGET ELEMENT : Heading 1 (H1)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 50px
Line Height : 1.8 em
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
[태블릿 버전]
TARGET ELEMENT : Heading 1 (H1)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 40px
Line Height : 1.5 em
Letter Spacing : 기본값 유지
Bottom Margin : 기본값 유지 (20)
[모바일 버전]
TARGET ELEMENT : Heading 1 (H1)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 30px
Line Height : 1.2 em
Letter Spacing : 기본값 유지
Bottom Margin : 기본값 유지 (20)
Heading 2 (H2) 스타일 셋팅
[ CONTENT 섹션 스타일 셋팅 절차 ]
> 테마의 ‘사용자 정의하기’ 패널 OPEN
> Typography 섹션 클릭
> CONTENT 섹션에 있는 Heading 2 (H2) 섹션에 있는 아이콘(∨) 클릭 후 지정
> 공개 버튼 클릭
[PC 버전]
TARGET ELEMENT : Heading 2 (H2)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 40px
Line Height : 1.5 em
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
[태블릿 버전]
TARGET ELEMENT : Heading 2 (H2)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 30px
Line Height : 1.5 em
Letter Spacing : 기본값 유지
Bottom Margin : 기본값 유지 (20)
[모바일 버전]
TARGET ELEMENT : Heading 2 (H2)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 25px
Line Height : 1.5 em
Letter Spacing : 기본값 유지
Bottom Margin : 기본값 유지 (20)
Heading 3 (H3) 스타일 셋팅
[ CONTENT 섹션 스타일 셋팅 절차 ]
> 테마의 ‘사용자 정의하기’ 패널 OPEN
> Typography 섹션 클릭
> CONTENT 섹션에 있는 Heading 3 (H3) 섹션에 있는 아이콘(∨) 클릭 후 지정
> 공개 버튼 클릭
[PC 버전]
TARGET ELEMENT : Heading 3 (H3)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 30px
Line Height : 기본값 유지
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
[태블릿 버전]
TARGET ELEMENT : Heading 3 (H3)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 25px
Line Height : 1.5 em
Letter Spacing : 기본값 유지
Bottom Margin : 기본값 유지 (20)
[모바일 버전]
TARGET ELEMENT : Heading 3 (H3)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 22px
Line Height : 1.5 em
Letter Spacing : 기본값 유지
Bottom Margin : 기본값 유지 (20)
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 06 - Archive Content Title 글자 스타일 셋팅 (부분적 셋팅)
특정 페이지만 글자 스타일을 달리 하고 싶다면 ADD Typography 버튼을 활용해서 타겟 페이지를 지정한 다음 글자 스타일을 커스터마이징 할 수 있습니다.
만약 Archive 페이지 (글 모음 페이지)에서 H2제목 부분의 크기를 달리하고 싶다면 아래의 절차를 따르면 됩니다.
[ Archive Content Title 글자 스타일 셋팅 절차 ]
> 테마의 ‘사용자 정의하기’ 패널 OPEN
> Typography 섹션 클릭
> 하단에 있는 Add Typography 버튼 클릭
> TARGET ELEMENT의 Search elements…에 있는 Archive Content Title (H2) 클릭
> 입력값 셋팅 (아래 보라색 박스 참고)
> 공개 버튼 클릭
[PC 버전]
TARGET ELEMENT : Archive Content Title (H2)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 24px
Line Height : 기본값 유지
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
[태블릿 버전]
TARGET ELEMENT : Archive Content Title (H2)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 22px
Line Height : 기본값 유지
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
[모바일 버전]
TARGET ELEMENT : Archive Content Title (H2)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 20px
Line Height : 기본값 유지
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 07 - Single Content Tilte 글자 스타일 셋팅 (부분적 셋팅)
특정 페이지만 글자 스타일을 달리 하고 싶다면 ADD Typography 버튼을 활용해서 타겟 페이지를 지정한 다음 글자 스타일을 커스터마이징 할 수 있습니다.
만약 개별 글페이지의 H1제목 부분의 크기를 달리하고 싶다면 아래의 절차를 따르면 됩니다.
[ Single Content Title H1 글자 스타일 셋팅 절차 ]
> 테마의 ‘사용자 정의하기’ 패널 OPEN
> Typography 섹션 클릭
> 하단에 있는 Add Typography 버튼 클릭
> TARGET ELEMENT의 Search elements…에 있는 Single Content Title (H1) 클릭
> 입력값 셋팅 (아래 보라색 박스 참고)
> 공개 버튼 클릭
[PC 버전]
TARGET ELEMENT : Single Content Title (H1)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 50px
Line Height : 기본값 유지
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
[태블릿 버전]
TARGET ELEMENT : Single Content Title (H1)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 40px
Line Height : 1.5 em
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
[모바일 버전]
TARGET ELEMENT : Single Content Title (H1)
FONT FAMILY : –Select– (시스템 스택 폰트 적용된 상태)
FONT WEIGHT : Bold | TEXT TRANSFORM : Default
FONT STYLE : Default | TEXT DECORATION : Default
Font size : 30px
Line Height : 1.2 em
Letter Spacing : 기본값 유지
Paragraph Bottom Margin : 기본값 유지
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 08 - WIDGETS 글자 스타일 셋팅 (글로벌 셋팅)
- 기본값 유지
#GeneratePress Premium 글자 스타일 #가탈작 가이드
STEP 09 - OFF CANVAS PANEL 글자 스타일 셋팅 (글로벌 셋팅)
- 기본값 유지
#GeneratePress Premium 글자 스타일 #가탈작 가이드
완료
수고하셨습니다!
정보가 도움이 되셨나요?
가탈작 가이드 웹사이트는
자발적 정보 이용료로 운영됩니다.
인생은 GIVE & TAKE 라고 생각합니다.
물론, 이용료 지불은 당신의 자유의지 입니다.
감사합니다!
[함께 보면 좋은 정보]
[가탈작 가이드 추천]
#GeneratePress Premium 글자 스타일 #가탈작 가이드
#GeneratePress Premium 글자 스타일 #GeneratePress Premium 글자 스타일 #GeneratePress Premium 글자 스타일 #GeneratePress Premium 글자 스타일 #GeneratePress Premium 글자 스타일 #GeneratePress Premium 글자 스타일