워드프레스 쇼핑몰, 웹사이트

사이트 이미지
쇼핑몰

남성의류 정기결제 쇼핑몰

우커머스의 정기결제(Subscription) 플러그인을 이용한 쇼핑몰.

사이트 이미지
웹사이트

회원관리 사이트

회원관리 프러그인을 이용한 학회 홈페이지.

사이트 이미지
쇼핑몰

면도기 정기결제 쇼핑몰

우커머스의 정기결제(Subscription) 플러그인을 이용한 쇼핑몰.

사이트 이미지
쇼핑몰

해외 쇼핑몰

해외 대상 쇼핑몰. 다양한 플러그인 사용됨.

사이트 이미지
쇼핑몰

강아지 용품 정기결제 쇼핑몰

우커머스의 정기결제(Subscription) 플러그인을 이용한 쇼핑몰.

포트폴리오 보기

블로그 인기글

커스텀 디자인

여러 종류의 플러그인을 이용해 페이지와 콘텐츠를 커스텀 디자인

Brizy Pro

페이지 빌더

다양한 콘텐츠를 만들 수 있는 프론트 엔드 페이지 빌더

Elementor Pro

페이지 빌더

다양한 콘텐츠를 만들 수 있는 프론트 엔드 페이지 빌더

Advanced Custom Field Pro

사용자 정의 필드

커스텀 콘텐츠 작업에 필요한 플러그인

Pods

사용자 정의 콘텐츠 타입

기본 콘텐츠 타입외에 다양한 형태의 콘텐츠 생성.

블로그

작년 3월 책을 출간하기로 기획했는데 이제서야 원고가 완성됐습니다. 늦어진 가장 큰 이유는 서적에서 사용하기로 한 테마가 지난 12월에 대폭 개정되면서 모든 내용이 변경됐기 때문입니다. 원고를 두번이나 작성해야 하는 작업이었습니다. 책을 발간하기 전에 개정돼 다행입니다. 이번 달에 리뷰를 거치면 다음 달 안에 출간될 것으로 예상합니다. 


2015년 9월 18일 출간 예정입니다. 이곳의 글을 참고하세요.


출판사에서 리뷰가 늦어지면서 벌써 워드프레스 4.3 버전이 나올 시기가 됐습니다. 이 책에서 사용할 테마도 4.3 버전에 맞춰 업그레이드 됐습니다. 책을 최신 버전에 맞춰야 한다는 생각에 출판사의 리뷰가 끝난 원고를 다시 수정하고 있습니다. 번들 플러그인인 레이어 슬라이더가 몇년만에 업데이트 돼서 기능은 차이는 없지만 인터페이스가 수정됐습니다. 따라서 원고 수정 작업이 좀 늦어져 8월 내 아니면 9월 초에 출간될 것 같습니다. 



책에서 사용할 테마입니다.


바로가기


다음은 이 서적의 서문입니다.

 


서문


워드프레스는 세계적으로 가장 인기 있는 CMS로 자리를 잡았고 매년 2% 정도씩 사용 비율이 증가하고 있습니다. 국내에서도 다양한 토종 CMS를 제치고 상위를 차지하고 있습니다. 워드프레스가 인기가 있는 이유는 플러그인을 통해 기능을 확장할 수 있고 테마를 통해 원하는 디자인을 용이하게 선택할 수 있다는 점입니다. 여기에 더해 엄청난 커뮤니티의 활동은 더 나은 프로그램의 발전을 가져오고 있습니다.


워드프레스가 인기가 있는 이유 중에 하나가 바로 사용의 용이함입니다. 5분 설치로 유명한 워드프레스는 관리자 화면 인터페이스가 개발자가 아닌 일반 사용자 중심으로 설계돼있어서 누구나 블로그를 쉽게 만들 수 있습니다. 워드프레스는 수년 전까지만 해도 블로그 프로그램으로만 알려져 있었고 웹사이트나 쇼핑몰은 두루팔, 줌라, 마젠토 등 다른 CMS가 사용됐었습니다. 하지만 워드프레스는 이제 웹사이트는 물론이고 쇼핑몰, 포럼 사이트 등 만들지 못하는 것이 없을 정도로 강력한 CMS가 됐습니다.


