쇼핑몰 솔루션_디자인관리1(카페24)

 

 

이번 포스팅은 쇼핑몰솔루션인 카페24의 디자인관리에 대한 내용입니다.

 

카페 24 솔루션의 관리자모드에는 스마트모드와 프로모드 2가지가 있는데, 자세한 디자인관리에 대한 내용을 다루기 위해서는, 프로모드를 사용해야하기 때문에 프로모드에서의 디자인관리에 대해서 포스팅하겠습니다.

 

카페24의 디자인관리 모드중에서도, 드레그앤 드롭의 블럭형 스타일로 디자인 수정을 하는 에디봇 디자인과, html코드 자체를 수정하는 스마트디자인, 2가지 종류가 있습니다.

 

카페24의 쇼핑몰솔루션은 매출에 도움이 되고, 쇼핑몰 기능 업그레이드를 위한 무료앱을 디자인에 많이 적용할 수 있는데, 완벽하게 에디봇 디자인에 연동이 되지 않을 경우, 스마트디자인 모드로 전환하는 것에 대한 부담을 갖지 않아도 됩니다. 왜냐하면, 버튼 하나면 바로 모드가 전환되기 때문입니다.

 

 

코딩을 잘 모르는 분들이라면, 무조건 에디봇 디자인 모드를 사용해야 합니다.

 

왜냐하면, 스마트디자인의 편집창이 다른, 쇼핑몰솔루션들의 편집창보다는 굉장히 효율적이고 편리하게 사용할 수 있도록 되어 있지만, 반드시 어느정도의 코딩 지식이 있는 전문인력 관리자가 있어야, 제대로된 사용이 가능하기 때문입니다.

 

 

모든 쇼핑몰솔루션의 코딩 쏘스에는, 웹화면에 바로 표현되는 프론트엔드에 해당하는 html과 css, 자바스크립트 이외에, 백엔드에 해당하는 다른 프로그래밍 언어인 php나, jsp, asp등등으로 이루어져 있습니다.

 

그래서, 디자인수정을 html편집창에서 직접 할때는, 다른 백엔드 언어의 코드가 연결되어 있는 부분이 있다는 것을 유념해 두고 편집을 해야 합니다.

 

필자는 다른 솔루션에 비해서 카페24를 가장 선호하고, 많이 다루어 보았기 때문에 언젠가는 매우 자세한 디자인 편집에 대한 내용을 포스팅 하려고 합니다.

 

이번편에서는, 대략적인 카페24의 디자인관리에 대한 내용만 다루도록 하겠습니다.

 

     카페24     

 

▶카페24 관리자페이지 경로(디자인관리)

카페24 쇼핑몰솔루션의 관리자페이지 상단메뉴에서 디자인관리 버튼을 클릭하면, 아래의 이미지와 같은 화면이 보여집니다. 현재 어떤 스킨을 대표디자인으로 사용중인지를 알 수 있고, 사용중인 스킨이 반응형인지의 여부와 카페24에서 제공하는 디자인관련 공지내용을 알 수 있습니다.

 

▶카페24 관리자페이지 경로(디자인관리 > 디자인 수정하기)

디자인관리 버튼을 클릭하고, 바로 보이는 디자인 수정하기 버튼을 클릭하면, 쇼핑몰의 대표디자인 스킨의 html코딩을 수정 할 수 있는 편집창이 아래의 이미지처럼 팝업으로 보여집니다. 필자의 경험상 그어떤 솔루션보다 굉장히 사용하기 편리하고, 효율적으로 되어있다는 점을 강조하고 싶습니다. 물론 개인적인 의견입니다. 다른 쇼핑몰솔루션의 디자인편집창에서의 불편함을 겪고 있을때, 이미 카페24는 편집창 자체가 사용자에게 편리하게 되어 있었습니다.

 

 

그래서, 카페24 디자인수정 편집창의 장점을, 한마디로 요약하자면, 편집하는 시간이 다른 솔루션에 비해서 적다는 점입니다. 쇼핑몰 관련된 일을 하다보면, 자연적으로 알게 되는 점이지만, 이런 시간절약이 관리자 입장에서는 상당히 피로도를 줄여줍니다.

 

카페24의 디자인편집은 아주 예전에 테이블코딩이 기본이던 시절에서, div코딩이 기본틀인 스마트디자인으로 전환된 이후로는 계속 너무 마음에 들었기 때문에, 솔직히 매우 편애합니다.

 

카페24의 디자인편집만 사용해 보았을 때에는 장점을 잘 모르다가, 다른 솔루션들의 디자인편집을 사용해 보았을때 더더욱 장점이 와닿았습니다.

 

▶카페24 관리자페이지 경로(디자인관리 > 디자인 보관함)

