온라인 스토어용 이미지 위젯 코드: 쇼핑객을 위한 목업과 시각적 아이디어

쇼핑객은 결과물을 머릿속에 그리기 어려워할 때가 많습니다. 맞춤 프린트, 방 색상, 선물 아이디어 같은 것들입니다. AI 이미지 위젯을 쓰면 쇼핑객이 원하는 것을 설명하고, 스토어를 떠나지 않은 채 몇 초 만에 생성된 이미지를 볼 수 있습니다. 위젯은 화이트 라벨이므로 외부 도구가 아니라 스토어의 일부처럼 보입니다.

스토어에서 잘 통하는 아이디어

• 맞춤 프린트와 굿즈: "머그잔에 넣을 미니멀한 산 라인 드로잉"은 쇼핑객이 스토어와 상담할 출발점이 됩니다.
• 인테리어와 장식: 방문자가 관련 제품을 둘러보기 전에 분위기를 스케치합니다("세이지 그린의 차분한 북유럽풍 침실").
• 선물 아이디어: 빠른 시각 자료가 무엇을 주문할지 결정하는 데 도움이 됩니다.

페이지에 이 이미지들이 실제 배송되는 제품의 사진이 아니라 AI로 생성한 콘셉트라는 점을 분명히 밝히세요. 기대치를 정직하게 맞추고 반품을 줄일 수 있습니다.

상품 페이지나 랜딩 페이지에 추가하기

위젯에서 이미지 위젯을 만들고 저장한 뒤 코드를 복사하세요.

<script src="https://api14.com/widget.js" data-widget="YOUR_WIDGET_ID" async></script>

대부분의 스토어 빌더는 사용자 정의 HTML 블록을 지원합니다. 그곳에 태그를 붙여 넣거나, data-target으로 특정 요소 안에 위젯을 그리세요. 위젯은 자체 Shadow DOM 안에 있으므로 테마의 CSS와 위젯이 서로 간섭하지 않습니다.

스토어처럼 보이게 만들기

이미지 위젯에는 로고도, "powered by" 문구도 없습니다. 제목과 버튼을 스토어의 말투로 작성하고, 브랜드 강조 색상을 고르고, 페이지에 맞는 테마를 선택하세요. 입력창 안내 문구로 좋은 예시 프롬프트를 보여 주세요. 쇼핑객은 보이는 것을 따라 합니다.

지출을 예측 가능하게 유지하기

스토어에는 바쁜 날이 있으니 캠페인 전에 한도를 설정하세요.

• 위젯을 전용 API 키로 실행하세요. 편집기에서 키 목록의 마지막 옵션이 새 API 키 만들기입니다. 그 키에 일일 지출 한도를 주고 선택한 이미지 모델로 제한하세요.
• 위젯 자체에도 일일 지출 한도를 추가하세요.
• 설정, 위젯 관리에서 방문자 한 명이 하루에 보낼 수 있는 요청 수를 정하세요.

사용량에서는 위젯의 요청을 사이트별, 위젯별로 볼 수 있어 도구가 제값을 하는지 확인할 수 있습니다.

스토어 도메인만 허용하기

설정, 위젯 사이트에 스토어 도메인을 등록하세요. 도메인은 하위 도메인도 포함하므로 example.com은 www.example.com을 포함합니다.

위젯 페이지에서 빌더를 사용해 이미지 위젯이 스토어에서 어떻게 보일지 확인해 보세요.