블로그는 글과 이미지만 있으면 간단하게 만들 수 있지만 웹사이트는 그렇지 않습니다. 다양한 페이지가 있어야 하고 이러한 페이지는 글자와 이미지만으로는 부족합니다. 보다 멋지게 표현하기 위해서는 레이아웃을 잘 표현해야 합니다. 프리미엄 테마는 이러한 레이아웃을 쉽게 만들어주는 페이지 빌더라는 것이 포함돼있습니다. 이 기능으로 인해 코드를 모르는 일반인이라도 쉽게 멋진 웹사이트를 만들 수 있습니다.


워드프레스의 가장 큰 단점 중 하나가 영어로 돼있다는 점입니다. 워드프레스나 기본 플러그인은 한글화 돼있지만 많이 사용하는 플러그인이나 프리미엄 테마는 모두가 영문입니다. 또한 아무리 워드프레스 전문가라도 프리미엄 테마는 다루기 어렵습니다. 왜냐하면 테마마다 서로 다른 설정이 있기 때문입니다.


워드프레스가 쉽다고는 하지만 이러한 언어 장벽과 서로 다른 테마 설정에서 오는 장벽이 그 용이함을 무색하게 만듭니다. 따라서 필자는 프리미엄 테마의 사용법을 알리기 위해 누구도 도전하지 않는 프리미엄 테마 사용 가이드를 두 번째 만들게 됐습니다. 하나의 프리미엄 테마를 대상으로 가이드 서적을 만드는 것은 상당히 모험에 속합니다. 전 세계 누구라도 이런 책을 만드는 사람이 없습니다.


프리미엄 테마를 대상으로 책을 만드는 데 따르는 어려운 점은 크게 두 가지가 있습니다. 하나는 특정 테마에 적용되는 테마 설정이 다른 테마에도 같은 설정으로 적용되지 않는 다는 것입니다. 다른 하나는 테마는 수시로 업데이트 되고 워드프레스가 새로운 버전으로 업데이트 되면 테마도 따라서 업데이트 되면서 기능도 추가됩니다. 그러면 책의 내용도 달라져야 하는데 이를 따라 잡기가 불가능합니다.


그럼에도 불구하고 프리미엄 테마 사용 가이드가 필요한 것은 프리미엄 테마를 몇 가지 사용해보면 아주 똑같지는 않더라도 비슷한 설정이 다른 테마에 있고 이를 응용할 수 있다는 것입니다. 모든 테마가 각각 다른 설정이 있다고는 하나 테마 제작자는 특정 기능이 인기가 있으면 서로 모방하기 때문에 기능이 비슷해지는 효과가 발생합니다. 어떤 테마 개발자가 좋은 기능을 추가해 인기 테마로 되면 다른 테마 제작자도 따라하는 것이죠. 그러면서 테마는 기능이 발전하는 것입니다.


테마 업데이트에 따른 서적의 내용 차이는 서적에서 사용한 테마 버전을 사용해 그대로 따라 하면 문제는 해결됩니다. 테마 제작 회사에 요청해 포함시키면 되는 것입니다. 서적에서 사용한 테마를 사용해 어느 정도 익숙해지면 새로운 버전의 테마로 업데이트하고 자신만의 사이트를 만들면 되는 것입니다.


사실 이 책을 기획한 것이 2014 3월이었는데 3~4개월이면 책이 완성되지만 1년 이상이 되도록 완료하지 못했습니다. 가장 큰 이유가 테마가 빈번하게 업데이트 된다는 점 때문입니다. 이 책에서 사용하는 테마는 The7이라는 테마인데 2013 9월 처음 나온 이후로 계속 상위권에서 인기 테마로 자리잡고 있었습니다. 그러던 중 2014 12월 돌연 The7-2라는 테마로 변경됐습니다. 테마에도 시즌이라는 게 있는지 모르겠지만 2기 테마가 된 것이죠. 그러면서 코드나 테마 내용이 전면 개정됐습니다. 이미 원고가 완료됐었고 필요한 플러그인의 출시를 기다리고 있었는데 새로운 테마로 되다 보니 원고도 전면 개정할 수 밖에 없었습니다. 중간에 몇 번의 업데이트도 있었고 원고를 수정한 것만 해도 3번이나 되는데 전면 개정으로 인해 더욱 늦어질 수 밖에 없었습니다. 한편으로는 이 책이 나오고 나서 테마가 개정됐다면 어땠을까 하는 생각에 늦게 나오게 된 것을 다행으로 생각합니다.


