ویجت چرخشی (carousel) در المنتور

نمایش محتوای پویا و جذاب

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

ویجت چرخشی امکانات متنوعی ارائه می‌دهد. می‌توان تصاویر، عنوان‌ها، توضیحات کوتاه و لینک‌ها را به هر اسلاید اضافه کرد و ترتیب نمایش آن‌ها را مشخص نمود. همچنین امکان تنظیم سرعت چرخش، افکت‌های انتقال، نمایش خودکار یا دستی و تغییر اندازه و رنگ المان‌ها وجود دارد تا ظاهر چرخشی با طراحی کلی سایت هماهنگ شود. این ویژگی‌ها باعث می‌شوند محتوای چرخشی هم جذاب و هم قابل تعامل باشد و کاربران با آن به راحتی ارتباط برقرار کنند.

بخش محتوا در ویجت چرخشی المنتور

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

گزینه کاروسل تصویر در carousel المنتور

در این بخش شما تنظیمات پایه‌ ای گالری چرخشی خود را مدیریت میکنید. در ابتدا با کلیک روی بخش هیچ عکسی انتخاب نشده تصاویر مورد نظر خود را از کتابخانه رسانه انتخاب میکنید. سپس میتوانید رزولوشن تصویر را برای بهینه سازی سرعت بارگذاری مثلا Thumbnail - 150 x 150 یا اندازه های بزرگتر مشخص کنید. در تنظیمات اسلایدها جهت نمایش و اسلایدها جهت پیمایش تعداد اسلایدهایی که همزمان نمایش داده میشوند و تعداد اسلایدهایی که در هر حرکت اسکرول میشوند معمولا روی پیش فرض یا ۱ تنظیم میشوند را تعیین میکنید. گزینه کشش تصویرکشیدن تصاویر برای پر کردن فضای اسلاید را میتوانید فعال یا روی خیر تنظیم کنید. در نهایت بخش ناوبری به شما اجازه میدهد نوع کنترل های کاروسل را انتخاب کنید مثلا پیکان ها و نقطه ها و حتی میتوانید آیکون فلش مورد استفاده برای حرکت بین اسلایدها را سفارشی سازی نمایید.

گزینه های اضافی در ویجت چرخشی المنتور

در بخش گزینه های اضافی المنتور، گزینه‌های متعددی برای کنترل رفتار و انیمیشن اسلایدشو وجود دارد. فعال کردن بارگذاری تنبل باعث می‌شود تصاویر فقط هنگام نیاز بارگذاری شوند که سرعت صفحه را افزایش می‌ دهد. می‌توانید پخش خودکاررا فعال کنید و با استفاده از سرعت پخش خودکار زمان مکث بین اسلایدها را بر حسب میلی‌ ثانیه مثلاً ۵۰۰۰ تنظیم کنید. گزینه‌ های توقف هنگام هاور و مکث در واکنش نیز برای بهبود تجربه کاربری و توقف حرکت هنگام تعامل کاربر با کاروسل طراحی شده‌ اند. فعال کردن حلقه بی‌ نهایت چرخش مداوم اسلایدها را تضمین می‌ کند و سرعت انیمیشن مثلاً ۵۰۰ میلی‌ ثانیه مدت زمان انتقال بین اسلایدها را مشخص می‌ نماید و در نهایت می‌ توانید جهت حرکت اسلایدها را نیز تعیین کنید.

بخش استایل در ویجت چرخشی وردپرس

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

بخش ناوبری در المان چرخشی المنتور

در بخش ناوبری (Navigation) المان های چرخشی مانند کاروسل تصویر در المنتور شما نحوه تعامل کاربر برای حرکت بین اسلایدها را مدیریت میکنید. این تنظیمات به شما اجازه میدهند که نوع کنترل ها را انتخاب کنید مثلا استفاده همزمان از پیکان ها و نقطه ها، فقط پیکان ها، فقط نقطه ها، یا هیچکدام. همچنین میتوانید از طریق تنظیمات استایل مرتبط با این بخش ظاهر این عناصر ناوبری را کاملا سفارشی کنید؛ از جمله تغییر رنگ اندازه و موقعیت قرارگیری پیکانها در داخل یا خارج کاروسل و تعیین رنگ نقطه ها در حالت عادی و فعال برای هماهنگی کامل با طراحی بصری وبسایت.

