کاربرد افزونه روولوشن اسلایدر

افزونه روولوشن اسلایدر (Slider revolution)، یکی از قدرتمندترین و بهترین افزونه های وردپرس در زمینه طراحی انواع اسلایدرها برای سایت است.

در این آموزش می خواهیم به طور کامل و مفصل کار با روولوشن اسلایدر را یاد بگیریم و ۰ تا ۱۰۰ نحوه کار، ایجاد و تنظیم اسلایدرهای جذاب و زیبا در یک سایت را بدون هیچ دانش برنامه نویسی با این افزونه محبوب یاد بگیریم.

در یک نگاه کلی هدف همه ما در طراحی سایت کسب رضایت کاربران و جلب توجه آن ها به سایت ماست.

این کار را باید با روش های صحیح و اصولی پیش ببریم تا هم در کسب رضایت کاربر و هم در جایگاه و رتبه در گوگل موفق باشیم.

یکی از بهترین روش ها که در این هدف ما موثر است، استفاده از اسلایدر در بخش های مختلف سایت است.

روولوشن اسلایدر چیست؟

Slider revolution پرفروش ترین و محبوب ترین افزونه اسلایدر وردپرس در دنیا است.

در مقاله اسلایدر وردپرس چیست، روولوشن را به عنوان قدرتمند ترین اسلایدر ساز معرفی کردیم و معرفی کوتاهی از آن انجام دادیم.

رابط کاربری آسان، سهولت در استفاده و سادگی کار با آن که افراد از سطح مبتدی تا حرفه ای می توانند با این افزونه کار کند و به ساخت اسلایدر در سایت خود بپردازند، در محبوبیت این اسلایدر ساز تاثیر زیادی دارد.

ویژگی های افزونه اسلایدر روولوشن

• پشتیبانی از انیمیشن های جالب برای المان ها
• تنظیمات ریسپانسیو بسیار مناسب
• سازگاری با اکثر پلاگین ها، قالب ها و صفحه ساز ها مانند ویژوال کامپوزر و المنتور
• رابط کاربری جذاب و قدرتمند
• امکان درون ریزی و برون ریزی اسلایدها
• و …

افزونه فارسی Slider Revoution برای وردپرس

اسلایدر رولوشن رایگان نیست.

در فروشگاه های آنلاین پلاگین ها می توانید افزونه روولوشن اسلایدر فارسی را خریداری کنید. فراموش نکنید که قبل از نصب لاینسس اسلاید روولوشن را از منبع خریدتان دریافت کرده باشید.

آموزش نصب افزونه روولوشن اسلایدر

در گام اول به سراغ نصب و فعال سازی Slider revolution می رویم. (اگر در نصب افزونه مشکلی داشتید آموزش نصب افزونه در وردپرس را مطالعه کنید.)

از سایت اصلی روولوشن اسلایدر آن را دانلود کنید.

در صفحه پیشخوان وردپرس از منوی افزونه ها پلاگین را نصب و Active کنید.

تا الان نسخه رایگان افزونه Slider Revolution را نصب و فعال کرده اید. حالا صفحه مدیریت خود را باز کنید.

نصب نسخه پریمیموم Slider revolution

نصب نسخه پولی Slider revolution هم بسیار آسان است و پیچیدگی خاصی ندارد.

در مسیر “داشبورد>افزونه ها> افزودن مورد جدید” بارگذاری پلاگین (upload plugin) را کلیک کنید.

فایلی که خریداری کردید را انتخاب کنید و روی Install Now کلیک کنید. سپس افزونه را فعال سازی کنید.

تنظیمات اصلی اسلایدر روولوشن

قبل از آن که شروع به ساخت اسلایدر برای سایت خود بکنید، تنظیمات آن را انجام دهید. انجام دقیق این تنظیمات مهم است چون با یک بار انجام دقیق آن در تمامی اسلایدرها عمل می کند.

تنظیمات ریسپانسیو پایه

امروزه اهمیت ریسپانسیو بودن سایت ها بسیار بالاست. چون بسیاری از کاربران امروزه از موبایل استفاده می کنند و در نتیجه بیشترین ترافیک شما مربوط به کاربران موبایل است.

برای اعمال تنظیمات این بخش مراحل زیر را دنبال کنید:

صفحه مدیریت سایت خود را باز کنید و slider revolution را انتخاب کنید.

در بالای صفحه تنظیمات عمومی را انتخاب کنید و در صفحه باز شده به تنظیماتی با عنوان” نقاط شکست شبکه به صورت پیش فرض” دقت کنید.

اگر دانشی در زمینه ریپانسیو کردن ندارید، برای تنظیم دقیق و بهتر این بخش از تنظیمات مقاله های طراحی ریسپانسیو به چه معناست و آموزش طراحی به صورت ریسپانسیو را مطالعه فرمایید.

آموزش ایجاد اسلایدر در اسلاید روولوشن

