C 스토어사용자매뉴얼 2013.12 v3.0
C 스토어란? 어떤서비스죠? C 스토어란쇼핑몰운영에유용한기능을간단히설치하여사용할수있도록다양한어플리케이션 ( 앱 ) 을제공하는온라인상의장터입니다. 배너만들기, 설문조사, SNS 등쇼핑몰에필요한앱을다운받아자유롭게이용하실수있습니다. C 스토어가좋은이유? 원하는기능을바로바로쓸수있다! 내쇼핑몰에사용하고싶었던기능이있는데어떻게만드는지몰라서망설이셨다고요? C 스토어에서원하는기능의앱을찾아보세요. 스마트폰앱처럼설치만하면내쇼핑몰에바로적용해서사용할수있습니다. 전문가가아니어도좋다! 복잡한프로그래밍언어를몰라도좋습니다. 설치한앱을쇼핑몰화면에보여주고싶을때, 내가원하는곳에넣을수있습니다. 스마트디자인편집창에서원하는위치에소스만추가해주면됩니다. 내쇼핑몰이달라진다! 앱의스킨은모두 css 로제작되었습니다. 따라서 css 만변경하면나만의스킨을만들어사용하실수있습니다. ( 단, 스킨자체를제공하지않는앱도있습니다. 예 - 페이스북코멘트 )
목차 Chapter 1. C 스토어사용법 1-1. C 스토어간단사용법 1-2. C 스토어시작하기 1-3. 앱구매하기 (1~8) Chapter 2. 메뉴설명 2-1. 메인화면 2-2. 전체앱목록 2-3. 마이앱 2-4. 구매신청내역 2-5. 공지사항 2-6. 자주하는질문 Chapter 3. 내쇼핑몰에앱적용하기 3-1. 자동으로적용하기 3-2. 모듈샘플로적용하기 3-3. 수동으로적용하기 3-4. 샘플소스복사하기 Chapter 4. 앱활용예시 4-1. 활용예시 1 4-2. 활용예시 2 3
Chapter 1. C 스토어사용법 4
1-1 C 스토어간단사용법 C 스토어의앱을내쇼핑몰에적용하는방법은간단합니다! 쇼핑몰에필요한기능을찾아설치한후쇼핑몰에바로적용하여사용하실수있습니다. * C 스토어앱은웹에적용하는웹쇼핑몰전용어플리케이션입니다. 모바일에는설치가불가능하니착오없으시길바랍니다. 1 2 3 4 5 C 스토어시작하기이용약관동의 앱선택 앱설치 앱관리 앱노출 소스위치설정 Step 1. 시작하기 : 쇼핑몰어드민화면의상단에서 [C스토어] 메뉴를클릭합니다. 이용약관에동의하면 C스토어를사용하실수있습니다. Step 2. 앱선택 : 좌측의 [ 전체앱목록 ] 에서내쇼핑몰에사용하고싶은기능의앱을선택하여 구매하기 버튼을클릭합니다. Step 3. 앱설치 : 결제가완료되면앱이자동설치됩니다. 설치가완료된모든앱들은 [ 마이앱 ] 메뉴에서찾아볼수있습니다. Step 4. 앱관리 : [ 마이앱 ] 메뉴에서 관리하기 버튼을클릭하고해당앱을사용하는데필요한내용을입력해줍니다. Step 5. 앱노출 : [ 디자인적용하기 ] 를사용해쇼핑몰화면에앱이들어갈위치를설정하면해당위치에앱이노출됩니다.
1-2. C 스토어시작하기 a 스마트디자인 을사용해야만 C 스토어를정상적으로이용하실수있습니다. 반드시 스마트디자인 으로변경하여설치해주세요. 1. C 스토어를사용하려면쇼핑몰어 드민상단메뉴에서 C 스토어 (a) 로 이동합니다. 2. C스토어를처음사용하시는경우 C스토어이용약관에동의합니다 (b) 에체크한후 C스토어시작하기 버튼 (c) 을누르면 C스토어를사용하실수있습니다. ( 이용약관에동의하시기전에약관보기 > 를클릭하여 C 스토어이용약관을읽어보시기바랍니다.) b c
1-3 앱구매하기 (1/7) 1. C 스토어이용약관에동의하면 C 스 토어메인화면이보여집니다. 2. 사용하고자하는앱을선택한후 구매하기 (a) 버튼을클릭합니다. a
1-3 앱구매하기 (2/7) 신청옵션선택 1. 사용하고자하는 신청기간 (a) 을선택합니다. ( 무료앱의경우신청기간은 1개월단위자동연장 (30일) 으로자동체크됩니다.) 2. 선택하신기간에대한 총결제금 액 (a) 을확인합니다. a 3. 기간선택과금액확인이완료되면 구매신청 (b) 버튼을클릭합니다. b
1-3 앱구매하기 (3/7) 신청내역확인 1. 신청내역을확인한후 결제하기 (a) 버튼을클릭합니다. ( 무료앱의경우, 결제하기버튼을누르시면신청완료페이지로바로이동합니다.) 2. 신청기간수정이필요하다면 < 신 청옵션다시선택 (b) 을클릭하여 이전화면으로이동합니다. b a
1-3 앱구매하기 (4/7) a 결제수단선택 1. 신용카드로결제를원하시면결제수단에서신용카드 (a) 를선택하신후결제하기를클릭하세요. ( 신용카드결제절차에따라결제를완료하시면앱설치단계로이동합니다.) 2. 무통장입금을원하시면무통장입금 (b) 을선택하시고입금자명을입력하세요. 입금은행및계좌번호를확하시고결제하기를클릭합니다. ( 무통장입금선택시입급완료가확인되어야앱설치가가능합니다.) b 입금확인안내무통장입금확인은입금후 1~2일이내로확인됩니다. 주문시입력한입금자명과실제입금자의성명이반드시일치하여야하며, 입금자명이다를경우입금확인이지연되오니유의해주세요.
1-3 앱구매하기 (5/7) 입금대기상태 1. 무통장입금결제선택시, 무통장입금이완료되기전까지결제상태가 입금대기 (a) 상태로확인됩니다. ( 무통장입금계좌, 우리은행 382-183756-13-008 심플렉스인터넷 로결제금을입금하시면결제가완료됩니다.) 2. 구매 / 신쳥내역 (b) 에서구매내역 및결제상태를확인할수있습니다. a ( 구매 / 신청내역에관한보다자세한 사항은본매뉴얼 25~26 페이지에 서확인하실수있습니다.) b
1-3 앱구매하기 (6/7) 입급대기상태 1. 무통장입금대기중인앱은전체앱 목록에서 입금대기 (a) 상태로확인 됩니다. a 2. 무통장입금이완료되면앱이자동으로설치되어따로앱을설치하실필요가없습니다. 설치가완료된앱은앱목록에서 설치완료 로표시되고 설치완료 (b) 버튼을클릭하면앱설치완료화면을이동합니다. b
1-3 앱구매하기 (7/7) 앱설치완료 1. 전체앱목록에서 설치완료 버튼을클릭하여이동한앱설치완료화면서는설치한앱의설치정보를확인할수있습니다. 2. 설정값을입력해야사용가능한앱의경우페이지하단의 관리하기 (a) 버튼을이용하여관리하기화면으로이동합니다. 3. 설치된앱의위치나스킨을변경하려면디자인편집하기 (b) 로이동합니다. a 4. 멀티쇼핑몰을이용중일경우, 사용중이다른쇼핑몰디자인에앱을적용할수있습니다. 전체소스복사 (c) 를클릭하여기본샘플을복사한후원하는쇼핑몰에붙여넣기하여사용하실수있습니다. ( 앱스킨또는위치변경, 소스복사및붙여넣기에대한자세한사항은 Chapter 3을참고하세요.) b c
Chapter 2. 메뉴설명 14
2-1. 메인화면 메인화면 C 스토어시작하기에동의하면각메뉴에접근이가능합니다. 최근등록된신규앱, 인기앱등을바로확인하고원하는앱을검색할수있습니다.
2-2. 전체앱목록 전체앱목록 a b C 스토어에등록된모든앱을리스트업합니다. a 카테고리 : 전체, 마케팅, 정보 / 편의기능등의카테고리별로등록된앱을찾아볼수있습니다. b 앱검색 : 인기순, 추천순, 최신순, 가나다순으로검색할수있으며, 원하는키워드검색이가능합니다
2-3-1. 마이앱 (1/3) a b 마이앱 지금까지설치된모든앱을확인할수있습니다. a 전체 : 설치한모든앱목록을확인할수있습니다. 유료또는무료앱만따로구분하여확인할수도있습니다. 활성앱 : 활성화화기 로설정된앱목록을확인할수있습니다. 비활성앱 : 비활성화하기 로설정된앱목록을확인할수있습니다. 비활성화상태인앱도 관리하기 를사용할수있습니다. 업그레이드 : 업그레이드가필요한앱을확인할수있습니다. 만료예정앱 : 사용기간만료 15 일전부터만료예정인앱목록을확인할수있습니다. 만료앱 : 사용기간이만료된앱목록을확인할수있습니다. b 만료알림설정하기 : 사용중인앱의만료알림을설정할수있습니다. 부가서비스의만료안내설정과동일한정보를입력하면됩니다. 단, 이곳에서변경하면부가서비스알람연락처도함께변경되니주의하세요.
2-3-1. 마이앱 (2/3) 마이앱 a 활성화하기 : 앱을사용하려면활성화하기를설정해야합니다. 설정하면좌측앱아이콘에체크가표시되고, 쇼핑몰화면에앱이노출됩니다. a b c b 비활성화하기 : 앱을사용하지않으려면비활성화기를설정합니다. 설정하면쇼핑몰에앱이표시되지않습니다. c 관리하기 : 앱의상세설정화면으로이동합니다. ( 앱관리화면은설치한앱에따라다릅니다 ) d e d 연장하기 : [ 연장하기 ] 버튼을누르면앱연장하기화면으로이동합니다. 구매하기와마찬가지로사용기간과추가옵션을선택하여결제를진행할수있습니다. ( 옵션추가하기에관한자세한사항은 20 페이지를참고하세요.) e 옵션추가하기 : [ 옵션추가하기 ] 버튼을누르면앱옵션추가하기화면으로이동합니다. 앱의이용기간중에옵션만추가로선택하여결제할수있습니다. ( 옵션추가하기에관한자세한사항은 21 페이지를참고하세요.)
2-3-1. 마이앱 (3/3) 마이앱 a a Upgrade( 업그레이드 ) : 앱을설치한이후에기능이추가되거나버그가수정되어새버전이나올수있습니다. 이런경우앱명옆에 Upgrade 버튼이노출됩니다. Upgrade 버튼을클릭하면어떤기능이개선되었는지변경사항이팝업으로나타납니다. 내용확인후, 업그레이드가필요한경우에만업그레이드를진행합니다. 업그레이드하지않아도, 앱을사용하는것은전혀문제되지않습니다. 앱을업그레이드하더라도, 내쇼핑몰디자인에복사된샘플파일 (HTML, CSS 등 ) 은수정되지않습니다. 업그레이드기능을쇼핑몰화면에사용하려면 샘플소스보기 > 전체소스복사 를통해서샘플파일을새로복사하세요.
2-3-2. 마이앱 - 앱연장하기 앱연장하기 마이앱혹은앱매니저에서 [ 연장하기 ] 버튼을누르면앱의사용기간을연장하는연장프로세스가시작됩니다. 앱구매하기와마찬가지로사용기간과추가옵션을선택하여결제를진행합니다. 결제가완료되거나입금이완료되면, 앱사용기간이연장됩니다.
2-3-3. 마이앱 앱오션추가하기 앱옵션추가하기 마이앱혹은앱매니저에서 [ 옵션추가하기 ] 버튼을누르면앱의이용기간중에옵션만추가로선택하여결제할수있습니다. 추가할옵션을선택하면앱의남은기간에맞게자동으로금액이산정됩니다. 결제가완료되거나입금이완료되면, 옵션추가가완료되어추가한옵션사용이가능합니다.
2-3-4. 마이앱 앱매니저 (1/2) 앱매니저 a b c 구매한앱의관리하기화면으로이동하면화면상단에앱매니저가노출됩니다. 앱관리에관한다양한기능과정보를한곳에서확인할수있어편리합니다. a 앱상세보기 : 버튼을클릭하면앱상세화면으로이동합니다. b 디자인적용하기 자동적용 : 멀티쇼핑몰사용시원하는쇼핑몰스킨에해당앱을자동적용시킬수있습니다. 수동적용 : 디자인편집창을이용하여쇼핑몰의원하는위치에앱을넣을수있습니다. 먼저앱의샘플소스를복사한후원하는위치붙여넣기하시면됩니다. 고급적용 : 제공되는코드리스트를이용하여원하는대로직접디자인할수있습니다. 샘플소스복사 : 앱의샘플소스전체를선택된쇼핑몰디자인스킨에복사할수있습니다. ( 소스를복사하기전에백업하지않은소스파일은복구할수없으니주의해주시기바랍니다.) c 미리보기 : 앱을적요한쇼핑몰화면을미리볼수있습니다.
2-3-4. 마이앱 앱매니저 (2/2) 앱매니저 d e f a 연장하기 : 유료앱의경우연장하기버튼이노출됩니다. 버튼을클릭하면앱연장하기화면으로이동합니다. b 옵션추가하기 : 유료앱의경우옵션추가하기버튼이노출됩니다. 버튼을클릭하면옵션추가하기화면으로이동합니다. c 업그레이드하기 : 앱을설치한이후에기능이추가되거나버그가수정되어새버전이나올수있습니다. 이런경우앱명옆에 Upgrade 버튼이노출됩니다. Upgrade 버튼을클릭하면어떤기능이개선되었는지변경사항이팝업으로나타납니다. 내용확인후, 업그레이드가필요한경우에만업그레이드를진행합니다. 업그레이드하지않아도, 앱을사용하는것은전혀문제되지않습니다. 앱을업그레이드하더라도, 내쇼핑몰디자인에복사된샘플파일 (HTML, CSS 등 ) 은수정되지않습니다. 업그레이드기능을쇼핑몰화면에사용하려면 샘플소스보기 > 전체소스복사 를통해서샘플파일을새로복사하세요.
2-4. 구매신청내역 (1/2) 구매신청내역 지금까지신청한앱구매내역을확인할수있습니다. a a 구매신청내역검색 : 결제상태, 신청기간, 결제수단으로검색이가능하며앱명을입력하여검색할수도있습니다. b 구매신청내역 : 지금까지의구매신청내역을모두나열합니다. 구매번호순으로정렬되며, 결제상태, 신청일, 이용기간등을한눈에확인할수있습니다. b
2-4. 구매신청내역 (2/2) 구매신청내역 a 영수증발급 : 구매신청내역에서무통장입금의입금완료인경우 [ 영수증발급 ] 버튼을누르면영수증을발급받으실수있습니다. 단, 카페 24 자체개발앱인경우에만 http://tax.cafe24.com 에서영수증을신청할수있습니다. b 입금계좌정보 : 클릭시무통장입금계좌정보를확인할수있습니다. c 결제상태 a b c = 입금대기 : 결제수단을무통장입금으로선택하는경우, 입금이완료되기전까지입금대기상태로표시됩니다. = 입금취소 : 입금대기중인건에대해 취소하기버튼 을눌러입금을취소한경우입금취소상태로표시됩니다. = 입금완료 : 무통장입금으로진행한경우, 실제입금확인이된순간부터입금완료상태로표시됩니다. = 무료 : 무료앱의경우결제상태가무료로표시됩니다.
2-5. 공지사항 a 공지사항 C 스토어서비스에대한다양한공지사항을확인할수있습니다. b a 제목 / 내용 : 제목또는내용을입력하여공지사항을검색할수있습니다. b 공지사항제목을클릭하면자세한내용을확인할수있습니다.
2-6. 자주하는질문 자주하는질문 C 스토어서비스에대해자주일어날수있는질문과대답을확인할수있습니다.
Chapter 3. 내쇼핑몰에앱적용하기 28
3-1. 자동으로적용하기 자동으로적용하기 1 쇼핑몰의스킨을선택한후적용하기버튼을누르면바로적용이가능한위치에앱을자동으로넣어주므로, 추가작업없이쇼핑몰화면에앱이바로보여집니다. 2 1 [ 마이앱 ] 의앱목록에서쇼핑몰에적용하고자하는앱의 관리하기 버튼을클릭하면앱의설정화면으로이동합니다. 설정화면상단의앱매니저영역에서 디자인적용하기 버튼을클릭합니다. 3 2 [ 디자인적용하기 ] 메뉴가팝업으로열리면 [ 자동적용 ] 탭에서자동적용이가능한쇼핑몰스킨목록이보여집니다. ( 자동적용이불가능한앱의경유해당탭이노출되지않습니다.) 3 자동으로앱을적용하고자하는스킨의 앱자동적용 버튼을클릭하면앱적용이완료됩니다. ( 앱을자동적용할경우, 자동적용하면서샘플소스가동시에복사되므로샘플소스를따로복사하시지않아도됩니다.)
3-2. 모듈샘플로적용하기 (1/4) 모듈샘플로적용하기 1 2 디자인편집창에서원하는앱을찾아원하는위치에넣을수있습니다. 단, 적용하려는쇼핑몰디자인에반드시샘플소스가복사되어있어야합니다. ( 샘플소스복사하기는 37 페이지를참조하세요.) 1 앱매니저영역에서 디자인적용하기 버튼을클릭합니다. 2 [ 디자인적용하기 ] 메뉴가팝업으로열리면 [ 수동적용 ] 탭을클릭합니다. 3 [ 수동적용 ] 화면하단에노출되는 디자인편집창열기 버튼을클릭하여디자인편집창을열어줍니다. 3
3-2. 모듈샘플로적용하기 (2/4) 모듈샘플로적용하기 1 스마트디자인편집창을열어, 앱을적용할영역근처의모듈을선택해 편집 버튼을클릭합니다. ( 선택된모듈을기준으로해당모듈의위쪽이나아래쪽에앱을추가하거나해당모듈과변경하여앱을넣을수있습니다.) 1
3-2. 모듈샘플로적용하기 (3/4) 모듈샘플로적용하기 1 [ 모듈편집 ] 메뉴로이동합니다. 2 모듈선택에서 [ 전체모듈 ] 탭을선택합니다 3 모듈목록에서사용하고자하는앱을선택합니다. 1 2 4 선택한앱을추가할위치를선택해줍니다. ( 현재편집창에서선택된모듈을기준으로해당모듈의위쪽이나아래쪽에추가하거나해당모듈과변경하여넣을수있습니다.) 3 5 마지막으로 적용 버튼을클릭하면쇼핑몰화면에앱이적용됩니다. 4 5
3-2. 모듈샘플로적용하기 (4/4) 2 1 모듈샘플로적용하기 1 편집창 미리보기 를통해앱이적용된쇼핑몰화면을미리확인할수있습니다. 2 저장 버튼을눌러수정내역을저장하면, 쇼핑몰화면에앱이노출됩니다.
3-2. 수동으로적용하기 (1/3) 수동으로적용하기 1 2 제공되는소스를복사하여원하는위치에붙여넣기할수있습니다. 단, 적용하려는쇼핑몰디자인에반드시샘플소스가복사되어있어야합니다. ( 샘플소스복사하기는 37 페이지를참조하세요.) 1 앱매니저영역에서 디자인적용하기 버튼을클릭합니다. 2 [ 디자인적용하기 ] 메뉴가팝업으로열리면 [ 수동적용 ] 탭을클릭합니다. 3 Ctrl+ c 3 [ 수동적용 ] 화면하단에노출되는소스창에서소스를선택하여복사합니다. 4 디자인편집창열기 버튼을클릭하여디자인편집창을열어줍니다. 4
3-2. 수동으로적용하기 (2/3) 수동으로적용하기 1 스마트디자인편집창을열어, 앱을적용할위치에복사한소스를붙여넣기합니다. 1 Ctrl+ v
3-2. 수동으로적용하기 (3/3) 2 1 수동으로적용하기 1 편집창 미리보기 를통해앱이적용된쇼핑몰화면을미리확인할수있습니다. 2 저장 버튼을눌러수정내역을저장하면, 쇼핑몰화면에앱이노출됩니다.
3-3. 샘플소스복사하기 샘플소스복사하기 1 디자인편집창을이용하여쇼핑몰화면에앱을추가하려면, 적용하려는쇼핑몰디자인에반드시샘플소스가복사되어있어야합니다. 아래와같은방법으로앱의샘플소스를복사할수있습니다. 2 1 앱매니저영역에서 디자인적용하기 버튼을클릭합니다. 3 2 3 [ 디자인적용하기 ] 메뉴가팝업으로열리면 [ 샘플소스복사 ] 탭을선택합니다. 샘플소스복사현황에쇼핑몰디자인목록이노출됩니다. ( 이미샘플이복사된디자인의경우가장최근진행된복사날짜가표시됩니다.) 4 4 샘플소스를처음또는새로복사하고자하는쇼핑몰디자인을선택한후 전체소스복사 버튼을클릭하면소스가복사됩니다. ( 복사시디자인별로복사성공여부를반드시확인합니다.)
Chapter 4. 앱활용예시 38
4-1. 활용예시 1 포토슬라이드 v2 포토슬라이드 v2 앱은여러상품및이벤트이미지를슬라이드형태로보여줍니다. 쇼핑몰방문자가슬라이드이미지를클릭하면해당링크를연결합니다. < 사용방법 > 1. [ 마이앱 ] 에서포토슬라이드 v2 앱의 관리하기 버튼을클릭하여포토슬라이드 v2 설정화면으로이동합니다. 2. 슬라이드등록 버튼을클릭하여슬라이드를등록합니다. 슬라이드정보를입력하고, 슬라이드에넣을포토를등록한후슬라이드노출순서를설정하면슬라이드등록이완료됩니다. 3. 디자인편집창에서포토슬라이드가들어갈위치를지정해주면쇼핑몰에포토슬라이드가나타납니다. 4. 1~3 번을반복하면여러개의포토슬라이드를만들어진열할수있습니다.
4-2. 활용예시 2 쇼핑룸 다똑같은상품진열에서벗어나, 상품성격에따라개성있게진열할수있습니다. < 사용방법 > 1. [ 마이앱 ] 에서쇼핑몰앱의 관리하기 버튼을클릭하여쇼핑몰설정화면으로이동합니다. 2. 쇼핑물등록 버튼을클릭하여쇼핑룸제목을입력하고배경이되는이미지를선택하여업로드합니다. 3. 쇼핑룸에서진열할상품을선택합니다 4. 쇼핑룸배경이미지위에상품을배치합니다. 5. 쇼핑룸을저장하면쇼핑룸이등록됩니다. 6. 앱설정화면상단의앱매니저영역에서미리보기기능을통해앱이쇼핑몰에적용된화면을미리확인할수있습니다. 7. 1~5 번을반복하면여러개의쇼핑룸으로상품을진열할수있습니다.