چطور با یک افزونه ساده «محصولات مشابه» فروش فروشگاه ووکامرس‌تو بیشتر کنی (ویدیو آموزش + فایل ZIP)

سلام! اگه دنبال یه روش سریع و کاربردی هستی که بدون هزینهٔ تبلیغات سرسام‌آور فروش فروشگاه ووکامرس‌ت رو ببری بالا، این مقاله مخصوص توئه. توی این آموزش ما یه افزونهٔ وردپرس درست می‌کنیم که داخل متن پست یا محصول کارتِ محصول نشان می‌ده — تصویر، نام، قیمت و دکمهٔ خرید — و این کار باعث افزایش تبدیل و فروش میشه. پایین‌تر همه چیز قدم‌به‌قدم و با زبانی راحت توضیح داده شده، و ویدیوی آموزشی کامل هم همراهشه (حتماً ویدیو رو ببین).

چرا این افزونه فروش رو بالا می‌بره؟

نمایش محصولات مرتبط داخل متن باعث میشه کاربر سرِ فرصت ببینه گزینه‌های بیشتر و احتمال خرید بالا میره.

کارت محصول جذاب و قابل کلیک کاربر رو به اقدام (CTA) سوق می‌ده — یعنی کلیک → افزودن به سبد → خرید.

درج مستقیم محصولات داخل مقاله یعنی نمایش دقیقِ محصول در لحظهٔ تصمیم‌گیری کاربر؛ این خودش نرخ تبدیل رو بالا می‌بره.

نکته: تاکید اصلی ما همینه — این افزونه «مستقیماً» فروش رو افزایش می‌ده. محتوای مرتبط + کارت جذاب = مشتری بیشتر.

مرحلهٔ اول — پرامپتی که تو باید ابتدا به ChatGPT (یا هر مدل AI) بدی

پرامپت استفاده شده داخل ویدیو : یک پلاگین وردپرس بساز که قابلیت زیر را داشته باشد: 1. پلاگین باید با ووکامرس سازگار باشد. 2. در بخش افزودن یا ویرایش مقاله (Post Editor – Gutenberg و Classic Editor) یک دکمه یا بلاک جدید اضافه کن. 3. کاربر بتواند یک یا چند محصول از ووکامرس انتخاب کند و آن را داخل متن مقاله در محل دلخواه درج کند. 4. خروجی در فرانت‌اند باید یک کارت محصول زیبا نمایش دهد شامل:   - تصویر محصول   - نام محصول   - قیمت محصول   - دکمه "خرید مستقیم" یا "افزودن به سبد خرید" 5. استایل کارت محصول ساده و ریسپانسیو باشد. 6. کد پلاگین ماژولار نوشته شود و قابل ترجمه (text-domain). 7. امکان درج [shortcode] برای محصول هم وجود داشته باشد تا در هر قسمت از مقاله قابل استفاده باشد. 8. تمام کدها استاندارد و سازگار با وردپرس 6.x و ووکامرس جدید باشند. 9. هم برای ادیتور کلاسیک و هم برای ادیتور گوتنبرگ قابل استفاده باشه.

مرحلهٔ دوم — پرامپت پیشنهادی که تو باید به مدل AI (ChatGPT / Gemini / Claude) بدی تا کد آماده برات بسازه

I want you to generate a WordPress plugin project that meets the following specifications. Produce only a zip-friendly file/folder structure and the full PHP/JS/CSS code with comments, ready to be zipped and uploaded to WordPress. Follow WordPress and WooCommerce best practices and standards. Requirements: 1. Compatibility: Plugin must be compatible with WordPress 6.x and latest WooCommerce. Use hooks/filters, nonces, capability checks. 2. Functionality:   - Add a new block for Gutenberg and a button/quicktag for Classic Editor that allows inserting one or multiple WooCommerce products into the post content.   - Provide a shortcode [product_card id="123"] that renders the same product card.   - Allow product selection via a searchable dropdown (AJAX) in the block/editor UI. 3. Frontend output (product card):   - Show product image (fallback if none), product title, price (including currency), and a clear CTA button ("افزودن به سبد خرید" or "خرید مستقیم").   - The CTA should add product to cart using WooCommerce methods (AJAX add-to-cart where possible).   - Card must be responsive and accessible (semantic HTML, aria attributes). 4. Code quality:   - Use modular structure (includes/, assets/js/, assets/css/, languages/).   - Load assets only when needed (enqueue scripts/styles conditionally).   - Use text-domain "my-product-card" for translations.   - All strings wrapped in __() or _e() for i18n.   - Sanitize and escape all input/output properly. 5. Admin/UI:   - Register plugin settings page (basic) and capabilities.   - Provide nonce checks and capability checks for admin actions. 6. Packaging:   - Provide a build-ready folder structure so the output can be zipped.   - Add a README with installation steps and changelog. 7. Deliverables (exact):   - Full PHP plugin main file with header comment (Plugin Name, Description, Version, Author, Text Domain).   - Includes for REST endpoints or AJAX handlers if used.   - A simple CSS for the card, mobile-first, and a small JS for AJAX add-to-cart.   - Shortcode handler and Gutenberg block registration code (ESNext or simple JS).   - Classic Editor button implementation (tinyMCE or Quicktags).   - Example usage instructions. Produce the code as files with their relative paths (e.g., /my-product-card/my-product-card.php, /my-product-card/includes/class-…), and include the exact file contents. Don't output anything except the code files and a final note: "Zip the folder 'my-product-card' and upload via WordPress > Plugins > Add New > Upload Plugin." Keep security and compatibility best practices in mind.