بعد از باز کردن این افزونه در صفحه اصلی آن ۴ گزینه را می بینید:

• ماژول خالی جدید
• ماژول جدید از الگو
• درون ریزی دستی
• افزودنی ها

افزودن اسلایدر جدید

گزینه ماژول خالی جدید را انتخاب کنید. در سمت راست منو تنظیمات اسلاید روولوشن، اولین گزینه نام است.

برای اسلایدر خود یک نام و نام مستعار انتخاب کنید.

( اهمیت نام مستعار برای اضافه کردن اسلایدر به صفحات مهم سایت در مراحل بعد است.)

انتخاب نوع اسلاید

بعد از نام گذاری باید از قسمت پوسته نوع اسلاید را انتخاب کنید. روی آن کلیک کنید تنظیمات آن در سمت راست باز می شود.

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

در انتخاب نوع اسلایدر ۳ انتخاب پیش رو داریم:

اسلایدر

اگر بیش از یک اسلاید دارید، این گزینه را انتخاب کنید.

صفحه

اگر یک اسلاید دارید این گزنیه را انتخاب کنید. در این گزینه فلش ها و گزینه ورق زدنی دیگر وجود ندارد.

چرخ و فلک

در این گزینه اسلاید ها به طور همزمان مشاهده می شوند. اسلایدر ها به صورت شعاعی و یا سه بعدی چرخانده می شوند.

گزینه پیش فرض

با استفاده از این قسمت مدت زمان نمایش اسلاید ها را مشخص کنید. در قسمت مدت زمان اسلاید زمان مورد نظر خود را مطابق واحد میلی ثانیه وارد کنید.

نحوه ناوبری اسلایدر ها

اگر بیش از یک اسلاید داشته باشید این گزینه به کار می آید. در این قسمت تنظیمات مربوط به فلش ها، بولت ها و … را انجام دهید.

اضافه کردن تصویر به اسلاید ها

در پنل تنظیمات افزونه و در گزینه های اسلاید پس زمینه را انتخاب کنید. تصاویر مورد نظر خود را بارگذاری کنید.

( از متناسب بودن اندازه تصویر شما با اسلایدر اطمینان پیدا کنید.)

تنظیمات عکس ها

اگر می خواهید تصویر را از جایی دیگر که آپلود شده است انتخاب کنید، در منبع تصویر خارجی را انتخاب کنید. و آدرس تصویر را وارد کنید.

در پیکر بندی تصاویر می توانید انتخاب کیند که تصویر چطور در اسلاید به شما نمایش داده شود. گزینه هایی مانند پس زمینه، تکرار یک تصویر و یا مواردی ماننند موقعیت و عنوان هم وجود دارد.

اضافه کردن لایه تصویری به اسلایدر

در منوی بالا، در تنظیمات اسلایدر، بخشی به نام افزودن لایه ها وجود دارند. در این قسمت می توانید لایه های مختلفی مانند متن، تصویر، دکمه، شکل، ویدیو، صدا، گروه و … را اضافه کنید.

تنظیمات لایه های اسلاید

محتوا

در این بخش می توان بارگذاری تنبل یا lazy load را تنظیم کرد.

حالت

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

سایز و موقعیت

تراز کردن لایه ها، به طور افقی و عمودی، با کلیک کردن روی یکی از نمادهای تراز قابل تغییر است. تنظیمات واکنشگرایی لایه مورد نظر را نیز می توانید در این لایه تنظیم کنید.

انیمیشن

در این قسمت تحرک هر کدام از لایه ها مانند خروج و ورود را تنظیم می کنیم.

شناور

وقتی می خواهید لایه شما به یک روش دیگر فعال شود، باید رفتار شناور را برای آن تظیم کنید. برای نمونه در اولین لیست کشویی، گزینه های مکان نما را تنظیم کنید.

در پیمایش

اگر می خواهید لایه جدیدی که روی اسلاید خود فعال کرده اید با اسکرول موس حرکت کند، در این قسمت آن را فعال کنید.

از سه گزینه ای که وجود دارد استفاده کنید و هر کدام از آن ها امتحان کنید.

Actions

در این بخش می توانید لایه های خود را تعاملی کنید. یعنی وقتی کاربر روی آن کلیک می کند می تواند یک لایه را باز کند.

افزودن لایه متنی به اسلایدر

در این قسمت حتما قبل از اضافه کردن لایه متنی مورد نظر خود به رنگ متن و فونت آن فکر کنید و یک ایده از قبل د رذهن خود داشته باشید.

روی افزودن لایه متن کلیک کنید. عنوان یا متن ساده را بنا به دلخواه خود انتخاب کنید. متن مورد نظر خود را تایپ کنید.

افزودن فونت به لایه متن

به تب استایل (حالت) بروید. علاوه بر فونت، اندازه و رنگ قلم را هم می توانید انتخاب کنید.

