아임웹에서는 모바일 상품 상세페이지에 좌우 여백 15PX을 두고 있습니다. 이 도움말은 모바일 상품 상세페이지 좌우 여백을 없애는 방법을 설명합니다.

적용방법

1. 디자인 모드에 접속합니다. 접속방법
2. 뷰포트를 모바일로 전환합니다. 뷰포트 변경하기
3. 왼쪽 상단의 메뉴 관리 ≡ 아이콘을 클릭합니다.

4. 글로벌 메뉴 항목에서 상품 상세페이지 메뉴를 클릭해 이동합니다.

   중요: 쇼핑 기능을 사용 설정해 주세요. 쇼핑 기능을 활성화하지 않으면 상품 상세페이지, 마이페이지, 장바구니 메뉴가 노출되지 않습니다. 쇼핑 및 예약 사용 설정하기

   

5. 위젯이 없는 영역에 마우스 포인터를 올리고, 마우스 오른쪽 버튼을 클릭합니다.

6. 컨텍스트 메뉴가 나오면 모바일 전용 섹션추가 를 클릭합니다.

   

7. 추가된 섹션의 위젯 추가 ＋ 아이콘을 클릭 후, 코드 위젯을 클릭합니다.
8. 코드 위젯에 마우스 포인터를 올리고, 마우스 오른쪽 버튼을 클릭합니다.

9. 컨텍스트 메뉴가 나오면 코드 설정을 클릭합니다.

   

10. 아래의 코드를 복사합니다.

    <style>
    @media (max-width: 768px) {
        .prod_detail_mobile, #prod_detail_body, #prod_detail.shop-style-b #prod_detail_content_mobile {
            margin-left: -15px;
            margin-right: -15px;
            width: auto !important;
        }
        .fr-view img.fr-dii {
            max-width: 100%;
        }
    }
    </style>

11. 코드 설정 빈 칸에 붙여넣습니다.

    

12. 저장 버튼을 클릭합니다.

코드 적용 확인하기

1. 디자인 모드 오른쪽 상단의 미리보기 아이콘을 클릭합니다.
2. 모바일 상품 상세페이지 좌우 여백이 정상적으로 없어졌는지 확인합니다.
3. 문제가 없다면 디자인 모드로 돌아가 게시하기 버튼을 클릭해 적용합니다.