ساخت اسلایدر جی کوئری در وردپرس با Responsive jQuery Slider

اسلایدر جی کوئری در وردپرس

سلام خدمت تمامی کاربران عزیز همیار وردپرس؛
یکی از جلوه های خاص هر وب سایت، وجود تصاویری در صفحات با عنوان اسلایدر می باشد که بیانگر فعالیت ها و خدمات آن وب سایت می باشد. افزونه های زیادی در زمینه ساخت اسلایدر در وردپرس وجود دارد ولی این افزونه بیش از ۹۰ درصد آن دارای افکت خاصی ندارد و اغلب به صورت ساده و بدون افکت می باشدو در واقع اسلایدر جی کوئری در وردپرس محسوب می شود.

اسلایدر جی کوئری در وردپرس با Responsive jQuery Slider

این افزونه کاربردی وردپرس در مخزن بزرگ وردپرس برای ساخت اسلایدر جی کوئری در وردپرس به کار می رود و تا کنون بیش از ۵۰۰ دانلود و نصب و فعال سازی شده است و جزو افزونه های تازه و نوپا در زمینه اسلایدر ها می باشد.

توضیحات مختصر!!!

این افزونه کاربردی وردپرس توسط تیم CHR Designer طراحی و برنامه نویسی شده است و از آخرین بروزرسانی این افزونه کاربردی وردپرس حدود ۲ سال نیز می گذرد. در حال حاظر آخرین نسخه این افزونه کاربردی وردپرس، نسخه ۱.۱.۱ می باشد که نسخه کاملا تکمیل شده آن نیز می باشد.
این افزونه کاربردی وردپرس از نسخه ۴.۰.۱۶ می باشد و در نسخه های پایین تر آن قابل اجرا نیست و بهتر است از آن در نسخه های پایین تر استفاده نکنید.

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

آموزش کار با افزونه

responsive jquery slider - اسلایدر جی کوئری در وردپرس

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

open-settings-hamyarwp-اسلایدر جی کوئری در وردپرس

در این قسمت شما می بایستی Caption اول را مشخص کنید که در بخش اول می بایستی موقعیت مکانی را مشخص کنیم که دارای دو مقدار Align Left به معنی ترازبندی از چپ و Align Right به معنای ترازبندی از راست می باشد . در قدم بعدی در TextBox رو به رویی متنی قرار میدهیم.

Font Size: در این قسمت می بایستی اندازه فونت مورد نظر را مشخص کنید.
Font Color: در این قسمت رنگ متن را مشخص میکنیم و در بخش بعدی که تحت عنوان Background Color می باشد می بایستی پس زمینه آن را مشخص کنیم.

سه بخش دیگر Caption نیز مانند تنظیمات همین بخش می باشد که شما میتوانید به اسانی هر چه تمام تر آنها را نیز تکمیل نمایید.

caption

caption-اسلایدر جی کوئری در وردپرس

 شما می بایستی در این بخش دکمه اسلایدر مورد نظر را مشخص کنید. در بخش Caption Button متن داخل دکمه و در بخش بعدی لینک مورد نظر و یا اگر میخواهید برگه ای از خود وردپرس خود را لینک دهی کنیم از قسمت Select the destiny post/page میتوانیم این امر را انجام دهیم.

قسمت های بعدی قسمت رنگ بندی و در انتهای تنظیمات که بخش Border Radius می باشد باید نرمی دور دکمه را مشخص کنیم .

caption button

button-اسلایدر جی کوئری در وردپرس

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

images-اسلایدر جی کوئری در وردپرس

نکته: برای ایجاد تصاویر متعدد به همان شیوه که عرض کردم، تصاویر جدید با اسلایدر های جدیدتری ایجاد میکنیم.

images-اسلایدر جی کوئری در وردپرس

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

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

rgs-open-اسلایدر جی کوئری در وردپرس

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

shortcode-hamyarwp-اسلایدر جی کوئری در وردپرس

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

shortcode-hamyarwp-اسلایدر جی کوئری در وردپرس

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

output-hamyarwp-اسلایدر جی کوئری در وردپرس

موفق باشید.

دانلود افزونه Responsive jQuery Slider

دانلودصفحه افزونه

آیا این مقاله برای شما مفید بود؟
تقریبا
خیر

دیدگاهتان را بنویسید

ارسال دیدگاه به معنی این است که شما ابتدا قوانین ارسال دیدگاه را مطالعه کرده‌اید و با آن موافق هستید.