سلام دوستان و همراهان عزیز . حالتون چطوره ؟ امیدوارم که یک روز پاییزی زیبایی را در پیشرو داشته باشید . توجه به ظاهر یک فروشگاه بسیار اهمیت دارد و یکی از راه های موثر در جذب مشتریان و کاربران فروشگاه می باشد و در این اموزش ووکامرس با توجه به این اهمیت می خواهیم برای شما افزونه ای را معرفی کنیم که با استفاده از ان بتوانید اسلایدری برای محصولات فروشگاه خود ایجاد نمایید ، پس تا انتهای این آموزش ووکامرس و تنظیمات این افزونه ی ایجاد اسلایدر با ما همراه شوید .
آموزش ایجاد اسلایدر برای محصولات ووکامرس
فروشگاه ووکامرس خود را باید به گونه ای طراحی کنید که افرادی به فروشگاه شما می آیند در همان ابتدا جذب شوند و شما لازم است چه از نظر فنی و چه حالت ظاهری به فروشگاه خود توجه داشته باشید و برای آنها دسترسی سریع و آسان برای محصولات فروشگاه فراهم کنید یکی از این راه ها استفاده از اسلایدر محصولات در فروشگاه ووکامرس تان می باشد و باید توجه کنید که اسلایدر محصولات را در جای مناسبی قرار دهید .
فروشگاه اینترنتی بزرگ دارای محصولات بسیاری هستند که مسلما باید با تدبیر مدیریت کرد تا فروشگاه دچار بی نظمی نشود و اگر فروشگاهی به خوبی سازمان دهی نشده باشد ، مسلما بعد از مدتی مشتریان خود را از دست می دهد ، بنابر این باید از روشی در فروشگاه ووکامرس خود استفاده کنید که کاربران بتوانند به راحتی محصولات خود را پیدا کنند و لازم نباشد زمان طولانی صرف جست و جوی آنها کنند . با معرفی افزونه اسلایدر ووکامرس در اینجا شما می توانید برای فروشگاه خود یک اسلایدری برای محصولات داشته باشید و در ان جدیدترین محصولات خود را به مشتریان تان معرفی کنید .
برای شروع کار شما می توانید افزونه مورد نظر را از لینک زیر دانلود کنید و در پنل فروشگاه ووکامرس خود نصب نمایید و فعال سازید :
دانلود افزونه ی ایجاد اسلایدر WooCommerce Product Slider
پس از فعال سازی افزونه ی ایجاد اسلایدر به پنل وردپرس بروید و از بخش تنظیمات گزینه ی WooCommerce product slider را انتخاب نمایید و به صفحه ی تنظیمات افزونه بروید و دارای دو تب برای تنظیمات می باشد که در ادامه به آنها می پردازیم :
- General
- Advanced
تنظیمات تب General :
- Show featured image : برای نمایش تصاویر برجسته می توانید ، تیک گزینه را بزنید و فعال کنید .
- Show direction arrows : امکان قرار دادن فلش در دو طرف اسلایدر برای جابجایی تصاویر که برای فعال سازی تیک گزینه را بزنید .
- Show read more text : برای فعال سازی ادامه ی مطالب و یا بیشتر بدانید
- Show title : فعال سازی نمایش عنوان محصولات در اسلایدر
- Show excerpt : قابلیت فعال سازی نشان دادن محصولات منتخب
- Show price : قابلیت نمایش قیمت محصولات در اسلایدر
- Show add to cart button : ایجاد قابلیت افزودن به سبد خرید
- Show pagination : قابلیت نمایش صفحه بندی محصولات
- Featured image size : شما می توانید از منوی کشویی این بخش اندازه تصویر داخل اسلایدر را مشخص کنید .
- Auto scroll : قابلیت ایجاد و یا عدم ایجاد اسکرول در اسلایدر . یعنی حرکت اسلایدر محصولات ووکامرس به طور اتوماتیک
- Circular : توانایی نمایش محصولات به صورت دایره ای
- Excerpt length : تعیین اندازه طول اسلاید ها
- Read more text :قابلیت یا عدم قابلیت نمایش متن بیشتر . اگر می خواهید متن خود را وارد کنید .
- Categories/Terms : می توانید شما دسته ای از محصولات را که می خواهید در اسلایدر نمایش داده شود را وارد کنید .
- Number of posts : شما در اینجا باید تعداد مطالبی که می خواهید ، محصولات شان در اسلایدر نشان داده شود را تعیین کنید .
- Posts order : تعیین کنید که نمایش پست ها در اسلایدر شما به چه صورتی باشد ؟ از منوی کشویی آن یک مورد را انتخاب کنید
- Posts orderby : شخصی سازی پست محصولات چطوری باشد ؟ که به صورت پیش فرض تعیین شده و شما می توانید ، تغییر دهید .
- Transition effect : تعیین حالت نمایشی اسلایدر
- Timeout between elements : تعیین مدت زمان برای حرکت محصولات در اسلایدر
- Infinite : می توانید انتخاب کنید که تعدا محصولات بینهایت باشد یا نه ؟
- Align the items in Slider : تعیین محلی مناسب برای اسلایدر در صفحه ی مورد نظرتون
- General width of items : تعیین اندازه ی عرض اسلایدر
- General height of items : تعیین اندازه ی طول اسلایدر
- Pick text in excerpt field : انتخاب قرار گرفتن بخشی از متن در اسلایدر
- Touch Swipe : قابلیت فعال سازی و یا غیر فعال سازی در حالت های لمسی
- CSS3 Transtitions : قابلیت فعال سازی و یا غیر فعال سازی باکسی برای انجام تنظیمات شخصی CSS
- Direction to scroll the carousel : از منوی کشویی که وجود دارد تعیین کنید اسلایدر به کدام سمت اسکرول شود
- Direction arrows colour : تعیین رنگ مناسبی برای فلش ها
- Direction arrows background colour : انتخاب رنگ پس زمینه برای فلش ها
- Direction arrows hover colour : تعیین رنگ فلش ها در زمانی که موس بر روی انها قرار می گیرد
- Size of direction arrows : مشخص کردن اندازه فلش
- Default image URL :این گزینه برای زمانی هست که شما می خواهید اسلایدرتون به آدرسی که می خواهید ، منتقل شود
- Custom styles : انجام تنظیمات شخصی CSS
حال پس از انجام و تعیین هر یک از مقادیر این گزینه ، تنظیمات این تب را ذخیره نمایید تا به سراغ تب بعدی تنظیمات این افزونه ووکامرس برویم .
تنظیمات تب Advanced :
دوستان عزیز در این تب ، شما تنظیماتی مربوط به حالت لود شدن اسلایدر و تعیین زمان آن ، زمان آپلود تصاویر اشاره شده و .. که بهتره شما بگذارید این تنظیمات به صورت پیش فرض خود باقی بماند و تغییراتی را ایجاد نکنید ، اگر تغییراتی را انجام دادید ، ذخیره نمایید .
پس از انجام تنظیمات افزونه نوبت به قرار گیری آن در فروشگاه ووکامرس می باشد که شما می توانید آن را به سه صورت مختلف قرار دهید :
روش اول : کد کوتاه زیر را در برگه ی مورد نظرتون قرار دهید و منتشر کنید :
[wa-wps]
روش دوم : استفاده از کد کوتاه زیر برای قرار گیری اسلایدر در قالب وردپرس تون . یعنی شما می توانید از کد زیر در فایل هدر قالب خود استفاده کنید تا به عنوان اسلایدر اصلی شما حساب شود :
<?php echo do_shortcode('[wa-wps]'); ?>
روش سوم : این افزونه دارای ابزارک مخصوص به خود می باشد که شما می توانید به بخش نمایش و ابزارک ها بروید و ابزارک آن را انتخاب کنید تا در هر جایی که می خواهید قرار دهید و در نتیجه تغییرات را ذخیره نمایید .
حال شما مدیران می توانید یکی از سه روش فوق را انتخاب نمایید و اسلایدر نمایش محصولات را در فروشگاه ووکامرس تون قرار دهید . دوستان قبل از این که این آموزش را تموم کنیم ، بهتره که شما با بعضی از ویژگی های این افزونه ووکامرس آشنا شوید :
بعضی از ویژگی های افزونه ی ایجاد اسلایدر WooCommerce Product Slider :
- دارای تنظیمات ساده و قابل تنظیمی می باشد
- واکنش گرا و قابل استفاده برای موبایل
- دارای کدهای کوتاه برای برگه های وردپرس می باشد
- دارای ابزارک در بخش ابزارک ها می باشد
- بهینه سازی شده
- قابلیت قرار دادن کدهای اسلایدر در قالب وردپرس
و ویژگی های بسیار دیگری که شما می توانید با بررسی این افزونه ی ایجاد اسلایدر بدست آورید . از همراهی شما هم تا انتهای این بخش از آموزش صمیمانه متشکرم . با سری آموزش های بیگ تم با ما همراه باشید ، سوالات و مشکلات خود را در بخش نظرات با ما در میان بگذارید ، با ارزوی موفقیت روز افزون و سلامتی برای شما همراهان محترم
منبع : بیگ تم ارائه دهنده قالب وردپرس املاک – قالب وردپرس وبلاگی