دوستان با افزونه رایگان نمایش تصاویر قبل و بعد از ویرایش در وردپرس جهت کار با آن و معرفی در این ساعت خدمت همه شما عزیزان میرسم .آیا شده تا به حال عکسی رو در وردپرس ویرایش کرده باشید و بعد مایل به نمایش قبل و بعد همان تصویر باشید ؟ معمولا تعداد زیادی از افراد با استفاده از فتوشاب این کار را انجام می دهند و این کار به خوبی انجام نمیشود ما می تونیم آن را به صورت یک اسلایدر در کنار هم با وضوحیت بالا و عالی قرار دهیم که می توانید ان را با افزونه وردپرس نمایش تصاویر قبل و بعد از ویرایش در وردپرس انجام دهید شاید برخی از شماها آن را در انواع سایتهای بزرگ مشاهده کرده باشید پس با ما باشید تا در ادامه مطلب با چگونگی کار با این پلاگین رایگان آشنا شیم
نمایش تصاویر قبل و بعد از ویرایش در وردپرس
برای شروع کار با دانلود افزونه TwentyTwenty شروع می کنیم اگر بعد از نصب برخی از پلاگین های وردپرس به قسمت داشبورد مراجعه کنیم میبینیم که قسمت جدیدی اضافه شده جهت پیکر بندی و تنظیمات و اما پلاگین رایگان TwentyTwenty هیچ گونه قسمتی برای تنظیمات نداشته و کاملا ساده و کار با آن بسیار راحت می باشد اولین کاری که باید انجام دهید یک پست جدید ایجاد و یا یکی را ویرایش کنید و تصاویر را درج کرده ( فقط مطمئن شوید که هر دو تصویر هم اندازه می باشند ) بعد از انجام کارهای بالا شما باید کد تصاویر را بیابید و کدهای هر دو تصویر را به صورت زیر در بین تگ هایی [twentytwenty] و [/twentytwenty] قرار دهید .
[PHP]
[twentytwenty]
<img src=”http://www.example.com/wp-content/uploads/2014/12/before-photo.jpg”
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.jpg”
alt=”After Photo” width=”604″ height=”402″ class=”alignnone size-large wp-image-2366″ />
[/twentytwenty]
[PHP]
حالا می توانید تغییرات را ذخیره نمایید و تصاویر را در بالا مشاهده نمایید که در میان انها اسلادری برا ی مشاهده تصاویر بوده تا شما بتوانید بهتر مشاهده کنید در قسمت سمت چپ تصویر اول ( قبل ) و در راست بعد را مشاهده می کنید
کاربران سایت شما می توانند با اسلایدر یکه در وسط قرار گرفته تصاویر بعد و قبل را مشاهده کنند و اگر توجه کرده باشید در هنگام رفتن بر روی خط اسلایدر تصاویر به خوبی دیده می شوند
منبع : بیگ تم