자식테마까지 설치 완료 했다면 이제 테마의 설정을 진행하겠습니다.

워드프레스에서 테마에 대한 설정은 Appearance – Theme 에서 해당 테마의 Customize에서 가능합니다여기서 사이트 제목 등의 설정과 메뉴위젯등의 설정이 가능한데요즘처럼 많은 기능이 있는 테마들은 각자 세부 사항을 설정할  있는 테마 자체의 설정페이지를 갖고 있습니다

우리가 사용할 Enfold 테마에 대한 기본 설정들은 Admin 화면 내의 Enfold Child 라는 메뉴에서 가능합니다물론 Child 테마가 아닐 경우에는 child 라는 단어는 빠지겠지요.

모든 항목을 살펴볼 수는 없고 가지 중요 사항만 체크해 보겠습니다.

세부 항목을 수정한 후에는 상단하단에 있는 Save all changes 버튼을 클릭해야 저장이 됩니다.
다만 현재는 테마에 대한 설정을 진행하지 않고 매뉴얼의 기능으로 설명합니다. Demo data  Import 하게 되면 설정이 달라질  있기 때문입니다.

 

1. Theme Options

Frontpage setting 에서화면에노출페이지를선택하게됩니다.
현재는 Sample Page 정도만있을텐데메인에노출될페이지를만들고여기서지정하면됩니다.

Logo Favicon그대로로고입니다. URL입력해도되고이미지파일을올려도됩니다로고는기준사이즈에나온대로 340x156px 구성하시면되고다른사이즈의경우에는 Header setting으로들어가헤더부분의사이즈를조정해주시면깨끗해게처리됩니다파비콘은 What is a favicon 에서도설명하지만브라우저상단에제목작은아이콘입니다크롬기준으로로딩중에는원형의로딩중아이콘이돌아가고페이지로딩이완료되면파비콘이출력됩니다테마설치후에는밋밋하게테마의기본파비콘으로추가되거나호스팅서비스의파비콘으로채워지는데간단한아이콘으로사이트의파비콘을사용할있습니다.

2. General Layout

 

 부분은 옵션을 변경할 경우 상단에 Preview 미리보기를 제공합니다따라서 용어를  모르더라도 크게 어려움이 없습니다다만 Sticky Sidebar menu 같은 경우는 달라붙는 다는 뜻과 마찬가지로 스크롤  때에 사이드바가 따라온다는 의미입니다.

 

3. General Styling

컬러셋을 선택할  있고직접 컬러를 조정할  있습니다배경이나 글자 링크 글자 박스 내부테두리 등등 여러 컬러들의 조합을 선택할  있습니다사실 저처럼 컬러 감각이 없는 경우는 미리 지정된 조합으로 컬러를 맞추는 것이 편하더군요.

4. Advanced Styling

 부분은 CSS파일을 처리하던 곳을 나름대로 쉽게 변경할  있도록 하기 위한 기능입니다전반적인 글자의 색상폰트크기특성   속성에 대한 값을 지정할  있습니다사실 CSS 다룰  안다면 좋은 편의 기능  하나일  있지만상세설정이 너무 상세해서 어렵다면 딱히 건들지 않을 것을 추천합니다.
 

5. Main Menu

 설정 역시 상단에서 Preview 제공합니다그렇기 때문에  항목에 대한 변경 값을 미리   있습니다외국에서 사용하는 어휘  특이했던 것은 “burger 아이콘” 이라는 말이  그대로 햄버거라는 뜻이 아니라메뉴 아이콘에 보통 3개의 가로줄이 있거나 모바일에서 그렇게 표시되는 아이콘을 “Burger icon” 이라고 하더군요.

6. Header


