آدرس

تهران، خیابان شریعتی، بالاتر از سه راه ملک، روبروی آتش نشانی

شماره تماس

۰۹۱۹۳۴۲۶۲۵۱
۰۲۱۹۱۳۰۳۴۲۴

آدرس ایمیل

info@artarasaneh.com
artarasaneh@gmail.com

المان حلقه چرخ و فلک (Loop Carousel) در المنتور

المان حلقه چرخ و فلک (Loop Carousel) در المنتور

با Loop Carousel المنتور می‌توانید محتوای داینامیک سایت را به‌صورت اسلایدی، حرفه‌ای و واکنش‌گرا نمایش دهید.

اگر از کاربرانی هستید که با المنتور طراحی سایت می‌کنید، احتمالاً با ابزارهایی مثل Loop Grid یا Posts Widget آشنا شده‌اید. اما یکی از ویژگی‌های تازه و جذابی که در نسخه‌های جدید المنتور پرو اضافه شده، المان حلقه چرخ و فلک (Loop Carousel) است؛ ابزاری که به شما امکان می‌دهد محتواهای داینامیک را به‌صورت اسلایدی و چرخشی نمایش دهید، آن‌هم دقیقاً با طراحی دلخواه خودتان.

به زبان ساده، Loop Carousel همان Loop Grid است با افکت حرکتی و اسلایدی.

در Loop Grid، محتوای تکرارشونده به‌صورت شبکه‌ای نمایش داده می‌شود، اما در Loop Carousel، همان آیتم‌ها در قالب یک چرخ و فلک (Carousel) روان و قابل ورق خوردن قرار می‌گیرند.

پیشنهاد ویژه ما: سایت اختصاصی

Table of contents [Show] [Hide]

چرا المان Loop Carousel در المنتور مهم است؟

در طراحی وب مدرن، جلب توجه کاربر و افزایش تعامل اهمیت زیادی دارد.

صفحات استاتیک و بدون حرکت، معمولاً نرخ ماندگاری کاربر (Dwell Time) را پایین می‌آورند.

اینجاست که Loop Carousel وارد عمل می‌شود:

با این المان می‌توانید محتوای پویا را در قالبی چشم‌نواز، متحرک و واکنش‌گرا نمایش دهید.

برای مثال:

آخرین مقالات بلاگ را در قالب اسلایدر زیبا نشان دهید.

محصولات فروشگاه ووکامرس را به‌صورت چرخشی نمایش دهید.

نمونه‌کارهای خود را با جلوه‌های حرکتی جذاب معرفی کنید.

این ابزار در عین زیبایی، کاملاً سبک و سئوپذیر است، و همین باعث شده بسیاری از طراحان حرفه‌ای به‌جای اسلایدرهای سنگین قدیمی از Loop Carousel استفاده کنند.

پیشنهاد مطالعه: المان شبکه حلقه در المنتور (Loop Grid) چیست و چه کاربردی دارد؟

تفاوت المان Loop Carousel با Carousel عادی المنتور

المنتور از مدت‌ها قبل ویجت Carousel (مثل Image Carousel یا Media Carousel) را در خود داشت.

اما تفاوت Loop Carousel با آنها در داینامیک بودن است.
 

ویژگیCarousel معمولیLoop Carousel
محتوای داینامیک❌ ندارد✅ دارد
اتصال به پست‌ها و محصولات❌ ندارد✅ دارد
طراحی اختصاصی هر آیتم❌ محدود✅ کامل
داده‌های پویا (Dynamic Tags)❌ ندارد✅ دارد


به زبان ساده، در Carousel عادی فقط می‌توانید چند تصویر ثابت یا متن دلخواه قرار دهید،

اما در Loop Carousel، هر اسلاید از داده‌های واقعی سایت شما پر می‌شود.

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

المان حلقه چرخ و فلک (Loop Carousel) در المنتور

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

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

 

ساخت اسلایدر داینامیک با Loop Carousel

