작업 목록No. 08 · 커머스 · 2026.10
마그네틱 시스템 행거
고객이 형태 카드를 3D 화면으로 끌어 칸을 이어 붙이면 부품 수량과 소비자 견적가가 바로 바뀌는 행거 구성 계산기입니다. 이어 붙일수록 맞닿는 옆틀을 함께 써서 부품이 줄어드는 이유를 지금 구성의 숫자로 풀어 보여 주고, 조명을 넣으면 전원 경로와 100W 제한을 검사합니다. 아임웹 쇼핑몰 상품 상세 페이지에 스크립트 두 줄로 넣습니다.
이어 붙이면 부품이 줄어드는 이유
- 맞닿는 옆틀을 함께 씀칸 3개를 이어 붙이면 맞닿는 자리 두 곳의 기둥·천장 고정 발·깊이봉을 두 칸이 함께 써서, 따로 설치할 때 기둥 6개가 4개로, 깊이봉 20개가 14개로 줄어듭니다.
- 지금 구성의 숫자로 설명계산 방식 탭은 공식만 보여 주지 않고, 화면에 놓인 칸 수와 단 수를 넣어 계산한 값을 그대로 적습니다.
- 높이가 다른 칸이 만날 때함께 쓰는 옆틀에는 양쪽 칸의 단이 모두 들어가고, 깊이가 다르면 깊은 쪽 깊이봉을 씁니다.
구성부터 견적까지
01쇼핑몰 상품 상세에 삽입
아임웹 코드 위젯에 스크립트 두 줄을 넣으면 계산기가 상품 상세 가운데에 들어가고, 높이는 내용에 맞춰 자동으로 늘어납니다.
02끌어 붙이기와 조명
형태 카드를 3D 화면으로 끌면 모듈이 손을 따라 움직이고 놓을 자리가 비워집니다. 칸마다 행거봉 대신 조명을 고를 수 있습니다.
03전원 경로 검사
전원 시작점에서 같은 높이로 이어지지 않은 조명은 켜지지 않는다고 알리고, 합계가 100W를 넘는 변경은 막습니다.
04부품 목록
기둥·깊이봉·커넥터·전선 부품을 종류별로 세고, 칸마다 따로 설치할 때와 지금 수량을 나란히 비교합니다.
05견적서
머리·부품 목록·견적서가 같은 금액을 보여 주고, 견적서는 인쇄·PDF 저장과 쇼핑몰 주소로 된 구성 링크 복사가 됩니다.
휴대폰에서는 페이지 하나로
쇼핑몰 안에 넣은 계산기는 휴대폰에서 내용 높이만큼 늘어나 스크롤이 한 번만 생기고, 3D 위에서 세로로 밀면 페이지가 내려갑니다. 견적서 창은 지금 보고 있는 화면 안에 뜹니다.
상품 상세
삽입된 계산기
계산기 단독
칸 편집 · 조명
정하지 않은 구조는 운영자가 고른다
- 형태 기준공고의 A·B·C·D 형태가 무엇으로 나뉘는지 공개되지 않아, 단 구성·단 수와 깊이·행거봉과 선반 조합 중 고르거나 형태마다 직접 정하게 했습니다.
- 전원·용량전원 시작점 한 곳·여러 곳, 100W 제한을 구성 전체·전원마다로 바꿀 수 있습니다.
- 공유 방식 3가지옆틀 공유, 기둥만 공유, 공유 없이 연결 브래킷 중 고르면 3D와 부품 목록이 함께 바뀝니다.
- 단마다 행거봉·선반선반 단에는 커넥터 대신 선반 받침이 들어가고, 3D에 선반이 그려집니다.
20→14시연 구성 3칸에서 이어 붙여 줄어든 깊이봉 수 (따로 설치 대비)
147화면 · 상태 · 화면 폭 조합을 자동으로 검사한 레이아웃 전수 점검
20단계끌어 붙이기 · 구조 설정 7가지 · 쇼핑몰 삽입까지 브라우저로 돌린 사용 흐름 검사
2줄아임웹 코드 위젯에 넣는 스크립트