워드프레스 쇼핑몰 만들기(위키북스 오픈소스 웹 시리즈 54)

이제 워드프레스로 온라인 쇼핑몰 제작이 쉬워진다!



워드프레스는 블로그를 만드는 데 주로 사용했지만 웹사이트 제작뿐만 아니라 쇼핑몰까지 만들 수 있을 정도로 진화했습니다. 우커머스는 워드프레스와 마찬가지로 간단한 설치로 5분만에 쇼핑몰을 만들 수 있는 플러그인입니다. 우커머스는 상품 관리, 재고 관리, 배송 관리, 세금, 주문 관리, 보고서 기능 등 온라인 쇼핑몰에서 필요한 모든 기능들을 체계적으로 관리할 수 있게 만들어져 있습니다.



우커머스는 전 세계적으로 인기리에 사용 중이며, 출시된 지 2년 정도밖에 되지 않았지만 사용자 수가 폭발적으로 증가하고 있습니다. 이제 한국형 결제 플러그인까지 출시됐으니 워드프레스와 우커머스를 활용해 온라인 쇼핑몰을 누구든지 손쉽게 저렴한 비용으로 만들 수 있습니다.



[소스코드 다운로드 & 블로그]



이 책에서 진행한 모든 실습 파일은 아래 URL에서 내려받을 수 있습니다. 또 이 책의 내용에 오류가 있거나 질문사항이 있으면 아래 블로그의 방명록이나 관련 글에 댓글을 남겨주시면 답변 드리겠습니다.



블로그 주소: http://martian36.tistory.com/1223



이 책은 세 부분으로 나뉜다.



[1장] 워드프레스 쇼핑몰 만들기



1장에서는 우커머스의 기능과 설정 방법을 설명하기 위해 워드프레스 기본 테마를 사용해 시작합니다. 우커머스는 워드프레스 플러그인이지만 상품 관리, 재고 관리, 배송 관리, 세금, 주문 관리, 보고서 기능 등 온라인 쇼핑몰에 필요한 모든 기능을 체계적으로 관리할 수 있게 만들어져 있습니다. 우커머스는 전 세계적으로 인기리에 사용 중이며, 출시된 지 2년 정도밖에 되지 않았지만 사용자 수가 폭발적으로 증가하고 있습니다.



[2장] 쇼핑몰 디자인



1장의 내용만으로도 우커머스에 대한 기능은 충분히 소화할 수 있지만 아무리 좋은 테마라도 디자인이나 기능을 원하는 대로 만들기는 쉽지 않습니다. 2장에서는 무료 테마 중 트위터 부트스트랩 기반의 테마를 하나를 선택해 우커머스에서 제공하는 각종 코드 조각(Snippet)이나 단축 코드(Short Code)를 사용해 처음부터 쇼핑몰 디자인을 진행합니다. 이 과정에서 우커머스 외에 갖가지 플러그인이 사용됩니다. 우커머스는 무료 프로그램이지만 기능 확장을 위해 유료 플러그인을 판매하고 있습니다. 무료 플러그인도 많이 개발돼 있어 무료 플러그인만 사용해도 충분한 기능을 추가할 수 있습니다. 2장에서는 이러한 플러그인의 사용법도 설명합니다.



[3장] 디테일



3장에서는 2장에서 쇼핑몰을 만들 때 진행상 흐름에 방해되어 생략한 내용을 다룹니다. 디자인 수정과 관련된 내용도 있고 기능 추가와 관련된 내용도 있습니다. 더 추가할 내용이 많지만 지면상 다 추가할 수 없으며, 나머지 부분은 제 블로그를 통해 만나보실 수 있습니다.

[1장] 워드프레스 쇼핑몰 만들기



- 01: 워드프레스 쇼핑몰



워드프레스로 쇼핑몰을 만드는 이유

워드프레스 쇼핑몰 플러그인

우커머스를 쇼핑몰 플러그인으로 선택한 이유

우커머스 테마

테마의 선택

워드프레스와 우커머스의 새 버전

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



- 02: 워드프레스와 우커머스 설치



웹 서버 환경 만들기

워드프레스 설치

우커머스 설치 및 필요 플러그인 설치

상품 샘플 파일 가져오기

테마 변경



- 03: 플러그인 설치 및 기본 쇼핑몰 만들기



구글 폰트 사용하기

자식 테마 만들기

위젯 사용하기

상품 가격 일괄 편집

스키터 슬라이더 사용하기

메뉴 설정



- 04: 우커머스 설정



일반 탭

카탈로그 탭

페이지 탭

저장소 탭

세금 탭

배송 탭

지불 게이트웨이 탭

이메일 탭

결합(Integration)



- 05: 상품 추가



상품 목록 페이지

단순 상품 추가

다운로드 가능한 상품 추가

가상 상품

옵션 상품

그룹 상품

외부/연계 상품

CSV 파일로 상품 추가하기

상품 카테고리



- 06: 주문 페이지



