نمایش عکس قبل و بعد در وردپرس

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

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

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

نمایش عکس قبل و بعد در وردپرس

معمولا برای افزودن تصویر قبل و بعد از عمل به سایت اغلب مردم از فتوشاپ استفاده می‌کنند و تصاویر را کنار هم قرار می‌دهدند. اما بهتر نیست که یک اسلایدر نمایش قبل و بعد تصاویر داشته باشیم؟

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

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

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

افزونه TwentyTwenty

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

اولین کار نصب و راه‌اندازی افزونه TwentyTwenty می‌باشد. اگر هم با نصب افزونه آشنا نیستید آموزش نصب افزونه در وردپرس را ببینید. این افزونه بدون نیاز به تنظیمات کار می‌کند و تنظیماتی برای پیکربندی وجود ندارد. یعنی پس‌ازاینکه پلاگین را نصب کردید هیچ‌گونه گزینه جدیدی به پنل مدیریت وردپرس شما اضافه نمی‌شود. اما یک سری نکات را باید رعایت کنید که در اینجا برای شما توضیح می‌دهیم.

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

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

نکته مهمی که باید به آن توجه کنید این است که باید از برابر بودن ابعاد هر دو عکس مطمئن شوید.

اکنون پس از قرار دادن عکس شما باید ویرایشگر را در حالت متن قرار دهید. سپس باید هر دو تصویر را بین شورت کد [twentytwenty][/twentytwenty] مانند زیر قرار دهید:

[twentytwenty]<img src="http://www.example.com/wp-content/uploads/2014/12/before-photo.webp" alt="Before photo" width="604" height="402" class="alignnone size-large wp-image-2367" />
<img src="http://www.example.com/wp-content/uploads/2014/12/after-photo.webp" alt="After Photo" width="604" height="402" class="alignnone size-large wp-image-2366" />[/twentytwenty]

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

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

نتیجه‌گیری

وب‌سایت‌های زیادی وجود دارند که از تصاویر زیادی استفاده می‌کنند. بسیاری از این سایت‌ها نیاز دارند که تصاویر موجود را با هم مقایسه کنند. وردپرس برای این کار نیز یک راه‌حل بسیار خوب و مفید دارد و آن هم استفاده از افزونه TwentyTwenty است.

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

به همین راحتی! موفق باشید. 🙂

تیم تولید محتوا

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