در این ویدیو یاد می‌گیری چطور با المان حلقه چرخ و فلک (Loop Carousel) در المنتور پرو، محتوای سایتت رو به شکلی کاملاً حرفه‌ای و متحرک نمایش بدی

بخش محتوا در المان حلقه چرخ و فلک المنتور

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

آموزش طرح‌ بندی المان Loop Carousel در المنتور

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

گزینه کوئری المان حلقه چرخ و فلک در المنتور

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

بخش تنظیمات حلقه چرخ و فلک (Loop Carousel) در المنتور

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

بخش استایل المان  Loop Carousel در المنتور

بخش استایل المان Loop Carousel در المنتور
در بخش استایل (Style) المان چرخ فلک حلقه (Loop Grid) در المنتور، تمام تنظیمات مربوط به ظاهر بصری کارت‌های محتوا و فاصله بین آن‌ها مدیریت می‌ شود. در این قسمت می‌توانید فاصله بین ستون‌ها و ردیف‌ها را با دقت پیکسل یا درصد تنظیم کنید تا چید مان شبکه‌ ای منظم یا خلاقانه‌ ای داشته باشید. علاوه بر این، در صورتی که در بخش محتوا، گزینه‌ هایی مانند صفحه‌ بندی فعال شده باشند، تنظیمات استایل دکمه‌ ها یا شماره‌های صفحه‌ بندی نیز در همین تب در دسترس قرار می‌ گیرد که به شما امکان می‌ دهد رنگ، تایپوگرافی، حاشیه و افکت‌ های هاور (Hover Effects) آن‌ها را مطابق با طراحی کلی وب‌ سایت خود سفارشی‌ سازی کنید.

طرح‌ بندی در المان حلقه چرخ و فلک المنتور

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

صفحه‌ گذاری در المان Loop Carousel در المنتور

صفحه‌ گذاری در المنتور یک قابلیت حیاتی است که در المان‌ هایی مانند چرخ فلک حلقه (Loop Grid)، پست‌ها (Posts) و محصولات (Products) فعال می‌ شود و به مدیریت حجم بالای محتوا کمک می‌ کند. این ویژگی با تقسیم محتوای کلی به چندین صفحه کوچک‌ تر، از طولانی شدن بیش از حد صفحه اصلی جلوگیری کرده و تجربه کاربری (UX) را بهبود می‌ بخشد. در بخش تنظیمات مربوطه، کاربران می‌ توانند سبک صفحه‌ بندی را انتخاب کنند؛ مثلاً می‌ توانند از دکمه‌های ساده قبلی/بعدی، شماره صفحات، یا سبک بارگذاری بیشتر از طریق دکمه یا اسکرول بی‌ نهایت استفاده کنند. این تنظیمات همچنین به شما امکان می‌ دهند استایل دکمه‌ها، رنگ‌ ها و تراز آن‌ها را شخصی‌ سازی کنید تا کنترل کاملی بر ناوبری سایت داشته باشید.

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

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

توضیح طرح بندی در حلقه چرخ و فلک المنتور

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

آموزش موشن افکت در المان Loop Carousel در وردپرس

گزینه موشن افکت به شما این قابلیت را می‌ دهد که انیمیشن‌ ها و جلوه‌های حرکتی جذاب به عناصر صفحه خود اضافه کنید تا وب‌ سایت شما پویاتر و جذاب‌ تر شود . این تنظیمات شامل دو دسته اصلی هستند: انیمیشن‌ های ورودی مانند Fade In، Slide In یا Zoom In که هنگام بارگذاری یا اسکرول کاربر به سمت عنصر فعال می‌ شوند؛ و افکت‌های اسکرول (Scroll Effects) که با حرکت دادن صفحه، باعث ایجاد جلوه‌هایی مانند حرکت پارالاکس عمودی یا افقی، شفافیت تدریجی (Opacity) یا مقیاس‌ پذیری می‌ شوند استفاده از موشن افکت‌ ها می‌ تواند توجه کاربر را به بخش‌های خاصی جلب کند، اما استفاده بیش از حد از آنها ممکن است باعث حواس‌ پرتی یا کاهش عملکرد وب‌ سایت شود.

