카페24 쇼핑몰(자사몰) 회원가입 유도 슬라이드 배너

카페24 쇼핑몰(자사몰)의 디자인 수정 작업한 내용이다. 회원가입 유도 슬라이드 배너.

 

요청사항은 회원가입을 유도하는 밴딩 배너인데, 특이한 점은 하단에 배치해달라는 요청이다. 주로 하단에는 내비게이션이 있거나, 상품 상세페이지에서는 장바구니와 구매 버튼이 있기 때문에 배너를 배치하진 않는데, 지금 생각해 보면 자주 사용하는 영역이기에 내용을 인식시키기에는 좋은 위치인 것도 맞다.

 

[하단 슬라이드 밴딩 배너 메인]

작업 시에 문제가 되었던 것은, 모바일 상품 상세 페이지의 경우 하단 구매 버튼 UI 크기가 기본 하단 내비게이션의 높이와 달랐다. 그래서 상품 상세페이지에서는 높이를 달리해야 했는데 주소를 기반으로 다르게 할 수도 있고, 소스코드를 좀 분석하니 카페24의 메타태그 중 "path_role"이 페이지 구분을 하고 있는 것으로 확인되어 메타태그를 활용할 수 있었다.

 

[하단 슬라이드 밴딩 배너 상품상세]

 

<meta name="path_role" content="PRODUCT_DETAIL">

 

요청사항 외에 추가로 작업 시 고려한 점은,

 

1. 회원가입 혜택의 슬라이드 배너가 이미 회원가입하여 로그인 중인 사람에게는 노출될 필요가 없기 때문에 로그인 상태에서는 미 노출 처리하는 것.

2. 회원가입 혜택이기 때문에 배너 클릭 시에는 회원가입 페이지로 이동하는 것.

 

두 사항까지 추가하여 작업을 완료했다.

 

회원가입으로 연결될 수 있는 배너를 추가하는 수정 작업.

 

[카페24 쇼핑몰(자사몰) 회원가입 유도 슬라이드 배너 썸네일]