سایت هایی که در سطح اینترنت وجود دارند از تصاویر متحرک در هدر سایت خود استفاده می کنند در واقع همین تصاویر متحرک یک پیش نمایش از موضوع سایت را در اختیار کاربران می گذارد . قرار دادن اسلایدر یکی از راه های جذاب و در جهت زیبا نمودن اکثر سایت ها ،استفاده می شوند . یکی از راه ها و مسائلی که در هر سایت دیده می شود و همه مدیران سایت برای بالا جذابیت و جالبی سایت بدان نیازمند هستند همین قرار دادن اسلایدر در سایت هاست . داشتن وبسایت های مختلف و قرار دادن اسلایدر در صفحات اصلی یا در برخی مطالب که می تواند از نوع اسلایدر های حرفه ای یا ساده باشد از نظر کاربران مهم و کاربردی هستند . وردپرس دارای اسلایدر های بسیاری است چرا که افزونه های زیادی برای این کار طراحی و ساخته شده اند .
در این مطلب می‌خوانید:
ساخت اسلایدر در وردپرس با افزونه revolution slider
اگر مایلید که سایت خود را با اسلایدر های شیک و زیبا تزیین فرمایید می توانید از این افزونه استفاده کنید ، این افزونه بسیار منعطف و واکنشگرا می باشد و بر روی انواع قالب ها از جمله فروشگاهی , خبری , وبلاگی و … بدون هیچ گونه مشکلی نصب می شود .
شما دوستداران می توانید با راه های زیر اسلایدشو خود را در وردپرس قرار دهید :
- می توانید کد اسلایدشو را در قالب وردپرس قرار دهید .
- به راحتی می توانید بصورت ابزارک در قالب قرار دهید .
- قادر می باشید که بصورت شورت کد در نوشته ها و برگه های سایت وردپرسی قرار دهید .
افزودن اسلایدر حرفه ای در وردپرس با Slider by Supsystic
ابتدا باید افزونه را دریافت کنید سپس آن را در بخش مدیریت در قسمت افزونه های نصب و فعال سازی کنید سپس در بخش منوی سایت این افزونه را خواهید دید بر روی آن کلیک کرده و گزینه New Slider را بفشارید ، یک نام برای اسلایدر خود در نظر بگیرید بعد نوع اسلایدر را انتخاب و بر روی دکمه save کلیک کنید .
در صفحه ی بعدی با دو ستون مواجه اید ستون سمت راست تنظیمات کلی افزونه قرار دارد . این تنظیمات عبارتند از :
- Slider name : نام اسلایدر را تغییر و از این قسمت اضافه کنید .
- Shortcode : شورت اسلایدر را بر داشته و در صفحه و نوشته ی خود به کار ببرید .
- Slider width : عرض سایت خود را برگزینید اگر خواستید تمام صفحه باشد ، واحد را بر روی percent قرار دهید و مقدار را ۱۰۰ بگذارید .
- Slider height: ارتفاع اسلایدر خود را مشخص کنید .
- Mode : این قسمت برای نوع رد شدن اسلایدر است . مقدار این گزینه را بر روی fade قرار دهید چرا که در غیر این صورت اسلایدر کار نخواهد کرد .
- Step : مقدار آن بر روی یک باشد بسیار بهتر است چرا که این گزینه تعداد فاصله ی پرش یک اسلاید به اسلاید دیگر را مشخص می کند .
- Autoplay video : اگر اسلایدر شما از نوع ویدئو باشد باید این گزینه را بر روی yes قرار دهید .
- Autostart Slideshow : با این گزینه اسلایدر شما بعد از لود شدن کامل به صورت خودکار اجرا خواهد شد .
- Slideshow Controls : با این گزینه می توانید کنترلر اسلایدر را نمایش دهید .
- Navigation : این گزینه را بر روی standard قرار دهید چرا که این گزینه مربوط به جهت یابی است .
- Captions : با فعال نمودن این گزینه یک کپشن برای هر اسلایدر به وجود می آید که می توانید در آن تنظیماتی از جمله رنگ متن، سایز فونت، چینش متن، خانواده فونت، رنگ بک گراند و شفافیت بک گراند را برای کپشن مشخص کنید .
- Transition Speed : سرعت تغییر حالت از یک اسلایدر به اسلایدر دیگر بر حسب میلی متر
- Starting Slide : برای نمایش رندوم اسلاید ها
- Easing : نوع افکت نمایشی در حین تغییر حالت اسلایدر
- Enable Touch : فعال کردن/غیر فعال کردن تغییر اسلاید ها در گوشی و تبلت
- One-to-One Touch : تغییر یک به یک اسلاید ها در گوشی و تبلت
- Enable Pager : با این گزینه خروجی برروی هر یک از اسلاید ها قرار می گیرد
ستون سمت چپ تنظیمات مربوط به اسلایدر است با کلیک بر روی Add Image تصاویر خود را انتخاب و با Change Slider آنها را به طور کامل تغییر دهید .
- Caption : توضیح پایین هر تصویر را در اینجا وارد کنید .
- Link : می توانید بر روی هر تصویر یک لینک در نظر بگیرید .
- SEO : متن جایگزین برای زمانی که تصویر به طور کامل لود نشده است .
- Crop : برای برش تصویر از این گزینه استفاده کنید .
یکی دیگر از گزینه های اصلی افزونه گزینه ی Sliders است شما در این صفحه تمام اسلایدر هایی که از قبل ایجاد شده است را مشاهده می کنید . برای نمایش خروجی اسلایدر باید از کد پی اچ پی آن استفاده کنید .
ساخت اسلایدر با افزونه ی Meta Slider
یکی دیگر از افزونه هایی که می توان برای ساخت اسلایدر از آن استفاده کرد این مورد می باشد چرا که به راحتی می توان 4 مدل مختلف اسلایدر را با آن ایجاد کنیم . این افزونه وردپرس بسیار قدرتمند است و کاملا دارای قابلیت ریسپانسیو و منعطف می باشد و شامل انواع اسلایدر های “Nivo Slider، Flex Slider، Coin Slider و Responsive Slides می شود.
این افزونه را یافته و سپس نصب و فعال سازی کنید بعد مشاهده خواهید کرد که در منوی سمت راست دکمه ای با عنوان Meta Slider اضافه شده است ، دو نسخه ی رایگان و پرمیوم در دسترس شما است . در استفاده از نسخه ی رایگان این افزونه بر روی آیکون + کلیک کنید صفحه ای برای شما ظاهر می شود که در آن می توانید 4 نوع اسلایدر را مشخص کنید که شما می توانید هر یک از آنها را انتخاب کنید .
- Flex Slider
- Responsive Slides
- Nivo Slider
- Coin Slider
شما از هر 4 نوع می توانید استفاده کنید . در قسمت عرض و ارتفاع می توانید اندازه های دلخواه را وارد کنید سپس نوع افکت را از منوی کشویی مشخص کنید ، از سمت راست تصاویر مورد نظر خود را اضافه کنید بعد از انجام تنظیمات لازم بر روی گزینه ی ذخیره کلیک کنید . حال نوبت آن رسیده است که اسلایدر خود را به نمایش گذارید .
قرار گرفتن در برگه ها
[metaslider id=ID number]
قرار گرفتن در قالب
; ?> <?php echo do_shortcode(“[metaslider id=ID Number]”)
ساخت اسلایدر وردپرس با Owl Carousel
با این افزونه ی قدرتمند می توانید انواع اسلایدر ها را در وب سایت خود ایجاد کنید برخی از ویژگی های این افزونه را می توان نام برد که عبارتند از :
- کدنویسی استاندارد و معتبر html و css
- طراحی واکنشگرا یا ریسپانسیو
- قابلیت ساخت اسلایدر متنی و تصویری
- پشتیبانی از فیلم و ویدیو در اسلایدر
- امکان نمایش چندین اسلاید به شکل همزمان
- دارای کلیدهای اسلاید قبلی و بعدی
- برخورداری از افکتهای متفاوت و متنوع
- قابلیت نمایش صفحه بندی و تعداد اسلایدها
- قابلیت ساخت دکمه حرکت و ایست
- پشتیبانی از lazy load لیزی لود تصاویر
ساخت اسلایدر وردپرس slideshow با Cyclone slider
هر یک برای ساخت اسلایدر های حرفه ای برای سایت خود باید از افزونه های پرمیوم استفاده کرد . امروزه افزونه های رایگانی برای آموزش وردپرس برای شما دوستداران گرامی معرفی می کنیم که می توانید اسلایدر های حرفه ای برای وبسایت خود بسازید و با این کار ظاهر سایت خود را زیبا تر و حرفه ای تر به نمایش بگذارید .
نصب و تنظیمات Cyclone slider
این افزونه ساخت اسلایدر در وردپرس را یافته و نصب و فعالسازی کنید ، بعد از فعالسازی گزینه ی اسلایدر به پنل مدیریتی شما اضافه می شود.
برای اضافه کردن و ساخت اسلایدر وارد افزونه مورد نظر خود شوید در ابتدا یک نام برای اسلایدر خود در بگیرید اگر این نام لاتین باشد بهتر خواهد بود . بر روی دکمه Add Images as slids کلیک کرده تا بتوانید تمام تصاویر دلخواه خود را وارد سایت نمایید از قسمت Templates یک حالت زیبا و دلخواه را برای نمایش اسلایدر خود انتخاب کنید ، بعد برای تغییر آیدی عبارت کادر کد اسلایدشو را تغییر دهید .
برای هر یک از اسلاید ها می توانید عنوان مناسب ، لینک ، افکت و همچنین ویژگی در نظر بگیرید ولی برای انجام تنظیمات کلی باید از نوار کناری سمت چپ استفاده کنید در این بخش می توانید سایز تصاویر ، حالت نمایش ریسپانسیو بودن ، سرعت حرکت اسلاید و… را تعیین کنید .
حال نوبت نمایش اسلایدر در سایت است بعد از انجام تنظیمات لازم باید اسلایدر های خود را منتشر کنید بعد از انجام این کار در بخش دریافت کد اسلایدر کد مربوط به اسلایدر را مشاهده خواهید کرد . حال تنها باید کد کوتاه را در صفحه یا نوشته ی مورد نظر خود قرار دهید ولی برای آنکه اسلایدر را در قالب نشان دهید باید از کدهای php استفاده کنید .
از قابلیت های دیگر این افزونه می توان به موارد زیر اشاره کرد :
- امکان لینک کردن و یا دادن به تصاویر
- دادن افکت ها به تمام تصاویر
- برخورداری از خاصیت ریسپانسیو
- قرار دادن زمان نمایش برای تصاویر
- تغیین زمان برای تغییر افکت های تصاویر
- قابلیت تغییر اندازه تصاویر
- امکان برون بری و درون ریزی اسلایدر
- و …
در صورتی که بخواهید اسلایدر را در ساید بار و فوتر نمایش دهید باید وارد بخش ابزارک های سایت شوید سپس افزونه را در قسمتی که مایلید نمایش داده شود ، قرار دهید .
ساخت اسلایدر با استفاده از جی کوئری
ما با استفاده از کد ها نیز می توانیم اسلایدر های زیبا و سبک را در سایت خود ایجاد کنیم . در زیر کد های HTML را در اختیار شما قرار می دهیم که در هر جای سایت که آن را قرار دهید اسلایدر را به شما نشان خواهد داد . شما در کد زیر در فیلد src آدرس تصویر خود را قرار می دهید
و در انتها نوبت به اضافه کردن کد جی کوئری می رسد این کد ها را باید در انتهای صفحه ای که کد های اچ تی ام ال را قرار داده اید ، بگذارید .