بخش تبدیل در حلقه چرخ و فلک المنتور

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

گزینه پس زمینه المان حلقه چرخ و فلک المنتور

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

توضیح حاشیه ویجت حلقه چرخ و فلک المنتور

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

بخش ماسک در Loop Carousel المنتور

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

آموزش واکنش‌ گرا در حلقه چرخ و فلک وردپرس

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

گزینه ویژگی ها در المان حلقه چرخ و فلک

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

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

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

مراحل ساخت المان حلقه چرخ و فلک در المنتور

ساخت یک Loop Carousel در المنتور بسیار ساده است و تنها چند مرحله دارد.

در ادامه به‌صورت گام‌به‌گام توضیح می‌دهم:

1. ایجاد قالب Loop Item

ابتدا وارد بخش Templates → Loop Item → Add New شوید.

در اینجا باید قالب اصلی هر آیتم را طراحی کنید؛ همان چیزی که در هر اسلاید تکرار می‌شود.

می‌توانید از ویجت‌های داینامیک المنتور استفاده کنید، مثل:

Post Title (عنوان نوشته)

Featured Image (تصویر شاخص)

Post Excerpt (خلاصه محتوا)

دکمه‌ی "بیشتر بخوانید"

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

2. ذخیره و بازگشت به صفحه اصلی

پس از طراحی و ذخیره قالب Loop Item، به صفحه‌ای که می‌خواهید Carousel در آن نمایش داده شود بروید.

مثلاً صفحه‌ی «بلاگ» یا «نمونه‌کارها».

3. افزودن ویجت Loop Carousel

در المنتور، ویجت Loop Carousel را جست‌وجو و روی صفحه قرار دهید.

سپس از بخش تنظیمات، قالبی که قبلاً ساخته‌اید را انتخاب کنید.

المنتور به‌صورت خودکار داده‌های واقعی را جایگزین محتوای نمونه شما می‌کند.

4. تنظیمات نمایش و افکت‌ها

در بخش Layout و Carousel Settings می‌توانید موارد زیر را تنظیم کنید:

تعداد آیتم‌های قابل مشاهده در هر اسلاید

سرعت چرخش یا اسلایدها

فعال‌سازی پخش خودکار (Autoplay)

حالت بی‌نهایت (Infinite Loop)

جهت حرکت (RTL یا LTR)

فعال یا غیرفعال کردن کنترل‌ها (فلش‌ها، نقاط ناوبری)

این بخش همان جایی است که Loop Carousel را تبدیل به یک المان زنده و چشم‌نواز می‌کند.

5. تنظیمات واکنش‌گرا (Responsive)

یکی از مزیت‌های بزرگ المنتور، واکنش‌گرایی کامل است.

در قسمت Responsive Settings می‌توانید تعیین کنید در موبایل چند آیتم نمایش داده شود، آیا اسلاید خودکار فعال باشد یا خیر، و حتی سرعت انیمیشن را تغییر دهید.

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

پیشنهاد مطالعه: طراحی سایت رایگان

کاربردهای عملی Loop Carousel در المنتور

Loop Carousel فقط برای نمایش پست‌ها نیست.

با کمی خلاقیت می‌توانید از آن در بخش‌های مختلف سایت استفاده کنید:

  • اسلایدر مقالات بلاگ با تصویر شاخص و عنوان
  • نمایش محصولات فروشگاه با قیمت و دکمه خرید
  • اسلایدر نظرات مشتریان (Testimonials) به‌صورت داینامیک
  • نمونه‌کارهای پروژه‌ها با لینک جزئیات
  • اعضای تیم یا شرکا با عکس و توضیح کوتاه

این انعطاف باعث می‌شود Loop Carousel به یکی از پرکاربردترین المان‌های المنتور در طراحی سایت‌های مدرن تبدیل شود.

