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

사이트 이미지
쇼핑몰

남성의류 정기결제 쇼핑몰

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

사이트 이미지
웹사이트

회원관리 사이트

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

사이트 이미지
쇼핑몰

면도기 정기결제 쇼핑몰

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

사이트 이미지
쇼핑몰

해외 쇼핑몰

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

사이트 이미지
쇼핑몰

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

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

포트폴리오 보기

블로그 인기글

커스텀 디자인

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

Brizy Pro

페이지 빌더

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

Elementor Pro

페이지 빌더

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

Advanced Custom Field Pro

사용자 정의 필드

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

Pods

사용자 정의 콘텐츠 타입

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

블로그

최근 제작중인 우커머스 쇼핑몰 사이트에 사용중인 씸포레스트 테마를 소개합니다. 필자는 워드프레스 사이트 제작시 가능하면 최근에 나온 테마를 사용하려고 합니다. 신기술이나 새로운 기능이 추가되기 때문이죠. 인기가 있더라도 오래된 테마는 이러한 신기술을 적용하거나 새로운 기능이 추가되기 어렵기 때문입니다. 씸포레스트에 수시로 접속해 새로운 테마중에서 인기 있는 테마를 선택해 인기가 있는 이유를 파악해보고 새로운 프로젝트에 사용하려고 합니다. 


최근에 고객으로부터 의뢰받은 쇼핑몰은 호주에서 오픈하려는 휴대폰 악세서리 쇼핑몰입니다. 이 사이트에 사용한 테마는 니트로(Nitro)라는 우커머스 전용 테마입니다.


바로가기



출시된 것은 2016년 9월 16일로 아주 새로운 테마입니다. 필자의 경우 새로운 테마는 3개월 이상은 지나야 사용하기 좋다는 생각입니다. 왜냐하면 어떤 테마는 보기에는 좋더라도 실제 사용해보면 여러 가지 버그가 있기 때문입니다. 테마 개발자들이 완벽한 상태에서 출시하는 것이 아니라 우선 출시한 후에 버그 리포트를 통해 계속 수정하면서 업데이트 합니다. 이러한 버그는 실제 사용해본 사용자들이 아니면 찾아내기 어렵죠. 그러면서 좀 더 완벽한 테마로 만들어집니다. 



이 테마도 마찬가지여서 몇 가지 버그가 발견되며 수정해가면서 사이트를 만들고 있습니다. 그러면 이 테마가 다른 테마와 다른 점에 대해 알아보겠습니다.



1. 바로구매(Buy Now) 버튼 기능



지금까지 워드프레스 쇼핑몰 테마중에서 바로구매(Buy Now) 버튼 기능이 있는 테마는 아마도 이 테마가 처음이지 않을까 생각합니다. 바로구매 기능은 한국 쇼핑몰에서 많이 사용하는 것이고 해외에서는 이 기능이 거의 없고 추가하려면 플러그인을 추가해야 하고 이 플러그인도 한동안 없다가 무료 플러그인으로 나타난지 얼마 되지 않습니다. 


상품 옵션을 모두 선택하면 바로구매 버튼이 클릭할 수 있는 상태가 되고 클릭하면 결제 페이지로 이동하지 않고 팝업창으로 나타나며 말 그대로 바로구매가 가능합니다.



2. 닌자 팝업(Ninja Popup) 번들 플러그인 추가



닌자 팝업은 유료 플러그인으로 씸포레스트 사이트에서 가장 인기 있는 플러그인 중 하나입니다. 현재까지 23천여개가 판매됐습니다. 이 플러그인을 사용하면 다양한 팝업을 만들 수 있습니다. 개발자들에게는 모달(Modal)이라고 하죠.



3. 사이즈 가이드(Size Guide) 



사이즈 가이드는 의류나 신발 상품에서 필수요소죠. 별도의 글 타입에서 원하는 사이즈 가이드를 만들고 카테고리별로 나타나게 할 수 있습니다. 



4. 사용자정의 속성 기능(Product Custom Attribute)



우커머스는 상품 옵션선택에서 기본적으로 드롭다운이나 텍스트를 지원하지만 이 테마는 컬러피커, 이미지 선택, 텍스트 레이블 등 3가지를 추가할 수 있습니다. 다른 테마에서 이 기능을 사용하려면 별도의 플러그인을 추가해야 합니다.



5. 상품 매퍼(Product Mapper)



상품 이미지에 링크를 추가할 수 있고 이를 글이나 페이지 등 어느 곳에나 배치할 수 있습니다.



글에 추가했을 때 플러스 아이콘을 클릭하면 팝업 창이 나타나 상품을 구매하도록 할 수 있습니다.



6. 품절상품 이메일 알림(Product Out of Stock Alert)



품절상품에 대해 단순히 품절이라는 문구가 아닌 입고시 이메일 알림 기능이 있습니다. 



어떤 상품에 구독이 많은지 통계를 파악할 수 있습니다.



7. 헤더 빌더(Header Builder)



사이트 상단의 헤더를 자유롭게 디자인 할 수 있습니다.  모바일 아이콘을 클릭해 모바일 화면의 헤더도 디자인 할 수 있습니다.



8. SNS 공유 할인 기능



상품 페이지, 장바구니 페이지, 결제 페이지에서 3종류의 SNS 공유를 하면 할인 쿠폰을 자동으로 추가할 수 있습니다.





9. 고정 사이드바(Sticky Sidebar)



사이드바를 고정할 수 있으며 스크롤하면서 사이드바는 고정돼 나타납니다. 



10. 장바구니 버튼, 바로구매 버튼 고정


위 그림에서 보이듯이 스크롤해 내려가면 두 가지 버튼을 우측 하단에 고정시킬 수 있습니다.


이상으로 Nitro 테마에 독특한 기능에 대해 알아봤습니다. 다른 테마에도 있는 기능으로서 알아보자면 다음과 같습니다.



11. 메가메뉴



메가메뉴에 상품을 보이도록 할 수 있습니다.



12. 오프 캔버스(Off Canvas) 메뉴



13. 퀵뷰(Quick View)




14. 라이브 검색(Live Search)기능





15. 데모 인스톨러



데모 콘텐츠를 설치하면 이미 있던 콘텐츠는 삭제되지만 이 테마의 특징은 이전의 콘텐츠는 보관하고 있는 상태에서 설치되며 설치한 데모를 제거하면 이전의 콘텐츠가 복구됩니다. 따라서 하나의 테마 설치로 여러 가지 버전의 데모을 테스트 할 수 있습니다. 데모는 12종입니다.



16. 비주얼 컴포저 페이지 빌더



인기있는 페이지 빌더인 비주얼 컴포저가 사용됩니다. 특징은 기존의 이 테마만의 아이콘과 레이아웃을 사용하고 있어서 기존의 비주얼 컴포저를 사용하던 분들은 헷갈릴 수도 있습니다.