그만큼 프리미엄 테마를 대상으로 가이드 서적을 만드는 것은 상당히 어려운 일입니다. 하지만 국내에서 워드프레스라는 좋은 프로그램의 소개와 확대를 위해 필요하다는 생각에 결국에는 완성을 하게 됐습니다. 그동안 원고 파일이 망가져 복구할 수 없는 상황까지 온 적도 있었고 다른 사정으로 인해 이 책이 나오기는 어렵겠다는 생각이 든 적도 많았습니다. 운 좋게도 파일은 복구할 수는 있었지만 이미지를 추가하고 일부 수정을 거쳐야 하는 험난한 과정이었습니다.

 

이 책의 내용


1.워드프레스 웹사이트


워드프레스는 웹호스팅에 사용하기 위해 만들지만 보다 쉬운 환경에서 만들기 위해서는 내 컴퓨터에서 작업하는 것이 이상적이고 보편적인 방법입니다. 내 컴퓨터에 웹서버 환경을 만들고 워드프레스를 설치한 다음 테마를 설치해 테마에서 제공하는 각종 테마 옵션을 설정하는 방법을 알아봅니다.


2장 테마 다루기


테마 옵션은 전체 사이트의 레이아웃이나 색상, 글자, 배경 등 전체적인 설정을 할 수 있는 기능입니다. 프리미엄 테마는 콘텐츠를 쉽게 만들기 위해 페이지 빌더를 포함시키고 있습니다. 2장에서는 주로 페이지 빌더 사용법을 자세히 설명합니다.


3장 슬라이더와 페이지 만들기


테마에 포함된 두 가지 슬라이더 플러그인의 사용법과 템플릿을 다루는 방법을 설명합니다. 슬라이더는 웹사이트에서 빼놓을 수 없는 요소 중에 하나이며 멋진 슬라이더는 방문자의 눈길을 끌기에 충분합니다. 템플릿은 여러 가지 콘텐츠의 페이지를 만드는데 사용하며 페이지 빌더로 만들 수 없는 콘텐츠를 출력할 수 있습니다.


4장 디테일


사이트에 필요한 푸터를 추가하는 방법과 메가메뉴 사용법, 번역 프로그램 사용법이 추가됩니다. 이 장의 핵심은 보안입니다. 워드프레스는 보안에 취약하다고 하지만 결코 그렇지 않습니다. 워낙에 인기가 있다 보니 사용자가 많고 그만큼 해커의 공격 대상이 되기 때문인 것이며 워드프레스가 보안에 취약한 것이 아닙니다. 워드프레스 사용자가 취할 수 있는 각종 보안 기능을 추가하는 방법을 알아봅니다.


목차


1장 워드프레스 웹사이트

1-1 워드프레스로 웹사이트를 만드는 이유

1-1-1 강력하고 쉬운 플러그인 시스템

1-1-2 자유로운 디자인의 선택

1-1-3 수많은 기여자들

1-1-4 방대한 커뮤니티

1-1-5 사용의 용이성

1-1-6 웹사이트 플랫폼으로의 진화

1-1-7 반응형 디자인


1-2 이 책을 진행하는 데 필요한 사항

1-2-1 HTML과 CSS에 관한 지식

1-2-2 워드프레스에 관한 지식

1-2-3 텍스트 편집기

1-2-4 구글 크롬 브라우저

1-2-5 웹 서버 환경 만들기

1-2-6 질문/답변


1-3 워드프레스 설치

1-3-1 서버 환경 만들기

1-3-2 워드프레스 설치하기

1-3-3 데이터베이스 만들기

1-3-4 워드프레스 설치의 두 가지 방법

1-3-5 웹호스팅의 선택


1-4 워드프레스 관리자 화면

1-4-1 글 만들기

1-4-2 편집기 도구모음


