Kenna Kenna

StartUP

• [카페24] 디자인 스킨 다운로드 받아 VSCode에서 작업하기

  StartUP/카페24 2023. 9. 20. 12:12

  카페24 디자인스킨 수정 시 자체 에디터로 수정하면 편한 점(0개)도 있지만, 개발을 하다보면 당연히 VSCode로 작업하는 것이 수월하다. 이번에는 sftp를 이용해서 카페24 디자인스킨을 다운받아 업로드 하는 방법을 알아보자 먼저 확인해야 할 것은 - 카페24 ftp 주소 - ftp 아이디와 비밀번호 이다. 이 내용은 여기에서 확인할 수 있다. 그리고 이용할 디렉터리를 만들고, 여기에서 VSCode를 연다. 열린 VSCode 플러그인에서 sftp를 찾아 설치한다. 다양한 플러그인이 나와 있으며 개 중 많은 다운로드 수를 차지한 버전으로 다운받으면 된다. f1키를 눌러 상단에 뜬 입력창에 sftp:config를 클릭한다. 열린 sftp.json 확인하자. { "name": "My Server", "ho..

  Read More
• [Twitter] 트위터 픽셀 설치

  StartUP/GA | Marketing 2023. 3. 17. 16:00

  멜론 머스크놈의 트위터가 갑자기 프로모션에 후해졌다. 돈 때문이겠지? 트위터 전환 추적을 위한 픽셀 설정하기 트위터에서 광고를 집행하였을때 메타에서 제공하는 것처럼 유저의 행동을 추적하여 전환율을 확인할 수 있다. 트위터에서 제공하는 픽셀을 설정하면 되는데 그 과정을 기록해본다. (이전에는 Twitter UWT나 Single Event Tag를 사용했다고 함. 이전에는 아마 공식 대행 업체를 사용해야만 트위터 프로모션을 집행할 수 있었던 것으로 기억) 트위터 픽셀을 생성하기 위해 참고할 문서는 아래와 같다. Conversion tracking for websites Learn about how to add and use conversion tracking for websites with Twitter A..

  Read More
• [카페24] 공급사 미니샵 관련

  StartUP/카페24 2023. 1. 20. 15:47

  공급사 미니샵 파일은 2개 supply 폴더 내 index.html 과 main.html 파일 있음 공급사 아이디가 발급되어야 공급사 페이지를 사용할 수 있다. 루트(URL) 도메인/supply/index.html?supplier_code=공급사코드 도메인/minishop/공급사아이디 두 개 다 사용 설정 (공급사미니샵 사용함/사용안함 은 쇼핑몰관리자 - 공급사 관리 또는 개별 공급사 로그인)은 쇼핑몰 관리자에서 진행함 (관리 페이지 링크) index.html은 모바일에서 연결될 때 열림 main.html은 PC에서 연결될 때 열림 둘 중 하나라도 없으면 PC 또는 모바일에서 안 열림 supply/index.html?supplier_code=공급사코드 루트는 상세페이지 내에 공급사 바로가기버튼 삽입하는 ..

  Read More
• [카페24] 상품 프로모션 기간 타이머처럼 움직이게 하기

  StartUP/카페24 2022. 10. 11. 11:31

  카페24 상품 모듈 중 할인 기간을 보여줄 수 있는 모듈이 있다. 보통의 타임 세일처럼 날짜와 시간을 yyyy-mm-dd hh:mm:ss로 표시해주고 있다. 기간 판매 혹은 공동구매 등에 활용하기 위해 해당 모듈을 상품에 넣어보았는데 카운트다운처럼 초나 분이 줄어드는 것이 보이지 않고 해당 페이지에 접속한 시간을 기준으로 멈춰있다. 그럼 초를 왜 넣어놓은거지... 할인 기간을 좀 더 선명하게 보여주기 위해서 할인 기간을 카운트다운 형식으로 변경해보았다. 우선 상품 detail 페이지나 메인 진열에 아래 변수를 사용해서 표시해주면 상품 등록 - 프로모션에서 설정한 기간을 볼 수 있다. 할인 시작 : {$product_promotion_start_date} 할인 종료 : {$product_promotion_..

  Read More
• [카페24] 카페24 카테고리 코드 분석

  StartUP/카페24 2022. 8. 7. 15:31

  카페24 기능 중 가장 어려웠던 부분이 바로 이 '카테고리' 부분이다. 다른 모듈들은 div나 li를 두 번 반복해서 넣으면 자동으로 반복문이 되거나 변수명이 넣으면 자동으로 통신해서 받아오는 등 스크립트 기능들이 숨겨져 있는데(호스팅을 이용하는 사용자에게 노출되지 않는다는 뜻) 이 카테고리 노출하는 모듈이 거의 유일무이하게 category.js로 바깥 노출이 되어 있다. 내부를 살펴보면 카페24에서 front API라고 부르는 exec/front 주소로 ajax 통신을 진행하고 해당 주소로 들어가보면 쇼핑몰관리자 - 상품 - 상품 분류에서 작업한 카테고리가 depth 없는 JSON으로 노출된다. (카페24를 사용하는 모든 쇼핑몰은 도메인 + /exec/front/Product/SubCategory 를 ..

  Read More
• [카페24] 모디파이어 간략 정리

  StartUP/카페24 2022. 7. 13. 11:34

  인쇄해서 붙여놓을 용도로 간략 정리 문자열 {$변수명|cover:(앞에 감쌀문자, 뒤문자)} 문자열 양 옆을 설정한 특수문자로 감쌈 {$변수명|cut:갯수,...} ellipsis 같은 텍스트 줄임 기능 {$변수명|numberformat} 상품 판매가에 천 단위 쉼표* 치환 {$변수명|replace:a,b,c} a를 b라는 문자로 치환(c는 매치되지 않으면 치환할 문자) {$변수명|imgconv:'url'} 변수를 이미지로 치환 {$변수명|strconv:문자열} 변수를 문자열로 치환 {$변수명|nl2br} 쇼핑몰관리자에서 엔터 친 부분 잡아내서 삽입 {$변수명|lower} 소문자로 변경 {$변수명|upper} 소문자로 변경 기타 {$변수명|date:날짜 포맷} 설정한 날짜로 표시 {$변수명|timetod..

  Read More
• [카페24] 카페24 배포 위해 git-ftp 사용하기 (실패)

  StartUP/카페24 2022. 5. 6. 13:37

  5월에 작성한 글인데 결론부터 말하자면 이 git-ftp는 작동을 안했고 (세팅이 잘못되었던듯) github에 Action 기능을 통해 배포하고 있다. 워낙 특수한 상태의 배포 형식이라 나중에 한 번 더 작성해볼 계획...? 카페24에 퍼블리싱 되는 디자인 파일들을 로컬에 다운 받아 수정하면 자동으로 업로드 되는 VSCode의 sftp 를 쓰고 있었는데 이제 해당 파일들도 깃으로 관리하기 위해 git을 통해 배포되는 방식을 써보기로 했다. git-ftp의 경우 중앙집중식 배포 프로그램으로 이용하기에는 부적절하다는 코멘트가 있기는 하다. ftp에 모든 파일이 올라가기까지 다른 파일이 수정되어서는 안된다는 부분인데.. 일단 테스트를 해보고 다른 방식을 찾던지 해야할 것 같다. 지금 필요한 것은 1. 버전관리..

  Read More
• [스타트업] 팀 노션 만들기

  StartUP 2022. 3. 25. 23:16

  팀 노션을 전체적으로 정리하는 프로젝트을 진행하고 있다. 겸사겸사 프론트엔드 엔지니어답게 oopy 도메인을 이용해서 회사 브랜딩 페이지도 작업해야하는데 아무래도 주말까지 작업해야할 것 같다. 디자이너도 아니고 CEO도 아닌데 브랜딩 페이지를 왜 만드냐면 회사 백엔드 개발자님을 모시게 되면서 온보딩 자료를 갖춰야 하기 때문이다. 사실 나도 스타트업에 매우 많은 기대를 했었지만 온보딩 키트나 온보딩 커리큘럼이 제대로 갖춰진 곳은 유니콘이 된 급에서나 가능한 것임을 입사하고 깨달았다. 내가 온보딩 하는 과정은 그다지 아쉽지는 않았으나 팀원 소개가 명확하게 이루어지지 않아 직접 '어떤 일을 하시는지' 물어봐야 하는 상황이 있었고 다른 회사 브랜딩 페이지들을 보면서 조금 더 '갖춰놓은' 페이지가 있으면 앞으로 새..

  Read More
• [GA] 구글 애널리틱스 스터디 - 카페24에서 GA 설정하기

  StartUP/GA | Marketing 2021. 10. 19. 18:44

  카페24에서 구글 웹마스터도구, 애널리틱스 설정하기 ✅ 구글 서치 콘솔 / 네이버 서치 어드바이저 ▶ 웹사이트 수집 및 색인 현황을 보여주는 툴 구글이나 네이버에서 내 쇼핑몰이 검색에 잘 잡히고 있는지 확인하는 툴 구글이나 네이버에게 수집되고 있는지, SEO에 최적화되기 위해 잘 굴러가고 있는지 확인 옛날에는 웹 마스터 도구라고 불림 계정을 등록한 후 분석 코드를 발급받아서 코드를 등록한다.(DNS 레코드에 설정이 필요함) ✅ 구글 애널리틱스 / 네이버 애널리틱스 ▶ 웹사이트 트래픽 현황을 보여주는 툴 마케팅을 위해 통계적으로 얼마나 어떤 종류의 트래픽이 발생되는지 계정의 경우 브랜드 이름을 설정하고 채널에서는 측정할 채널(웹인지, 웹앱인지, 앱인지)을 작성한다. 만들기를 누르면 추적 ID와 사이트에 삽..

  Read More