مستندات فروشگاه
پرو مجازی را به سایت خود وصل کنید
نوع فروشگاهتان را انتخاب کنید. مستندات وبسایت و وردپرس جدا هستند تا مسیر نصب اشتباه نشود.
فروشگاه باید دقیقاً چه کار کند
پوشینو روی ویترین فعلی شما سوار میشود. قالب، سبد خرید و درگاه پرداخت عوض نمیشود. فقط یک دکمه «پرو کن» کنار محصول اضافه میکنید.
فروشگاه وردپرسی دارید؟ تب را باز کنید.
-
۱
حساب بسازید با شماره موبایل ایرانی وارد شوید و فروشگاه را ثبت کنید (نام، آدرس سایت، نام مالک).
-
۲
کلید عمومی را بردارید فقط
pk_live_...داخل سایت فروشگاه میرود. کلید محرمانه (sk_live_...) را هیچوقت در HTML نگذارید. -
۳
دامنه سایت را مجاز کنید اگر فروشگاه روی
shop.irاست، همان دامنه باید در داشبورد باشد. وگرنه مودال باز میشود ولی API رد میکند. -
۴
یکبار SDK را در سایت لود کنید معمولاً در
<head>یا قبل از</body>. -
۵
روی هر محصول دکمه پرو بگذارید سه چیز لازم است: شناسه محصول، لینک مستقیم عکس لباس، نام محصول.
-
۶
با گوشی واقعی تست کنید از دامنه خودتان دکمه را بزنید، عکس تمامقد بدهید، نتیجه باید داخل همان مودال بیاید.
مشتری فروشگاه نیاز به ثبتنام در پوشینو ندارد. عکس میفرستد یا با دوربین میگیرد، نتیجه را میبیند، بعد خرید را در سایت شما ادامه میدهد.
۱. ساخت حساب و فروشگاه
- به ثبتنام بروید.
- شماره موبایل را به شکل
0912...وارد کنید و کد را تأیید کنید. - نام فروشگاه، آدرس وبسایت (با
https://) و نام مالک را بدهید. - کلیدها نمایش داده میشوند. کلید محرمانه فقط همین یکبار کامل دیده میشود.
اگر قبلاً ثبتنام کردهاید، از ورود با همان شماره وارد داشبورد شوید. حساب باقی میماند.
۲. کلید API
دو کلید ساخته میشود:
| کلید | شکل | کجا استفاده شود |
|---|---|---|
| عمومی | pk_live_... |
فقط همین را در فرانت فروشگاه، داخل Pooshino.init بگذارید. |
| محرمانه | sk_live_... |
سرور شما. در مرورگر، گیت، قالب وردپرس یا فایل عمومی نگذارید. |
کلید عمومی فعلی شما در داشبورد، صفحه کلیدهای API است.
اگر کلید عمومی لو برود، فقط کسی میتواند از سهمیه پرو شما روی دامنههای مجاز استفاده کند. اگر کلید محرمانه لو برود، کلید را از داشبورد باطل کنید.
۳. دامنه مجاز
وقتی فروشگاه را میسازید، دامنه وبسایت شما (با و بدون www) خودکار ثبت میشود. مودال پرو فقط از همان دامنهها به API وصل میشود.
- سایت روی
https://myshop.irاست → دامنهmyshop.irباید فعال باشد. - اگر فروشگاه را روی زیردامنه مثل
shop.myshop.irباز میکنید، همان را هم اضافه کنید. - تست روی دامنه پوشینو (
pooshinoai.ir) از محدودیت دامنه فروشگاه مستثنی است.
دامنهها را در داشبورد → دامنهها ببینید. اگر خطای «Origin is not allowed» دیدید، دامنه صفحه فروشگاه با لیست مجاز یکی نیست.
۴. نصب SDK
این دو خط را یکبار در تمام صفحات محصول بگذارید (ترجیحاً قبل از </body>). apiKey را با کلید عمومی خودتان عوض کنید.
baseUrl را وقتی لازم دارید که فایل sdk.js را از سرور خودتان سرو کنید. اگر اسکریپت را مستقیم از پوشینو لود کنید، آدرس سرویس خودکار تشخیص داده میشود.
۶. آزمایش اتصال
- سایت فروشگاه را روی دامنه واقعی (یا دمو پوشینو) باز کنید.
- روی «پرو کن» بزنید. مودال سفید پوشینو باید باز شود.
- عکس تمامقد، با نور کافی، بدون برش سر یا پا آپلود کنید — یا از دوربین استفاده کنید.
- «پرو کن» داخل مودال را بزنید. مراحل تحلیل عکس / درک لباس / ساخت فیت را میبینید.
- نتیجه در همان مودال میماند. بستن مودال با «بستن» است، نه با تمام شدن هوش مصنوعی.
برای تست سریع بدون سایت خودتان: بوتیک آزمایشی پوشینو.
نمونه کامل یک صفحه محصول
این فایل را میتوانید ذخیره کنید، کلید را عوض کنید، و در مرورگر باز کنید. برای کار واقعی باید روی دامنه مجاز فروشگاه سرو شود.
نمونه JavaScript (کنترل دستی)
اگر دکمه را خودتان میسازید یا در React / Vue هستید، بهجای data-attribute مستقیم openTryOn را صدا بزنید.
openTryOn یک Promise برمیگرداند. وقتی نتیجه آماده شد resolve میشود. اگر کاربر مودال را ببندد، reject میشود با پیام لغو. مودال بعد از نتیجه خودش بسته نمیشود؛ مشتری میتواند تصویر را ببیند و دانلود کند.
فروشگاه وردپرسی؟ تب را ببینید.
مشتری در مودال چه میبیند
مودال فروشگاه همان مودال سایت پوشینو است. جریان ثابت است:
- شروع: بارگذاری عکس یا دوربین.
- عکس: فایل JPG / PNG / WEBP، یا گرفتن از دوربین.
- پردازش: چهار گام با تیک سبز — تحلیل عکس، درک لباس، ساخت فیت، نهاییکردن.
- نتیجه: تصویر ساختهشده، دانلود، یا پرو استایل دیگر. مودال باز میماند تا «بستن».
دوربین نیاز به اجازه مرورگر دارد. در iframe، سایت شما باید allow="camera" را مسدود نکرده باشد. SDK این مجوز را روی iframe خودش میگذارد.
خطاهای رایج
| علامت | علت | کار فروشگاه |
|---|---|---|
| مودال باز نمیشود | sdk.js لود نشده یا init صدا زده نشده |
در Network ببینید اسکریپت ۲۰۰ میدهد. Pooshino.init باید قبل از کلیک اجرا شده باشد. |
| Origin is not allowed | دامنه صفحه فروشگاه در لیست مجاز نیست | hostname دقیق (مثلاً www.shop.ir) را در دامنهها اضافه کنید. |
| API key is required / invalid | کلید خالی، اشتباه، یا باطل | همان pk_live_ داشبورد را بدون فاصله بگذارید. |
| ساخت تصویر ناموفق | عکس کاربر نامناسب، یا لینک لباس غیرقابل دریافت | عکس تمامقد؛ لینک لباس را در تب جدید باز کنید و مطمئن شوید خودِ فایل تصویر است. |
| Try-on timed out | بیش از ۳ دقیقه طول کشیده | دوباره تلاش کنید. اگر تکرار شد به پشتیبانی بگویید. |
| دوربین باز نمیشود | HTTPS نیست، یا کاربر اجازه نداده | سایت را روی HTTPS سرو کنید. آپلود فایل همیشه جایگزین است. |
مرجع SDK
بعد از لود /sdk.js، شیء سراسری Pooshino در صفحه هست.
Pooshino.init(options)
| فیلد | نوع | توضیح |
|---|---|---|
apiKey | string، الزامی | کلید عمومی فروشگاه. |
baseUrl | string، اختیاری | آدرس ریشه پوشینو. اگر SDK از خود پوشینو لود شود لازم نیست. |
Pooshino.openTryOn(options) → Promise
| فیلد | نوع | توضیح |
|---|---|---|
productId | string، الزامی | شناسه محصول در فروشگاه شما. |
productImageUrl | string، الزامی | URL مطلق تصویر لباس. |
productName | string | نام نمایشی. |
نتیجه موفق:
{
"jobId": "uuid",
"resultUrl": "https://.../tryon-result.jpg"
}
Pooshino.close()
مودال را میبندد. معمولاً لازم نیست؛ مشتری از دکمه بستن داخل مودال استفاده میکند.
افزونه رسمی ووکامرس
این تب فقط برای فروشگاههای وردپرس + ووکامرس است. افزونه سبک پوشینو SDK را لود میکند و دکمه پرو را روی صفحه محصول میگذارد — بدون secret و بدون تغییر قالب.
دانلود افزونه: pooshino-try-on.zip · نسخه ۱.۰.۰ · ووکامرس ۵+
سایت غیرووردپرسی دارید؟ تب را باز کنید.
۱. حساب پوشینو
- در پوشینو ثبتنام کنید و فروشگاه بسازید.
- از کلیدهای API فقط کلید عمومی
pk_...را بردارید. - دامنه فروشگاه وردپرس را در دامنهها مجاز کنید (مثلاً
myshop.ir).
کلید محرمانه (sk_...) را هرگز داخل وردپرس نگذارید.
۲. نصب افزونه
- فایل zip را دانلود کنید.
- وردپرس: افزونهها → افزودن → بارگذاری افزونه → انتخاب zip → نصب و فعالسازی.
- یا unzip کنید و پوشه
pooshino-try-onرا درwp-content/pluginsبگذارید. - ووکامرس باید فعال باشد.
۳. تنظیمات
- در وردپرس بروید: ووکامرس → پوشینو.
- کلید API عمومی را بچسبانید.
- آدرس سرویس پیشفرض
https://pooshinoai.irاست. - متن دکمه و جایگاه (قبل/بعد افزودن به سبد) را در صورت نیاز عوض کنید و ذخیره کنید.
۴. رفتار روی فروشگاه
- فقط روی صفحه تکمحصول اسکریپت و دکمه لود میشود.
- دکمه با تصویر شاخص محصول (اندازه full) و نام و شناسه ووکامرس ساخته میشود.
- اگر محصول تصویر شاخص نداشته باشد، دکمه نشان داده نمیشود.
۵. کش و بهینهساز
- در WP Rocket / LiteSpeed / Autoptimize، دامنه پوشینو یا فایل
sdk.jsرا از Combine/Defer خرابکننده مستثنی کنید. - صفحه محصول باید روی HTTPS باشد تا دوربین و آپلود درست کار کنند.
- اگر تم، دکمه افزودن به سبد را جابهجا کرده، جایگاه دکمه را در تنظیمات افزونه عوض کنید.
کد دستی قالب (اختیاری)
اگر نمیخواهید افزونه نصب کنید، SDK را در footer لود کنید و در حلقه محصول این دکمه را بگذارید:
<button type="button" data-pooshino-tryon data-product-id="<?php echo esc_attr( get_the_ID() ); ?>" data-product-image="<?php echo esc_url( wp_get_attachment_url( get_post_thumbnail_id() ) ); ?>" data-product-name="<?php echo esc_attr( get_the_title() ); ?>"> پرو کن </button>
آزمایش
- یک محصول با تصویر شاخص را در سایت وردپرس باز کنید.
- دکمه پرو مجازی را بزنید؛ مودال پوشینو باید باز شود.
- اگر «Origin is not allowed» دیدید، دامنه را در داشبورد پوشینو چک کنید.