آموزش کامل صفحهساز بصری
طراحی صفحهی اصلی و برگهها بدون کد: بلوکها، ستونها، تنظیمات هر دستگاه، قالبهای آماده، پیشنویس و انتشار.
باز کردن صفحهساز
- ۱در پنل به «محتوا ← صفحهی اصلی» بروید و «ویرایش با صفحهساز» را بزنید؛ برای برگهها از «محتوا ← برگهها» روی «صفحهساز» کلیک کنید.
- ۲صفحهساز سه بخش دارد: فهرست ابزارکها (راست)، بوم طراحی (وسط) و تنظیمات بلوک انتخابشده (چپ).
شروع با قالب آماده
از بخش «قالبها» یکی از چیدمانهای آماده (فروشگاه مد، زیبایی، دیجیتال، لندینگ و…) را انتخاب کنید. قالب فقط نقطهی شروع است؛ هر بخش آن را میتوانید تغییر دهید یا حذف کنید.
افزودن و چیدن بلوکها
- ۱ابزارک دلخواه (مثلاً «اسلایدر محصولات» یا «بنر») را از فهرست بکشید و روی بوم رها کنید.
- ۲برای ساختن ستونها از «بخش/کانتینر» استفاده کنید و ابزارکها را داخل آن بگذارید.
- ۳ترتیب بلوکها را با کشیدن در بوم یا در «ساختار صفحه» تغییر دهید.
تنظیمات هر بلوک
با کلیک روی هر بلوک، در پنل تنظیمات سه زبانه میبینید: «محتوا» (متن، تصویر، لینک، منبع محصولات و تعداد)، «ظاهر» (رنگ، پسزمینه، گوشه، سایه، تایپوگرافی) و «پیشرفته» (فاصلهها، انیمیشن، مخفی کردن در دستگاه خاص، CSS دلخواه).
لیست و اسلایدر پویا (Query Loop)
- ۱از گروه «پویا» ابزارک «لیست پویا / اسلایدر» را روی صفحه بکشید (یا از «قالبها ← لیست و اسلایدر پویا» یک نمونهی آماده بردارید).
- ۲در «دادهها» منبع را انتخاب کنید: محصولات، دستهها، برندها یا نوشتههای وبلاگ.
- ۳با «افزودن شرط» فیلتر بسازید: دسته، برند، برچسب، بازهی قیمت، حراج، موجود، ویژه، حداقل امتیاز، تعداد فروش، جدیدتر از چند روز یا محصولات مشخص. همهی شرطها باید برقرار باشند.
- ۴مرتبسازی (جدیدترین، پرفروش، ارزان/گران، امتیاز، تخفیف، تصادفی یا ترتیب دستی)، «تعداد» و «رد کردن» را تعیین کنید؛ نتیجه همان لحظه روی بوم دیده میشود.
- ۵در «نمایش» شبکه، اسلایدر، فهرست یا نوار متحرک را انتخاب کنید و تعداد کارت هر دستگاه را جدا بدهید (در اسلایدر عدد اعشاری مثل ۱٫۵ بخشی از کارت بعدی را نشان میدهد).
برای اسلایدر: جلوهی «فوکوس روی کارت وسط»، فلش در دو طرف/بالا/پایین، نقطهها، حرکت خودکار و چرخهی بیپایان را از همین پنل تنظیم کنید.
طراحی کارت دلخواه، مثل نقاشی
کارت هر لیست پویا از ابزارکهای معمولی ساخته میشود: هر چیزی که داخل لیست بگذارید برای تکتک موارد تکرار میشود. ابزارکهای «پویا» (تصویر، عنوان، قیمت، متن، برچسب تخفیف، امتیاز، دکمهی افزودن به سبد و شمارش معکوس حراج) خودشان اطلاعات هر محصول را میخوانند. هر بخش را روی بوم انتخاب کنید و رنگ، فونت، فاصله، گوشه، سایه و جلوهی اشارهاش را تغییر دهید؛ تغییر روی همهی کارتها اعمال میشود.
- ۱برای شروع سریع، در تنظیمات لیست از «طرح آمادهی کارت» یکی را انتخاب کنید: کلاسیک، قابدار، مینیمال، لوکس، تیره، افقی، دایرهای، لوگو یا نوشتهی وبلاگ.
- ۲سپس هر بخش را جابهجا، حذف یا اضافه کنید؛ مثلاً یک «کانتینر» ردیفی برای قیمت و دکمه در کنار هم.
ابزارکهای پویا
در گروه «پویا (لیست و کارت)» همهی ابزارکهای قابل استفاده داخل کارت را میبینید. اگر یکی از آنها را بیرون از لیست بگذارید، در صفحهساز با اطلاعات نمونه نشان داده میشود تا ظاهرش را ببینید.
هیروهای مدرن و اسلایدر بنر پیشرفته
ابزارک «هیروی مدرن» شش نوع دارد: دوبخشی با قاب تصویر حبابی/طاقی/کج، گرادیان مش متحرک، بنتو (کاشیها)، محصول ویژه که خودکار از شرطهای شما خوانده میشود، پارالاکس تمامصفحه و تایپوگرافی بزرگ با نوار متحرک. «اسلایدر بنر پیشرفته» جلوههای لغزش، محو، کنبرنز و زوم، حرکت لایهای متن، تصویر جدا برای موبایل، ارتفاع جدا برای هر دستگاه و نشانگرهای نقطه، نوار پیشرفت، شماره یا عنوان اسلایدها را دارد.
نمونهی نتیجه
چند لیست پویا با طرحهای مختلف: اسلایدر جدیدترینها با کارت کلاسیک و اسلایدر حراج با کارت تیره و فوکوس روی کارت وسط. همه بدون یک خط کد ساخته شدهاند.
طراحی جداگانه برای موبایل
از نوار بالا حالت «موبایل» یا «تبلت» را انتخاب کنید. تنظیماتی که در این حالت تغییر میدهید (تعداد ستون، اندازهی فونت، فاصلهها) فقط روی همان دستگاه اعمال میشود.
پیشنویس، انتشار و بازگشت
تغییرات خودکار بهصورت پیشنویس ذخیره میشوند و تا «انتشار» نزنید مشتریان آنها را نمیبینند. هر انتشار در «تاریخچه» ثبت میشود و با یک کلیک به نسخهی قبل برمیگردید.
قبل از انتشار، صفحه را در هر سه حالت دستگاه بررسی کنید.