헤더는 웹사이트의 최상단을 의미합니다.
 메뉴에서 상단의 로고와 메뉴 위치그림자 등의 약간의 효과메뉴의 배경  여러 효과를 설정할  있으며물론 Preview 제공합니다혹시 첫번째의 Theme Option 에서 로고의 사이즈 높이가 Default 값인 156px 넘거나 그보다 작을 경우 메뉴의 Header Size 항목에서 Custom puxel value 선택 하고 Header custom Height  알맞게 설정하면 됩니다예를 들어 로고 사이즈가 가로 300px 세로 200px  경우, Header Custom Height  200px 정도롤 변경 후에 실제 반영되는 사이즈를 확인하고 조금씩 조정하면 됩니다.
 

7. Sidebar setting

개인적으로 저는 Sidebar 선호하는 편이 아니라서 Blog 일부 페이지를 제외하고는 적용하지 않는 편입니다 메뉴에서는 여러 페이지에서 사이드바를 어디에 위치 시킬지 설정   있습니다혹시 사이드바를 없애고 싶다면 이곳 외에서 페이지를 구성할 때에도 없앨  있으니 사이드바를  없애야겠거나 혹은 반드시 , 배치를 고려해야 하는 경우에 설정하시길 권합니다.

8. Footer

푸터는 웹페이지의  하단을 뜻합니다보통 우리나라의 웹사이트에서는 아주 작은 글씨로 사업자정보연락처 등으로 구성합니다해외도 많이 다르지는 않습니다다만 하단에 들어가는 문구가 아주 작은 경우는 Copyright  대한 정보이고연락처 부분은 조금 크게 구성하기도 합니다물론 푸터에 연락처가 아닌 SNS 링크뉴스 등으로 구성하기도 하며설정에 따라 특정 페이지나 위젯을 만들어두가도 합니다위젯을 설정한 경우에는 Appearance – Widget 에서 여러 설정이 가능하고 테마 Customizing 에서도 설정이 가능합니다.

Social Icons 클릭하면 자사(혹은 자신) Social 계정으로 넘어가는 아이콘을 푸터 부분에 표시하게 됩니다.

Copyright 에는 기본적으로 “© Copyright – My Blog – Enfold Theme by Kriesi” 라는 항목이 표시되는데 (여기서 My Blog 현재 사이트의 제목)
여기서 굳이 Enfold Theme by kriesi 라는 테마 제작자의 copyright  사용하지 않으려면 Copyright  © Copyright – 사이트제목 뒤에 [nolink] 라고 넣어주면 됩니다.

[nolink]를 입력하여 테마 제작사 링크가 사라진 결과
 

9. Layout Builder

 부분은 크게 건들지 않아도 됩니다페이지를 만들 때에 Layout builder라는 것을 사용하게 되는데, Enfold에서 제공되는 빌더에 대한 설정입니다조금  고급 기능을 활성화  것인지인데고급기능이라고 해서  좋다기 보다는  어려운 기능을 사용한다는 느낌으로 접근하는 것이 좋습니다.
 

10. Blog Layout

블로그를운영할시에블로그의레이아웃설정입니다스타일과함께블로그포스트에표시할항목들예를들면코멘트숫자나포스트의카테고리태그를보이게것인지여부를설정합니다.
또한 공유버튼을 표시할  있는데 혹시 아래쪽의 Social Profiles와는 무관하게 포스팅을 보고 있는 당사자가 자신의 SNS 공유할  있는 버튼을 표시하는  입니다.
 

11. Social Profiles

여기서는 여러 SNS서비스를 선택하고 계정을 입력할  있습니다보통은 자사의 계정을 입력하여 자사의 SNS로의 유입을 유도합니다헤더나 푸터 부분에 Social icon  보이게 설정했다면 해당 SNS 아이콘과 합께 링크가 활성화 됩니다물론 e-mail 아이콘을 통해 자사의 웹메일이나 Contact 페이지로 넘어가게  수도 있습니다.
 

12. Performance