주문 관리 페이지

주문 편집 페이지



- 07: 쿠폰 사용과 보고서



쿠폰 사용

보고서



- 08: 플러그인과 함수 사용



YITH 플러그인

위시리스트

우커머스 선물 포장 옵션

새 상품 배지

우커머스 장바구니 메뉴

사용자 정의 탭

탭 순서 바꾸기

관련 상품을 탭으로 이동하기





[2장] 쇼핑몰 디자인



- 01: Twenty Twelve 테마 수정



제이슨리와 무한 스크롤 플러그인 적용

상단 이동 버튼 추가하기

regenerate-thumbnails 플러그인으로

이미지 파일 재생성



- 02: ipin 테마 사용하기



ipin-child 자식테마 만들기

상점 페이지 레이아웃 만들기

테마 교체와 상품 페이지 수정

상품 상세 페이지 레이아웃 변경



- 03: 우커머스 템플릿 구조



상점 페이지 템플릿 구조

상세 페이지 템플릿 구조



- 04: 상세 페이지 수정



상품 이미지 영역 수정

옵션 영역 수정

검색 박스 수정

탭 수정

폰트 어썸 아이콘 사용하기

사이드바 위젯 등록

메뉴바 수정

툴바와 상점 공지 부분 수정



- 05: 장바구니 및 결제 페이지 수정



장바구니 페이지 수정

결제 페이지 수정

내 주소 편집 페이지 수정

결제 플러그인 사용 시 수정하기



- 06: 블로그 페이지 수정



더미 콘텐츠 플러그인 사용하기

댓글 수 변경



- 07: 초기 화면 만들기



front-page.php 파일 만들기

패럴랙스 콘텐츠 슬라이더 사용하기

캐러젤 콘텐츠 슬라이더 사용하기

bx-slider 슬라이더 플러그인 사용하기

우커머스 위젯에 bx-slider 사용하기



- 08: 워드프레스 플러그인 만들기 및 위젯화



워드프레스 플러그인 만들기

위젯 만들기

슬라이더 위젯을 사이드바에 배치하기

플러그인 패키지 만들기

캐러젤 슬라이더의 외부 플러그인



- 09: 기타 페이지, 푸터 만들기



고객 1:1 질문 페이지, 찾아오는 길 페이지 만들기

푸터 만들기



- 10: 인터넷 익스플로러 스타일시트 수정



전면 페이지

상세 페이지



[3장] 디테일



- 01: 상세 페이지 옵션 추가하기



고급 사용자 정의 필드 플러그인 사용하기

사용자 정의 필드 만들기

옵션 데이터 불러오기

필드그룹 내보내기



- 02: 상품 카테고리 메뉴 사용하기



- 03: 이미지 그림자효과 수정하기



- 04: 로그인/회원가입 버튼 만들기



- 05: 소셜 로그인 사용하기



- 06: 떠다니는 배너 설치하기



- 07: 상품 상세 페이지에 고정 콘텐츠 삽입하기



- 08: 상점 페이지 수정하기



알림메시지 박스 만들기

드롭다운 선택박스의 디자인 변경하기

가격필터 추가하기



- 09: 장바구니 버튼 수정하기



- 10: 장바구니 버튼과 위시리스트 버튼 나란히 배치하기



- 11: 장바구니 버튼을 바로구매 버튼으로 변경하기



- 12: 상세 페이지 하단에 다음상품, 이전상품 표시하기



- 13: 그룹상품 스타일 수정



- 14: 이메일 템플릿 편집하기



- 15: 비비프레스를 이용한 Q&A 게시판 만들기



- 16: 메뉴바 수정하기



- 17: 메가 메뉴 만들기



두 개의 헤더 사용하기

두 개의 헤더 메뉴, 카테고리 메뉴 등록하기

메뉴의 배치

레이아웃 수정

제이쿼리 스크립트 만들기

서브메뉴 배치

메가 메뉴에 슬라이더 추가하기



- 18: 로컬호스트에서 웹호스트로 워드프레스 이전하기



데이터베이스 파일 백업하기

Search Replace DB 프로그램 내려받기

워드프레스 전체 파일 업로드 및 파일 편집하기

데이터베이스 파일 업로드하기

데이터베이스 파일 수정하기

내 컴퓨터에서 실험하기

김덕기 저자 김덕기는 금융기관 퇴직 후 평소 열망하던 웹디자인에 입문해 포토샵, CSS, 제이쿼리, 워드프레스 등 웹디자인 관련 지식을 블로그를 통해 공유하며 프리랜서 웹디자이너로 활동 중. 워드프레스 공식 한글 번역가(아이디: martian36)이자 밸리데이터(Validator)로 참여해 워드프레스 한글 번역의 미진함을 업데이트하고 필수 플러그인 번역하고 있으며, 티스토리 블로그를 운영 중이다. 최근에 『워드프레스 완벽 입문』과 『트위터 부트스트랩』을 출간했다.