توضیح کوتاه: این پرامپتِ مرحلهٔ دوم را بدون تغییر داخل ChatGPT یا Gemini یا Claude پیست کن. نتیجهٔ این مدل، مجموعهٔ فایل‌ها و کدهای پلاگین خواهد بود که باید دانلود/ذخیره‌شون کنی.

مرحلهٔ سوم — وقتی AI کد رو ساخت: مراحلی که باید با دقت انجام بدی (حتماً ویدیو رو ببین)

حتماً: برای آموزش تصویری و اجرای دقیق، ویدیوی آموزشی داخل همین صفحه هست — همهٔ نکات ریز مثل مجوز فایل، خطایابی، و تستِ AJAX توی ویدیو آمده. قبل از ادامه هم ویدیو رو ببین تا تمام رفتارها رو از نزدیک مشاهده کنی.

مراحل کلی (به ترتیب و دقیق):

دریافت کد از مدل AI

مدل فایل‌ها را به صورت محتوای متنی بهت می‌دهد (یا فایل ZIP). اگر فقط کد متنی داده شد، همه فایل‌ها را با نام و ساختار پوشه‌ای که مدل مشخص کرده، در سیستم خود بساز.

ساخت پوشهٔ نهایی روی سیستم خودت

نام پیشنهادی پوشه: my-product-card (همانطور که در پرامپت خواسته شده).

ساختار را دقیقاً همان‌طور که مدل خروجی داده حفظ کن: includes/, assets/css/, assets/js/, languages/, readme.txt و فایل اصلی my-product-card.php.

بررسی و تست اولیهٔ امنیتی و سازگاری

تو فایل‌ها دنبال sanitize_text_field, esc_html, wp_nonce_field, و capability checks باش.

اگر مشکلی دیدی (مثلاً خروجی بدون escaping)، قبل از بسته‌بندی اصلاح کن.

زیپ کردن پوشه

مهم: حتماً کل پوشهٔ my-product-card را زیپ کن (فایلی مثل my-product-card.zip).

تذکر مهم: وردپرس فقط فایل زیپ حاوی پوشهٔ پلاگین را می‌شناسد؛ مطمئن شو که ساختار داخل زیپ این‌طوری باشه: my-product-card/ (نه اینکه فایل‌ها مستقیم در ریشهٔ زیپ باشند بدون پوشه).

نصب افزونه در وردپرس

وارد داشبورد وردپرس خودت شو → به افزونه‌ها > افزودن برو.

روی بارگذاری افزونه کلیک کن.

فایل my-product-card.zip را انتخاب کن (تأکید می‌کنم: انتخاب فایل ZIP ضروری است).

بعد از انتخاب، روی نصب کلیک کن.

وقتی نصب شد، روی فعال‌سازی کلیک کن.

ترکیب افزونه با ووکامرس و اضافه کردن محصول داخل پست

وارد صفحهٔ ویرایش یک پست شو (می‌تونی از گوتنبرگ یا ادیتور کلاسیک استفاده کنی — افزونه برای هر دو راهکار داره).

اگر گوتنبرگ: از بلاک جدیدِ افزونه (مثلاً با نام «Product Card» یا «Insert Product») استفاده کن. بلاک رو اضافه کن، محصول(ها) رو از لیست جستجو کن و انتخاب کن. بعد محل درج رو مشخص کن و گزینهٔ Insert / درج را بزن.

اگر کلاسیک: روی دکمهٔ افزونه در نوار ابزار کلیک کن، محصول رو سرچ کن، انتخاب کن و Insert رو بزن تا شورتکد یا HTML مربوطه داخل محتوا درج بشه.

در نهایت پست را ذخیره/بروزرسانی کن و صفحه را بازبینی (preview) کن تا کارت محصول را در فرانت‌اند ببینی.

تو ویدیو تمام این کارها به‌صورت عملی انجام شده — از انتخاب محصول تا تست دکمهٔ افزودن به سبد. حتماً ویدیو را کامل ببین چون نکات بهینه‌سازی و رفع خطا هم آنجا گفته شده.

مرحلهٔ چهارم — نکات تکمیلی بعد از نصب (برای فروش بیشتر)

در صفحهٔ محصول مطمئن شو که تصاویر و قیمت‌ها درست نمایش داده می‌شن.

اگر از کش (cache) استفاده می‌کنی، بعد از نصب افزونه کش‌ت رو پاک کن تا تغییرات درست نمایش داده بشن.

تست کن: کارت رو به چند صفحه اضافه کن و نرخ کلیک/افزودن به سبد رو بررسی کن.

A/B تست کن: کارت با/بدون پیشنهاد ویژه یا متن متفاوت مقایسه کن تا ببینی چقدر فروش اضافه میشه.

در ضمن اگه میخاین یادبگیرین چجوری میتونید با هوش مصنوعی افزونه کروم بسازید اینجا کلیک کنید

جمع بندی نهایی

می‌خوای این افزونه رو امتحان کنی و فروش‌ت رو سریع‌تر کنی؟ ویدیوی آموزش کامل رو ببین — تو ویدیو دقیقاً همهٔ مراحلِ گرفتن خروجی از AI، ساخت فایل‌ها، زیپ کردن و نصب تو وردپرس رو با جزئیات نشان دادم. لینک دانلود ZIP و ویدیو همین پایین قرار داره — اول ویدیو رو ببین، بعد مرحله‌ها رو دنبال کن و اگر سوال داشتی من اینجام کمک کنم.