مزایای استفاده از المان حلقه چرخ و فلک (Loop Carousel)

۱. طراحی اختصاصی برای هر آیتم

شما به‌جای استفاده از طرح‌های آماده، ظاهر هر کارت را دقیقاً با سلیقه خود طراحی می‌کنید.

۲. پشتیبانی از داده‌های پویا

Loop Carousel مستقیماً به محتوای وردپرس متصل می‌شود و داده‌ها را به‌صورت خودکار فراخوانی می‌کند.

۳. افکت‌های حرکتی جذاب و روان

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

۴. سبک و سریع

برخلاف برخی اسلایدرها که سرعت سایت را کاهش می‌دهند، Loop Carousel کاملاً بهینه و سازگار با Core Web Vitals است.

۵. سازگاری کامل با WooCommerce و ACF

می‌توانید محتوای داینامیک از افزونه‌های مختلف را در قالب Loop Carousel نمایش دهید.

نکات سئو در استفاده از Loop Carousel

بسیاری تصور می‌کنند اسلایدرها برای سئو سایت مضر هستند، اما اگر درست استفاده شوند، می‌توانند مفید هم باشند.

برای بهینه‌سازی Loop Carousel نکات زیر را در نظر بگیرید:

  • استفاده از تگ‌های عنوان (H2, H3) در داخل قالب Loop Item.
  • تنظیم Alt Text داینامیک برای تصاویر (مثلاً بر اساس عنوان پست).
  • لینک دادن هر آیتم به صفحه اصلی مطلب یا محصول.
  • کاهش حجم تصاویر برای افزایش سرعت بارگذاری.
  • تنظیم حالت Lazy Load برای تصاویر در اسلایدر.

با رعایت این نکات، Loop Carousel نه‌تنها به سئو آسیب نمی‌زند، بلکه به بهبود تجربه کاربری و نرخ تعامل کمک می‌کند.

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

گاهی کاربران تازه‌کار در استفاده از Loop Carousel با مشکلات کوچکی روبه‌رو می‌شوند.

در ادامه چند مورد رایج را مرور می‌کنیم:

  • اسلایدر کار نمی‌کند: بررسی کنید که المنتور پرو فعال باشد و نسخه آن به‌روز باشد.
  • داده‌ها تکراری هستند: تنظیمات Query را بازبینی کنید و فیلتر دسته‌بندی‌ها را درست تنظیم کنید.
  • در موبایل چیدمان به‌هم می‌ریزد: ستون‌ها و فاصله‌ها را در حالت Responsive تنظیم کنید.
  • سرعت پایین در بارگذاری: از Lazy Load و بهینه‌سازی تصاویر استفاده کنید.

جمع‌بندی

المان حلقه چرخ و فلک در المنتور (Loop Carousel) یکی از جذاب‌ترین امکانات المنتور پرو است که طراحی سایت را وارد مرحله‌ای حرفه‌ای‌تر می‌کند.

با استفاده از این ویژگی، می‌توانید محتوای داینامیک سایت را در قالب اسلایدرهای زیبا، واکنش‌گرا و کاملاً سفارشی نمایش دهید.

این ابزار ترکیبی از طراحی، پویایی و سئو است؛ یعنی دقیقاً همان چیزی که برای ساخت یک وب‌سایت مدرن نیاز دارید.

اگر به دنبال افزایش جذابیت بصری، ماندگاری بیشتر کاربر و هماهنگی کامل طراحی با محتوای سایت هستید، Loop Carousel المنتور گزینه‌ای است که نباید از آن غافل شوید.

 

اشتراک گذاری :
مریم گوهرزاد
نویسنده

مریم گوهرزاد

مدرس و بنیانگذار هلدینگ آرتا رسانه. برنامه نویس و محقق حوزه بلاکچین

نظر خودتون رو با ما در میون بزارید

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

https://t.me/artarasaneh
tel:09193426251
https://wa.me/+989193426251
https://instagram.com/artarasaneh_com