디자인 관리의 디자인 보관함 메뉴에서는, 쇼핑몰에서 사용하고 있거나, 보관하고 있는 스킨의 목록을 확인하고, 관리할 수 있습니다.

 

어떤 언어의 쇼핑몰스킨인지, 스마트디자인모드인지, 에디봇 모드인지를 한눈에 확인 할 수 있습니다.

 

스킨이름을 수정하기 위해서는, 스킨이름 옆의 수정버튼을 클릭하면 됩니다.

 

스킨의 URL을 클릭하면, 스킨이 적용된 쇼핑몰 화면을 확인할 수 있습니다.

 

디자인 편집의 수정버튼을 클릭하면, 디자인을 편집할 수 있는 팝업창이 보여지는데, 스마트디자인 모드에서는 위의 이미지와 같은 화면으로 나오고, 에디봇 모드에서는 에디봇 편집창이 보여집니다.

 

에디봇 모드에서 스마트디자인 모드로 전환하고 싶을 경우에는, 스마트디자인으로 전환 버튼을 클릭하면 됩니다.

 

▶카페24 관리자페이지 경로(디자인관리 > 디자인 보관함 > 에디봇모드의 스킨 > 수정)

에디봇 스킨의 수정버튼을 클릭했을 경우에는 아래와 같은 블럭형 디자인 편집창이 보여집니다.

 

기본적으로 스마트디자인 편집창과 에디봇 모드의 편집창에서는 로그인전과 후로 나누어서 코딩이 가능하며, 가장중요한 것은 미리보기가 된다는 점입니다.

 

그리고, 너무나 당연한 것이지만, 모바일모드와 pc모드의 디자인을 미리 확인하면서, 수정할 수 있습니다.

 

에디봇과 스마트 디자인 편집창 모두, 쇼핑몰의 페이지별로 수정 할 수 있습니다.

 

▶카페24 관리자페이지 경로(디자인관리 > 디자인 추가)

디자인 추가 메뉴에서는, 새로운 쇼핑몰 스킨 디자인을 추가 할 수 있습니다.

 

무료와 유료의 다양한 스킨을 확인 할 수 있으며, 업종의 카테고리별로 스킨을 찾을 수 있습니다.

 

오른쪽에는 스킨의 레이아웃과 최신, 인기, 가격순으로 스킨을 검색할 수 있게 되어 있습니다.

 

이 곳에서 마음에 드는 스킨을 찾지 못하였다면, 카페24의 디자인센터로 가서 직접 스킨을 선택후 구매할 수 있습니다.

 

카페24의 디자인센터의 경로는 아래와 같습니다.

(d.cafe24.com/product/product_shoppingmall_list.php?listType=season2)

 

▶카페24 관리자페이지 경로(디자인관리 > 디자인 추가 > 스킨썸네일 클릭)

디자인추가에서 스킨의 썸네일 중에서, 글로벌패키지라는 아이콘이 붙어 있는 것이 있습니다.

 

 

이 썸네일을 클릭하면, 스킨의 제작 언어와, 디자인이 적용된 사이트와, 제일 중요한 내 쇼핑몰에 스킨을 추가 할 수 있는, 디자인 추가 버튼이 나옵니다.

 

디자인 추가 버튼을 클릭하면, 디자인 보관함에 스킨 디자인이 추가되서 보여집니다.

 

▶카페24 관리자페이지 경로(디자인관리 > 디자인 백업·복구 > 디자인백업)

디자인 백업·복구 메뉴에서는, 쇼핑몰의 디자인 스킨을 백업하고 복구할 수 있습니다.

 

백업하고 싶은 스킨을 선택하고, 백업하기 버튼을 클릭하면, 백업이 됩니다.

 

▶카페24 관리자페이지 경로(디자인관리 > 디자인 백업·복구 > 디자인복구)

디자인 백업.복구의 디자인 복구탭에서는, 백업한 스킨의 디자인파일을 다운로드 할 수 있으며, 복구를 여기서 진행 합니다.

 

복구 기능은, 스킨의 많은 수정을 어느 시점으로 되돌리고 싶을때 많이 사용합니다.

 

컴퓨터에 저장해 놓은 파일이 있다면, 내 컴퓨터에서 복구 버튼을 클릭해서 파일을 적용하면, 됩니다.

 

백업방식에는 카페24에서 주기적으로 알아서 해주는 자동과, 사용자가 직접 하는 수동방식이 있습니다.

 

 

* 내용이 너무 길어지는 관계로, 카페24의 디자인관리는 다음편에 또, 다루도록 하겠습니다.

 

궁금한 것이 있으신 분들은 댓글에 남겨주세요.