گزینه تصویر در ویجت carousel  المنتور

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

بخش پیشرفته در ویجت چرخشی المنتور

در بخش پیشرفته (Advanced) تنظیمات هر المانی در المنتور گزینه های استاندارد و قدرتمندی برای کنترل موقعیت و ظاهر المان در سطح صفحه وجود دارد. این تنظیمات شامل مواردی مانند مدیریت مارجین فاصله بیرونی و پدینگ فاصله داخلی برای ایجاد فضای مناسب اطراف المان تنظیم کلاس های CSS سفارشی یا شناسه های ID برای استایل دهی بیشتر با کدنویسی دلخواه و کنترل واکنش گرایی جهت تعیین نمایش یا عدم نمایش المان در دستگاه های مختلف موبایل تبلت و دسکتاپ میباشد. همچنین افکت های حرکتی و تنظیمات مربوط به پس زمینه و حاشیه ها نیز در این بخش قابل دسترسی هستند.

بخش طرح بندی در المان carousel المنتور

در بخش طرح بندی (Layout) که زیرمجموعه تنظیمات پیشرفته شما میتوانید نحوه قرارگیری و رفتار المان در صفحه را مدیریت کنید. مهمترین گزینه در این بخش تنظیم موقعیت المان است که به شما امکان میدهد آن را به صورت چسبان (Sticky) درآورید تا هنگام اسکرول کاربر در کنار صفحه ثابت بماند. همچنین میتوانید تنظیمات مربوط به عرض المان ترتیب (Z-index) برای مدیریت روی هم افتادن عناصر و کلاس های CSS اضافی را برای کنترل دقیق تر نحوه چیدمان بصری جدول محتوا در صفحه وب سایت خود اعمال کنید.

شما می توانید فیلم کامل آموزش این ویجت را که توسط استاد اسماعیلی از اساتید مجرب مجموعه آرتا رسانه، تدریس شده، در ادامه به صورت 100% رایگان مشاهده کنید. در صورت تمایل این ویديو را در یوتیوب شرکت آرتا رسانه هم میتوانید مشاهده کنید

آموزش موشن افکت در ویجت چرخشی

در بخش موشن افکت (Motion Effects) در تنظیمات پیشرفته شما میتوانید جلوه های بصری جذابی به فهرست مطالب خود اضافه کنید. این بخش به شما اجازه میدهد تا انیمیشن های ورودی ختلفی مانند محو شدن یا سر خوردن از بالا را برای زمانی که المان در صفحه بارگذاری میشود انتخاب کنید. همچنین میتوانید مدت زمان و تاخیر اجرای این انیمیشن ها را تنظیم کنید تا حرکت المان جدول محتوا در هنگام مشاهده صفحه توسط کاربر حرفه ای تر و پویاتر به نظر برسد.

بخش تبدیل در ویجت چرخشی المنتور

در بخش تبدیل (Transform) که در تنظیمات پیشرفته المان های المنتور یافت میشود میتوانید تغییرات هندسی دقیقی روی المان اعمال کنید. این تنظیمات شامل گزینه هایی برای چرخاندن المان در محورهای مختلف تغییر مقیاس یا اندازه کشیدن یا کج کردن (Skew) و جابجایی دستی موقعیت آن بدون تاثیر بر چیدمان سایر عناصر صفحه است. این ابزارها برای ایجاد جلوه های بصری خلاقانه و دقیق در طراحی سایت شما بسیار مفید هستند.

گزینه پس زمینه در المان چرخشی (carousel) المنتور

در بخش پس زمینه (Background) تنظیمات پیشرفته شما میتوانید ظاهر پشت زمینه این ویجت را فراتر از تنظیمات باکس تغییر دهید. این بخش به شما امکان میدهد تا یک رنگ ثابت یا یک گرادیان رنگی جذاب را به عنوان پس زمینه المان انتخاب کنید. همچنین میتوانید یک تصویر سفارشی را به جای رنگ آپلود کرده و تنظیمات مربوط به موقعیت اندازه و تکرار تصویر پس زمینه را مدیریت کنید تا جلوه بصری مورد نظر خود را دقیقا روی کادر جدول محتوا اعمال کنید.