تنظیمات visibility

ممکن است بعضی اوقات بخواهید دکمه، توضیحات یا تصویری فقط در حالت دکستاپ نمایش داده شود.

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

قابلیت visibility این مفهوم را برای شما عملی می کند. از قابلیت visibility هر لایه استفاده کنید.

بهتر است با یک مثال visibility را برای شما توضیح می دهیم.

فرض کنید می خواهید یک تصویر زمینه متفاوت در موبایل نمایش داده شود که در بقیه حالت ها مخفی باشد.

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

تصویر را در زیر لایه های دکمه و متن خود قرار دهید و اندازه آن را تغییر دهید تا منطقه اسلاید را کامل کند.

لایه تصویر را انتخاب کنید و تنظیمات visibility را انتخاب کنید.

سپس مشخص کنید این لایه در کدام یک نمایش های دکستاپ، تبلت و یا موبایل مخفی باشد. (فقط موبایل را در این مثال فعال کنید.)

انیمیشن اسلایدر رولوشن

برای اضافه کردن انیمیشن به اسلاید، آیکون اسلاید ها را انتخاب کنید. از بخش تنظیمات Animation، پیش نمایش انیمیشن دلخواه خود را ببینید و روی گزینه افزودن انتقال کلیک کنید

نحوه لینک دادن به دکمه، متن یا لایه در روولوشن اسلایدر

نحوه لینک دادن در روولوشن اسلایدر کاملا مشابه هم است. به طور مثال با یاد گرفتن لینک دادن به دکمه می توانید به یک لایه متنی هم لینک را اضافه کنید و تنظیمات دلخواه خود را روی آن پیاده سازی کنید.

لینک دادن به دکمه در اسلایدر رولوشن

لینک دادن به دکمه در اسلایدر روولوشن در واقع قرار دادن حداقل یک دکمه کال تو اکشن call to action در یکی از اسلاید ها است. دکمه های call to action کاربران را تشویق به انجام کاری می کنند و کاربرد مناسبی نیز دارند.

ابتدا از منوی بالا از بخش اضافه کردن لایه ها گزینه Button (دکمه) را انتخاب کنید. در سمت راست صفحه شکل ظاهری دکمه را انتخاب کنید. شکل دکمه انواع مختلفی دارند. ساده، با قابلیت باز شدن منویی، اسکرول کردن صفحه و یا next slide.

(بنا به نیاز خود در طراحی اسلایدر ها و کارایی دکمه ها می توانید آن ها را طراحی کنید.)

شکل دکمه خود را انتخاب کنید و از بخش Size و Pos، جایگاه دکمه را انتخاب کنید.

با انتخاب content می توانید محتوای دکمه ایجاد شده را تغییر دهید.

ابتدا در پایین صفحه  لایه مورد نظر خود را انتخاب کنید. از تنظیمات سمت راست گزینه Actions را انتخاب کنید و در پنجره کنید.

در منوی Actions  با تنظیمات زیر را می بینید:

Actions Type

گزینه Simple Link (لینک ساده) را انتخاب کنید.

Link URL

URL صفحه ای که می خواهید از طریق کلیک روی دکمه به آن صفحه هدایت شود را جایگذاری کنید.

Protocol

بهتر است روی گزینه keep as it is قرار دهید..

Target

مشخص کنید که لینک در همان صفحه باز شود یا در یک صفحه جدید.

Follow

این گزینه بیشتر به دانش سئوی شما نیاز دارد. در حالت کلی اگر از لینک داخلی یعنی لینک های سایت خودتان استفاده می کنید آن را روی گزینه Follow Link و اگر از لینک های خارجی استفاده می کنید روی گزینه No Follow قرار دهید.

باقی موارد را همان گونه و بدون تغییر ذخیره کنید.

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

برای اضافه کردن یک اسلایدر به یک صفحه باید شورت کد آن را از تنظیمات عمومی بخش ثبت نام و عنوان کپی کنید.

به قسمت متن صفحه خود بروید و درهر کجا که می خواهید اسلایدر نمایش داده شود، کد کوتاه را قرار دهید. سپس صفحه را به روز رسانی کنید.

تا زمانی که در حال انجام تغییرات روی اسلایدر خود هستید می توانید پیش نمایش زنده ای از اسلایدر خود مشاهده کنید.

دقت کنید که هر بار با ایجاد تغییرات دکمه ذخیره را بزنید و سپس با لود کردن دوباره صفحه تغییرات خود را مشاهده کنید.

حرف آخر

در مقاله کار با روولوشن اسلایدر سعی کرده ایم آموزش کاملی از این پلاگین قدرتمند را خدمت شما ارائه دهیم.

امیدواریم با کمی تلاش و انگیزه در یادگیری حرفه ای این پلاگین بتوانید بهترین و زیبا ترین اسلایدر ها را طراحی کنید.

موفق باشید