1-5 유료 테마 구입하기

1-5-1 계정 만들기

1-5-2 테마 고르기

1-5-3 내려받은 테마 파일의 구조


1-6 테마와 각종 플러그인 설치

1-6-1 워드프레스 관리자 화면에서 설치하기

1-6-2 테마 폴더를 직접 업로드 하기

1-6-3 자식 테마 수정하기

1-6-4 플러그인 설치하기

1-6-5 언어 파일 설치하기 

1-6-6 플러그인의 기능


1-7 데모 데이터 설치하기

1-7-1 워드프레스 백업하기

1-7-2 오토셋 서버 성능 향상

1-7-3 데이터베이스 변경

1-7-4 테마 데모 데이터 설치하기


1-8 테마 옵션

1-8-1 일반 옵션

1-8-2 스킨 옵션

1-8-3 헤더 & 탑바

1-8-4 브랜딩

1-8-5 스트라이프

1-8-6 사이드바

1-8-7 푸터 & 하단바

1-8-8 블로그, 포트폴리오, 갤러리 

1-8-9 페이지 제목 옵션 

1-8-10 폰트

1-8-11 버튼 옵션

1-8-12 이미지 스타일 & 마우스오버

1-8-13 공유 버튼

1-8-14 위젯 영역

1-8-15 가져오기 & 내보내기

1-8-16 글 보관함


2장 테마 다루기

2-1 웹사이트 콘텐츠

2-1-1 사용자 정의 글 타입(Custom Post Type)

2-1-2 글(Post)과 페이지(Page)

2-1-3 페이지 레이아웃


2-2 페이지 빌더 

2-2-1 단축코드

2-2-2 페이지 빌더와 관련된 메뉴

2-2-3 페이지 빌더란?

2-2-4 페이지 빌더의 기본 사용법

2-2-5 비주얼 컴포우저의 구성

2-2-6 페이지 빌더 요소의 구분

2-2-7 페이지 헤더 옵션

2-2-8 팬시 타이틀

2-2-9 슬라이드쇼

2-2-10 페이지 기타 설정

2-2-11 페이지 만들기


2-4 미디어 다루기

2-4-1 이미지 복사하기

2-4-2 배너 사용하기

2-4-3 단일 이미지 요소

2-4-4 스트라이프로 배경 이미지 다루기

2-4-5 팬시 미디어

2-4-6 비디오 플레이어

2-4-7 미디어 그리드

2-4-8 메이슨리 미디어 그리드

2-4-9 티저(Teaser) 


2-5 콘텐츠 다루기

2-5-1 블로그 글 출력

2-5-2 블로그 스크롤러

2-5-3 블로그 미니

2-5-4 글 그리드

2-5-5 팬시 타이틀과 팬시 세퍼레이터

2-5-6 탭과 투어 요소에 위젯 이용하기

2-5-7 포트폴리오와 포트폴리오 스크롤러, 포트폴리오 전체 정렬 그리드

2-5-8 어코디언과 FAQ

2-5-9 사진 앨범과 사진 스크롤러


2-6 글 타입과 요소

2-6-1 혜택 요소

2-6-2 추천

2-6-3 파트너, 고객 글 타입

2-6-4 팀


2-7 기타 요소 다루기

2-7-1 구글 지도

2-7-2 프로그레스 바와 파이 차트

2-7-3 콜 투 액션

2-7-4 메시지 박스

2-7-5 아이콘

2-7-6 버튼

2-7-7 버튼(GO)

2-7-8 사용자 정의 헤딩

2-7-9 이전/이후

2-7-10 팬시 새퍼레이터(Fancy Separator)

2-7-11 슬라이더 사용하기

2-7-12 소셜 아이콘

2-7-13 가격 테이블 사용하기


2-8 얼티미트 애드온 플러그인 사용하기

2-8-1 애니메이션 블록(Animation Block)

2-8-2 고급 버튼(Advanced Button)

2-8-3 고급 캐러젤(Advanced Carousel)

2-8-4 카운트다운(Countdown)과 팬시 텍스트(Fancy Text)

2-8-5 이중 버튼(Dual Button)

2-8-6 플립 박스(Flip Box)