بخش حاشیه در ویجت چرخشی المنتور

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

گزینه ماسک در المان چرخشی المنتور

در بخش ماسک (Mask) که یکی از ویژگی های خلاقانه و پیشرفته در تنظیمات المنتور است شما میتوانید شکل ظاهری المان جدول محتوا یا هر المان دیگری را با استفاده از الگوهای مختلف تغییر دهید. به جای اینکه المان به صورت یک مستطیل ساده نمایش داده شود میتوانید شکلی مانند دایره مثلث یا الگوهای سفارشی دیگر را به عنوان ماسک انتخاب کنید. این قابلیت به شما امکان میدهد تا بخش هایی از المان را پنهان کرده و تنها قسمت مشخصی که توسط ماسک پوشانده شده را به نمایش بگذارید که برای ایجاد طرح های بصری منحصر به فرد و خارج از کادر بسیار مفید است.

تنظیم واکنش گرا در ویجت چرخشی المنتور

در بخش واکنش گرایی (Responsive) تنظیمات پیشرفته شما میتوانید نحوه نمایش این ویجت را در دستگاه های مختلف تنظیم و بهینه سازی کنید. این قابلیت به شما امکان میدهد تا مشخص کنید که آیا این المان در صفحات نمایش دسکتاپ تبلت یا موبایل نمایش داده شود یا خیر و در صورت نمایش تنظیمات خاصی مانند مخفی کردن سربرگ در موبایل یا تغییر ترتیب قرارگیری آن اعمال کنید. هدف اصلی این بخش اطمینان از این است که فهرست مطالب در هر اندازه صفحه نمایشی به درستی و با بهترین تجربه کاربری ممکن به مخاطب نمایش داده شود و طراحی سایت شما ریسپانسیو باقی بماند.

ویژگی ها در ویجت چرخشی وردپرس

در بخش ویژگی ها (Attributes) که در تنظیمات پیشرفته المان های المنتور موجود است شما میتوانید اوصاف سفارشی HTML را به عنصر اصلی المان اضافه کنید. این قابلیت برای توسعه دهندگان وب و کاربران پیشرفته مفید است زیرا به آنها اجازه میدهد تا دادههای خاصی را برای تعامل با کدهای جاوا اسکریپت سفارشی یا بهبود سئوی فنی صفحه اضافه کنند. این ویژگیها مستقیما به کد خروجی المان اضافه میشوند و امکان انعطاف پذیری بیشتر در پیاده سازی عملکردهای خاص و تعامل های پیشرفته را فراهم میکنند که فراتر از تنظیمات استاندارد المنتور است.

بخش css سفارشی در المان carousel المنتور

در المنتور منظور از سفارشی سازی (Customization) مجموعه گستردهای از تنظیمات است که به شما امکان میدهد ظاهر رفتار و عملکرد المان جدول محتوا را دقیقا مطابق با نیازها و سلیقه خود تنظیم کنید. این سفارشی سازی شامل تغییر رنگها فونت ها حاشیه ها و پس زمینه در بخش های استایل میشود و همچنین شامل تنظیمات پیشرفته تری مانند اعمال موشن افکت ها موقعیت دهی دقیق المان با استفاده از طرح بندی و افزودن کدهای CSS یا اوصاف HTML دلخواه برای ایجاد تغییرات منحصر به فرد در بخش پیشرفته است که در نهایت منجر به تولید یک خروجی بصری و کاربردی کاملا شخصی سازی شده میشود.

مهم ترین مزایای ویجت چرخشی (carousel) در المنتور

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

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

ویجت چرخشی المنتور از نظر سئو

استفاده صحیح از ویجت چرخشی به بهبود تجربه کاربری و افزایش مدت زمان حضور کاربران در سایت کمک می‌کند که این موضوع تأثیر مثبت بر رتبه صفحات در موتورهای جستجو دارد. همچنین عناوین و توضیحات تصاویر و محتوا در اسلایدها قابل ایندکس هستند و ربات‌های گوگل محتوای سایت را به شکل مؤثری بررسی می‌کنند.

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