워드프레스는 여러 모듈로 구성되어 있고이런 모듈들의 역할에 따라 사이트의 속도가 무거워지기도가벼워지기도 합니다 메뉴에서는 기능들의 통합이나 사용하지 않는 부분의 비활성화이미지 캐싱 플러그인 제공 등으로 웹사이트의 속도를 높이기 위한 기능을 제공합니다많은 항목이 CSS Javascript  같은 외모와 기능에 대한 부분을 설정하는데테마가 많이 화려해지고 기능도 많아지다 보니 사용자가 조정할 항목들에 대해 선택권을 주고 있습니다물론 초보의 경우 크게 설정할 부분이 없긴 합니다.

13. Privacy and Cookies

EU GDPR  공표되고 시행중입니다웹사이트에서 개인정보를 다룰 때에 GDPR를 준수하는 웹사이트를 제작하고자 한다면개인보호 정책에 대한 설정이 가능합니다일종의 개인정보 보호 정책 메시지를 쉽게 추가할  있도록 하는 것인데필요한 메시지를 추가하기 위해 체크 박스를 선택하고 저장하면 개인정보 보호 정책 페이지가 생성되며 이에 대한 링크를 푸터나 별도의 메뉴에 구성할  있습니다.
또한 사이트에서 쿠키를 저장하는 것에 대한 동의를 얻기 위해 쿠키 동의 메시지에 대한 표시 여부를 설정할  있습니다
 

14. Newsletter

Mailchimp사이트와 연동하여 구독자의 메일을 모으고 메시지를 발송하기 위한 메뉴입니다. Mailchimp 가입하여 API키를 받아 연동이 가능하며여기서 모은 구독자 정보를 바탕으로 여러 이메일 마케팅이 가능합니다물론 Mailchimp 서비스는 유료이며 다양한 장점을 갖고 있습니다.

15. Google services

Google Analytics 추적 코드를 입력하여 방문자에 대한 추적이 가능합니다개인정보 보호에서 구글의 추적코드를 활용한 방문자의 추적은 사용자가 선택할  있어야 하고 거부가 가능하도록 해야하기 때문에쿠키에 대한 동의 설정 후에 추적코드를 사용하는 것을 추천합니다.
Google Maps 기능은 자사의 지도를 표시할 때에 사용합니다. API키를 발급 받아 표시하는데 이는 추가적으로 다루도록 하겠습니다.
 

16. Demo Import

사실테마의 설치와 설정은 여기서부터 시작한다고 해도 과언이 아닙니다테마 설치 후에 제대로  포스팅이 없다면 덩그러니  화면만 있기 때문에테마 제작사에서 제공하는 여러 데모 데이터를 설치해 보고 여러  테스트  봐야 합니다주의할 점은 데모 데이터를 Import 하면이전에 저장해 두었던 내용은 모두 덮어씌여지게 되니주의를 요합니다.

17. Import / Export

테마의 설정 파일을 저장하고 불러올  있습니다또한 레이아웃 빌더를 사용하다 보면 아이콘이나 로고를 사용할 경우가 많은데이에 대한 추가도 가능합니다아이콘만  써도 생각보다 유용하게 쓰일 있는 기능인데 Import 라는 메뉴에 숨어있어서 처음에는 조금 찾기 어렵기도 합니다.

다양한 아이콘을 추가할 수 있는 메뉴입니다.
 
 테마의기본적인부분을설명했습니다.
모두영어로되어있다고해도번역기로도충분히알아들을있는내용이며용어가어려운경우에는일단적용해보고설정을바꿔보면변화된설정값을쉽게확인할있는부분이기때문에설정에서크게어려운부분은없습니다다만해당내용을모두적용해보기에는시간이많이소요되어간단하게나마메뉴의기본적인부분에대한설명을하게되었습니다.

 

0 답글

댓글을 남겨주세요

Want to join the discussion?
Feel free to contribute!

댓글 남기기

이메일은 공개되지 않습니다. 필수 입력창은 * 로 표시되어 있습니다

9 × = 90