فهرست محتوا
گاهی اوقات لازم است تغییرات قبل و بعد یک تصویر را در سایت نمایش دهیم. برای مثال، در وب‌سایت‌های مرتبط با طراحی داخلی، عکاسی، آرایشگری و ویرایش تصاویر، نمایش تفاوت‌ها می‌تواند جذابیت بصری بالایی ایجاد کند. اگر از صفحه‌ساز المنتور استفاده می‌کنید، می‌توانید با استفاده از افزونه Unlimited Elements قابلیت ساخت تصاویر قبل و بعد در المنتور (Create Before and After Images in Elementor) را به سایت خود اضافه کنید.
در این مقاله، نحوه استفاده از این افزونه را توضیح می‌دهیم تا بتوانید تصاویر قبل و بعد در المنتور را به‌صورت حرفه‌ای نمایش دهید.
افزودن قابلیت نمایش تصاویر قبل و بعد در المنتور
به‌صورت پیش‌فرض، المنتور امکان مقایسه تصاویر قبل و بعد را ندارد. اما افزونه Unlimited Elements این قابلیت را ایجاد می‌کند و شما می‌توانید با استفاده از آن، ساخت تصاویر قبل و بعد در المنتور را به‌راحتی انجام دهید.
این افزونه مجموعه‌ای از ویجت‌های پیشرفته را به المنتور اضافه می‌کند که یکی از آن‌ها، ابزار مقایسه تصاویر است. برخلاف سایر ویجت‌های المنتور، این قابلیت مستقیماً در لیست اصلی ویجت‌ها قرار ندارد و باید از بخش Web Builders Elementor آن را فعال کنید. در ادامه، نحوه نصب و استفاده از این ویجت را توضیح می‌دهیم.
چرا باید از ساخت تصاویر قبل و بعد در المنتور استفاده کنیم؟
استفاده از تصاویر مقایسه ای در المنتور به بهبود تجربه کاربری کمک می‌کند و در بسیاری از زمینه‌ها کاربرد دارد. برخی از مزایای این ویژگی شامل موارد زیر است:
- مقایسه طراحی‌ها و تغییرات در پروژه‌های بازسازی و دکوراسیون داخلی
- نمایش تفاوت‌های تصاویر قبل و بعد از ویرایش در وب‌سایت‌های عکاسی و گرافیکی
- نمایش تأثیر خدمات زیبایی یا درمانی، مانند تغییرات پس از آرایش یا جراحی‌های زیبایی
- مقایسه کیفیت محصولات قبل و بعد از استفاده
با استفاده از ساخت عکس قبل و بعد در المنتور می‌توانید به‌صورت بصری تغییرات را نمایش دهید و توجه کاربران را جلب کنید.
نصب و فعال‌سازی افزونه Unlimited Elements
برای اینکه بتوانیدتصاویر مقایسه ای در المنتور را به سایت خود اضافه کنید، ابتدا باید افزونه Unlimited Elements را نصب کنید.
مراحل نصب افزونه
در این قسمت مراحل نصب افزونه برای شما توضیح داده‌ایم:
دانلود افزونه
این افزونه در مخزن وردپرس وجود ندارد، بنابراین باید آن را از وب‌سایت رسمی دریافت کنید.
نصب در وردپرس
به پیشخوان وردپرس بروید و از منوی افزونه‌ها > افزودن را انتخاب کنید. گزینه بارگذاری افزونه را بزنید و فایل دانلود شده را انتخاب کنید. روی نصب و فعال‌سازی کلیک کنید.
دسترسی به افزونه
پس از نصب، به صفحه ویرایشگر المنتور بروید و بخش Web Builders Elementor را باز کنید تا به ویجت Before & After دسترسی داشته باشید.
دسترسی به ویجت Before & After در المنتور
بعد از نصب افزونه، مراحل زیر را برای استفاده از ویجت مقایسه‌ای دنبال کنید:
- یک صفحه یا برگه را با المنتور ویرایش کنید.
- در پنل المنتور، اسکرول کنید تا به بخش Web Builders Elementor برسید.
- روی این بخش کلیک کنید تا لیست ویجت‌های موجود نمایش داده شود.
- گزینه Before & After را انتخاب کنید.
حالا این ویجت در صفحه شما فعال شده و می‌توانید تنظیمات دلخواه خود را روی آن اعمال کنید.
تنظیمات ویجت Before & After در المنتور
در اینجا نحوه انجام تنظیمات این ویجت برای شما توضیح داده‌ایم که شامل موارد زیر است:
انتخاب تصاویر قبل و بعد
در تنظیمات ویجت، دو گزینه برای بارگذاری تصاویر وجود دارد: Before Image و After Image.
تصاویر دلخواه خود را برای قبل و بعد از تغییرات انتخاب کنید.
تنظیمات نمایش مقایسه‌ای
می‌توانید نوع اسلایدر را تغییر دهید (کشیدن از چپ به راست یا از بالابه‌پایین). امکان تنظیم ضخامت و رنگ خط جداکننده بین تصاویر هم وجود دارد.
تنظیمات استایل
امکان تغییر رنگ، اندازه و نمایش دستگیره کشویی، اضافه‌کردن افکت‌های حرکتی به مقایسه تصاویر و قابلیت تعیین نحوه نمایش در موبایل.
تنظیمات پیشرفته
علاوه بر تنظیمات اصلی، این ویجت دارای بخش تنظیمات پیشرفته نیز هست که امکانات حرفه‌ای‌تری را ارائه می‌دهد.
تغییر نوع افکت مقایسه‌ای
این نوع تغییر شامل موارد زیر است:
افکت کلاسیک
مقایسه معمولی که کاربران می‌توانند تصویر را با کشیدن تغییر دهند.
افکت محوشدن (Fade)
تصویر بعدی هنگام حرکت موس نمایش داده می‌شود.
افکت اسکرول
تصویر با حرکت صفحه تغییر می‌کند.
تغییر دستگیره کشویی (Slider Handle)
می‌توانید رنگ، اندازه و نوع آیکون دستگیره را تغییر دهید. امکان استفاده از اشکال مختلف مانند دایره، خط یا فلش برای دستگیره وجود دارد.
افزودن متن روی تصاویر
می‌توانید توضیحات کوتاهی به هر تصویر اضافه کنید. امکان تغییر فونت، اندازه و رنگ متن وجود دارد.
تنظیم سرعت و جهت حرکت اسلایدر
امکان تنظیم سرعت حرکت بین تصاویر و تعیین جهت حرکت (چپ به راست یا بالابه‌پایین).
بهینه‌سازی برای موبایل و تبلت
تغییر تنظیمات برای نمایش بهتر در موبایل و تبلت و امکان فعال‌کردن حالت لمسی برای حرکت اسلایدر در موبایل.
جمع‌بندی
با استفاده از افزونه Unlimited Elements می‌توانید تصاویر مقایسه ای در المنتور را به‌راحتی ایجاد کنید. این افزونه به شما امکان ساخت تصاویر قبل و بعد در المنتور را می‌دهد و می‌توانید از آن برای نمایش تغییرات در پروژه‌های مختلف استفاده کنید.
اگر قصد دارید ساخت عکس قبل و بعد در المنتور را به‌صورت حرفه‌ای انجام دهید، پیشنهاد می‌کنیم تنظیمات ویجت را بررسی کنید و سبک‌های مختلف را امتحان کنید تا بهترین نمایش ممکن را در سایت خود ایجاد کنید.
دیدگاهتان را بنویسید