نمایش حالت قبل و بعد به صورت تصویری در وردپرس با Twenty20

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

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

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

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

افزونه Twenty20

twenty20- نمایش حالت قبل و بعد در وردپرس

برای نمایش حالت قبل و بعد در وردپرس می‌توان از افزونه Twenty20 استفاده کرد. افزونه کامل و جالبی است که ترجیح می‌دهم قبل از ورود به مبحث آموزشی کمی با آن آشنا شویم…

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

نصب و راه اندازی افزونه 

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

افزودن در بخش نوشته 

plugin button- نمایش حالت قبل و بعد در وردپرس

دو دکمه‌ای که در تصویر مشاهده می‌کنید مربوط به افزونه مورد نظر است.

Add Twenty20

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

setting- نمایش حالت قبل و بعد در وردپرس

چند گزینه برای تنظیم دارد. پس از وارد کردن آن‌ها برای نمایش حالت قبل و بعد در وردپرس می‌توانید بر روی گزینه Insert shortcode کلیک کنید. حال اگر نوشته خود را منتشر کنید می‌توانید نتیجه را مشاهده کنید:

show befor after- نمایش حالت قبل و بعد در وردپرس

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

نمایش حالت قبل و بعد در وردپرس در ابزارک‌ها

به بخش ابزارک‌ها رفته و ابزارک Twenty20 slider را به ابزارک مورد نظر اضافه کنید.

widgets- نمایش حالت قبل و بعد در وردپرس

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

نتیجه گیری

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

دانلود افزونه Twenty20

دانلود افزونه صفحه افزونه
آیا این مقاله برای شما مفید بود؟
تقریبا
خیر

دیدگاهتان را بنویسید

ارسال دیدگاه به معنی این است که شما ابتدا قوانین ارسال دیدگاه را مطالعه کرده‌اید و با آن موافق هستید.