2-8-7 구글 맵(Google Map)

2-8-8 구글 트렌드(Google Trends)

2-8-9 헤딩 요소

2-8-10 하이라이트 박스(Highlight box)

2-8-11 타임라인(Timeline)

2-8-12 아이콘 요소(Icons)

2-8-13 이미지 새러페이터(Image Separator)

2-8-14 인포 배너(Info Banner)

2-8-15 인포 박스(Info Box)

2-8-16 인포 서클(Info Circle)

2-8-17 인포 리스트(Info List)

2-8-18 인포 테이블(Info Tables)

2-8-19 인터랙티브 배너(Interactive Banner)

2-8-20 인터랙티브 배너2(Interactive Banner2)

2-8-21 저스트 아이콘(Just Icon)

2-8-22 리스트 아이콘(List Icon)

2-8-23 모달 박스(Modal Box)

2-8-24 가격 박스(Price Box)

2-8-25 스페이서 / 갭 (Spacer/Gap)

2-8-26 카운터(Counter)

2-8-27 스와치 북(Swatch Book)

2-8-28 비디오 배너(Video Banner)

2-8-29 아이호버(ihover)

2-8-30 크리에이티브 링크(Creative link)

2-8-31 핫 스팟(Hotspot)


2-9 그리드 요소 빌더 사용하기


3장 슬라이더와 페이지 만들기

3-1 레볼루션 슬라이더

3-1-1 슬라이더 설정

3-1-2 슬라이더 배경 이미지 추가하기

3-1-3 슬라이더 확인 페이지 만들기

3-1-4 슬라이드 설정

3-1-5 글자 레이어 추가하기

3-1-6 레이어 애니메이션

3-1-7 이미지 레이어 사용하기


3-2 레이어 슬라이더 사용하기

3-2-1 슬라이더 설정

3-2-2 슬라이드 만들기

3-2-3 레이어 추가하기

3-2-4 이미지 레이어 사용하기


3-3 기타 슬라이더

3-3-1 포트홀(Porthole) 슬라이더

3-3-2 사진 스크롤러

3-3-3 3D 슬라이더


3-4 템플릿으로 페이지 만들기

3-4-1 블로그 단일 글(Single post) 만들기

3-4-2 블로그 페이지 만들기

3-4-3 포트폴리오 프로젝트

3-4-4 포트폴리오 페이지 만들기

3-4-5 목록형 포트폴리오

3-4-6 메이슨리 & 그리드형 포트폴리오

3-4-7 앨범 단일 글 만들기

3-4-8 앨범 페이지 만들기

3-4-9 갤러리 페이지 만들기

3-4-10 팀 페이지와 추천 페이지 만들기

3-4-11 마이크로사이트 템플릿 사용하기

3-4-12 공사중 페이지 만들기

3-4-13 회원가입 페이지 만들기

3-4-14 WP-Members 관련 페이지 만들기

3-4-15 회원정보 제공 동의서 페이지 만들기

3-4-16 게시판 페이지 만들기


4장 디테일

4-1 두 번째 푸터 영역 만들기

4-1-1 위젯 영역 옵션의 역할

4-1-2 푸터 파일 수정하기

4-1-3 푸터 위젯 영역에 위젯 추가

4-1-5 사용자 정의 메뉴 추가


4-2 메가 메뉴 사용하기


4-3 워드프레스 보안

4-3-1비밀번호의 형태

4-3-2 비밀번호 관리자(Password Manager)

4-3-3 관리자 아이디 변경

4-3-4 데이터베이스 백업

4-3-5 로그인 회수 제한 

4-3-6 구글 OTP(Google Authenticator) 사용하기

4-3-7 관리자 화면 편집기 사용 방지

4-3-8 업데이트

4-3-9 워드프레스 저장소 이외의 무료 테마 및 플러그인 사용 자제


4-4 번역 수정하기


4-5 워드프레스 사이트 이전하기

4-5-1 데이터베이스 백업 및 환경 설정 파일 수정하기

4-5-2 파일질라 내려받기

4-5-3 파일 업로드

4-5-4 데이터베이스 가져오기

4-5-5 데이터베이스 URL 수정

4-5-6 사이트 확인