برای زیباتر کردن و نمایش برخی موارد به اسلایدر نیاز خواهید داشت . با استفاده از اموزش ایجاد اسلایدر در وردپرس و افزونه Smart Slider 3 میتوانید این بخش را به سایت وردپرسی خود اضافه کنید
در وردپرس افزونه های زیادی برای ایجاد اسلایدر وجود دارد اما شاید هیچکدام به اندازه افزونه Smart Slider 3 کاربردی نباشد . این افزونه یک افزونه رایگان است که با استفاده از آن میتوانید به سادگی هر نوع اسلایدری بسازید
برخی از امکانات افزونه ایجاد اسلایدر در وردپرس Smart Slider 3 :
ایمپورت کردن اسلایدر ها
امکان انتخاب پست وردپرس ، تصویر و حتی ویدیو
اسلاید استاتیک
امکان اسلایدر لمسی
حالت اسلایدر تمام صفحه
امکان انتخاب انمیشین اسلاید ها
امکان نمایش خودکار
سئو و بهینه شده
دارای قابلیت اسلایدر لایه ای
و …
آموزش استفاده از افزونه ایجاد اسلایدر در وردپرس Smart Slider 3 :
برای شروع افزونه را دانلود و سپس از طریق آموزش نصب افزونه ان را نصب کنید . بعد از نصب در منو پیشخوان وردپرس یک گزینه جدید به نام Smart Slider ساخته خواهد شد . بر روی ان کلیک کرده تا وارد صفحه تنظیمات و ایجاد اسلایدر شوید
تصویر بالا صفحه ایست که با کلیل بر روی منو smart slider ظاهر میشود و در واقع صفحه پیشخوان این افزونه است . برای شروع به سراغ منو تنظیمات که در بالا سمت چپ است میرویم . پس بر روی این منو کلیک کنید تا وارد صفحه زیر شوید
در صفحه تنظیمات چهار تب وجود دارد که هر یک برای کاری ساخته شده اند . مرحله به مرحله هر یک را توضیح خواهیم داد
1- تنظیمات عمومی
این تب همانطور که از اسمش پیداست شامل تنظیماتی عمومی و کلی می باشد
Show help beacon : نمایش توضیحات راهنمای افزونه
: نمایش و یا عدم نمایش ویدیو افزونه بعد از بروزرسانی ها
: نمایش و یا عدم نمایش گیام نیاز به بروزرسانی افزونه
: به طور مثال زمانی که دامنه خود را تغییر داده اید میتوانید با این روش تصاویر را از سایت قدیمی به سایت جدید منتقل کنید
: وارد کردن فایل css برای نمایش در ادیتور افزونه
: این گزینه باعث میشود تا نمیشن ها بهتر مشاهده شوند
: برای اتصال سرور و اسلایدر
: نمایش پیش نمایش اسلایدر در صفحه جدید
: نمایش ایکون این افزونه در ادیتور وردپرس
: نمایش افزونه در نوار مدیریت
: افزودن تصاویر در سایت مپ افزونه yoast
: ایجاد ناحیه ابزارک
: برای تبدیل ajax به iframe در نمایش اسلایدر
: فعال سازی حالت حریم خصوصی یوتیوب
: تغییر سرعت اسکرول اسلایدر
Responsive mode : تنظیمات مربوط به ریسپانسیو
Cache : حذف کش اسلایدر افزونه
2- Framework settings
: برای زمانی که سرور مشکل اتصال خروجی دارد استفاده میشود و در واقع سرور دوم افزونه است
: برای آدرس دهی به تصاویر
: اگر میخواهید همیشه این افزونه انگلیسی باشد این گزینه را فعال کنید
جاوا اسکریپت : تنظیمات مربطو به جی کوئری و جاوا اسکریپت افزونه
css : تنظیمات مربوط به css افزونه که برای انتخاب نوع نمایش css ها می باشد
درخواست Api : جهت دریافت api
3- فونت ها
این تب شامل تنظیمات مربوط به انتخاب فونت می باشد
فونت پیشفرض : در بین لیست فونت ها میتوانید فونت های افزونه را انتخاب کنید
Google : انتخاب و تنظیمات فونت های گوگل
4- اسلایدر پیش فرض
این بخش شامل تنظیمات المان های اسلایدر می باشد
فونت : میتوانید فونت هر بخش را وارد کنید ، اندازه و رنگ و در واقع تنظیمات نوشته ها را وارد کنید
استایل : استایل هر بخش را میتوانید از این بخش تنظیم کنید
حالا که با تنظیمات افزونه کاملا اشنا شدیم بهتر است به سراغ ساخت یک اسلاید برویم
برای اینکار دوباره بر روی منو smart slider کلیک کنید تا وارد صفحه پیشخوان شوید . در صفحه پیشخوان شما 3 گزینه پیش روی خود دارد که به شرح زیر هستند
new slider : ساخت یک اسلایدر جدید
Template library : انتخاب یک اسلایدر از لیست اسلایدر های پیشفرض افزونه
Sample Slider : یک اسلایدر نمونه که خود افزونه برای یاد دادن به ما ساخته است
تصمیم با شماست که میخواهید از کدام گزینه استفاده کنید ولی ما در این اموزش قصد داریم یک اسلایدر جدید بسازیم پس بر روی new slider کلیک میکنیم . بعد از کلیک بر روی این دکمه یک صفحه پاپ آپ به شکل زیر باز میشود
در این صفحه نیز چندین گزینه وجود دارد که باید طبق راهنمای زیر انها را تکمیل کنید
نام اسلایدر : نام اسلایدری که قصد ساخت ان را دارید وارد کنید
عرض : عرض اسلایدر خود را بر طبق پیکسل وارد کنید
ارتفاع: ارتفاع اسلایدر خود را وارد کنید
طرح پیشفرض : طرح پیشفرض اسلایدری که میخواهید بسازید را از بین سه طرح افزونه انتخاب کنید
import sample sliders : وارد کردن یک اسلایدر پیشفرض
بعد از تکمیل این گزینه ها بر روی دکمه ایجاد کلیک کنید . حالا وارد صفحه اسلایدر جدید شده اید که در این صفحه میتاونید هر اسلایدی وارد کنید
در این صفحه باید بر روی slide #1 کلیک کنید و اولین تصویر خود را وارد کنید بعد از وارد کردن تصویر صفحه دچار یک تغییر شده و تعداد زیادی گزینه جدید اضافه خواهد شد . که این گزینه ها را باید طبق راهنمای زیر تکمیل کنید
در ادامه ایجاد اسلایدر با افزونه smart slider 3 دو نوار وجود دارد که هر نوار شامل چندین تب می باشد . با یاد گرفتن این تب ها ساخت اسلایدر تقریبا به پیان خود نزدیک خواهد شد
نوار اول شامل تب های زیر است
انتشار : روش های انتشار اسلایدر که شامل شورت کد ، کد php و افزودن از ویرایشگر است
اصلی : این تب شامل مواردی چون تنظبمات انمیشن ، نام تصویر ، اندازه تصویر و … می باشد
سایز : در این تب میتوانید اندازه تصویر و همچنین تمام صفحه بودن ان را انتخاب کنید
Autoplay : فعال کردن حرکت خودکار اسلایدر
Optimize : بهینه سازی تصاویر این اسلایدر
Loading : تنظیمات مربوط به لود کننده
Developer : تنظیماتی برای افراد برنامه نویس
و همچنین نوار دوم شامل تب های زیر می باشد
Arrows : تنظیمات مربطو به فلش های اسلایدر
Bullets : تنظیمات مربوط به دایره های کوچک اسلایدر
Text Bar : تنظیمات مربوط به جایگاه نمایش متن اسلاید
Thumbnails : فعال کردن تصاویر کوچک در زیر اسلاید اصلی
Shadows : فعال کردن سایه برای تصویر
این دو نوار تمام تنظیماتی هستند که میتاونید برای یک اسلایدر انجام دهید . اما هنوز کار شما برای ساخت اسلایدر تمام نشده
شما تصویر را اضافه کردید اما هنوز فقط یک تصویر ساده است و هیچ متن و یا تصویر دیگری بر روی ان قرار نداده اید . برای اینکار کافیست برای روی تصویر ایستاده و سپس بر روی ویرایش کلیک کنید . حالا یک ویرایشگر زنده برای شما باز خواهد شد که میتوانید هر چیزی را به تصویر خود اضافه کنید
ساخت اسلایدر در همینجا به پایان میرسد ولی باید دقت کنید که بعد از انجام تمام این کار ها حتما بر روی دکمه ذخیره کلیک کنید