المنتور بهعنوان بهترین صفحهساز وردپرسی توانسته بهخوبی بین طراحان وبسایت شناخته شود و رضایت حداکثری همگان را به دست آورد. دلیل رضایتمندی طراحان وبسایت امکان استفاده ساده از ویژگیهای بینظیر افزونه المنتور بدون نیاز به نوشتن حتی یک خط کد است. کاربران نیز با مشاهده یک سایت زیبا که بهخوبی میتوانند با آن تعامل برقرار کنند راضی و خوشنود هستند. Transform یکی از ویژگیهایی است که توانسته جایگاه ویژه ای بین طراحان وبسایت و مخاطبان آن کسب کند.
نسخه المنتور پرو علاوه بر قابلیتهای معمول که در طراحی هر سایت نیاز است، جلوههای انیمیشنی فوقالعادهای مانند پارالکس و موشن افکت را در اختیار شما قرار میدهد. بااینحال وجود ویژگی Transform که تبدیل و افکتهای شناور دوبعدی المانها را انجام میدهد از المنتور دور از انتظار نیست. در این مقاله چگونگی استفاده از Transform برای ایجاد جلوههای پویا و پیشرفته را به شما آموزش خواهیم داد.
ویژگی Transform چیست؟
شاید بتوان ترجمه Transform را به فارسی تبدیل یا تغییر جهت عنوان کرد. با کمک این ویژگی قابلیت جابجایی، چرخاندن و تغییر سایز هر ویجت سازگار در المنتور بدون هیچ محدودیتی وجود خواهد داشت. تمامی تبدیلها در راستای محور افقی (x) و عمودی (y) صورت میپذیرند.
بهترین استفاده از تنظیمات Transform را میتوان در طراحیهای مختلف وب مشاهده کرد، مانند ایجاد یک تصویر با زاویه مشخص یا دکمهای که با قرار گرفتن روی آن کمی به سمت بالا حرکت کرده و بهصورت حالت شناور جلوه میکند. یکی دیگر از کاربردهای Transform زمانی است که شما میخواهید یک محصول را در زاویههای مختلف از چپ، راست، بالا یا پایین به نمایش بگذارید. در این وضعیت تنظیمات تبدیل به کمک شما میآیند تا بهسادگی بتوانید طراحی خود را سفارشی کنید.
چگونه از Transform در المنتور استفاده کنیم؟
ابتدا در پیشخوان وردپرس یک برگه جدید بسازید یا یکی از صفحههایی که قبلاً طراحی کردهاید را در حالت ویرایش با المنتور باز کنید. ساختار مناسبی برای قرار دادن المانهایی که میخواهید ویژگیTransform را بر روی آنها تنظیم کنید ایجاد نمایید. سپس ابزراک های دلخواه را به ستونهای ردیف ساختار اضافه کنید.
المان تصویر یکی از بهترین عناصری است که Transform برای آن کارایی دارد و در وبسایت نیز به زیبایی نمایش داده میشود. پس از افزودن المان، وارد پنل تنظیمات آن شوید و تب “پیشرفته” را انتخاب کنید. پنل آکاردئونی Transform شامل تنظیمات پیشرفتهای برای حالت تبدیل است.
ویژگی تبدیل در حالت هاور یعنی زمانی که کاربر با ماوس روی صفحه و عناصر آن حرکت میکند کاربرد بیشتری دارد. چراکه در حالت عادی جابجایی یا چرخش المان توجه کاربر را به خود جلب نمیکند. بااینحال انتخاب حالت عادی یا هاور برای تنظیم Transform به روش طراحی شما وابسته است.
- چرخش: با فعال کردن گزینه “چرخش سهبعدی”، میتوانید میزان چرخش عنصر در استای محور x و y را بر اساس درجه مشخصی تنظیم کنید.
- افست: این گزینه به شما کمک میکند موقعیت عنصر را در راستای محور x و y تغییر دهید. با حرکت نوار اسکرول به راست یا چپ مقدار حرکت در راستای محور انتخابشده را تعیین کنید و یا مقدار حرکت را با واحد پیکسل یا درصد در فیلدهای متنی وارد نمایید.
- مقیاس: برای تغییر اندازه المان از گزینه مقیاس و سپس تعیین کوچک یا بزرگ بودن عنصر استفاده کنید.
- خمیدگی: با تعیین مقدار خمیدگی در راستای محور x و y مقدار زاویه ابزارک را در جهتهای مختلف مشخص کنید. این گزینه ویژگی بسیار خوبی برای میزان کجی و تمایل آیتمهای صفحه در زوایای گوناگون است.
- برگردان افقی: گاهی ممکن است شما بخواهید عنصری را در راستای محور افقی بهطور معکوس نمایش دهید. با کلیک آیکن برگردان افقی بهراحتی میتوانید جهت المان را تغییر دهید.
- برگردان عمودی: از گزینه برگردان عمودی برای معکوس کردن عنصر در راستای محور y استفاده کنید.
ویژگی Transform باعث میشود طراحی سایت داینامیک را تجربه کنید. عناصر صفحه خود را بهراحتی بچرخانید، آفست کنید، اندازه و حتی جهت آنها را تغییر دهید. امیدواریم این آموزش راهنمای خوبی برای شما در طراحی حرفهایتر سایت باشد. در قسمتهای بعدی از دوره آموزش جامع و رایگان المنتور با ما همراه باشید چون قصد داریم شما را با قابلیتهای پیشرفته و حیرتآور این افزونه قدرتمند آشنا کنیم.
18 دیدگاه. Leave new
سلام
من در قسمت ویرایش روی المان تصویر از ترانسفر هم عادی هم هاور استفاده کردم اما پس از ذخیره در قسمت نمایش هیچ تغییر روی تصویر مشاهده نکردم
لطفا برای رفع این مشگل راهنمایی فرمایید با تشکر
سلام وقت شما بخیر،
این مورد میتواند به دلیل کش مرورگر باشد که پیشنهاد میشود آنرا خالی نمایید. همچنین حل مشکل بهم ریختگی و اعمال نشدن استایل در المنتور – Elementor Regenerate CSS and Data نیز ممکن است مفید باشد
با تشکر.
سلام وقت به خیر
ببخشید من گزینه ی transform را ندارم
باسلام خدمت شما
این مورد بصورت پیش فرض در المنتور وجود دارد دقت کنید که افزونه پرو آپدیت یا فعال بوده باشد.
از حضور شما ممنونیم.
سلام وخسته نباشین ممنونم بابت اموزشش خوبتون.
من المنتور پرو رو هم نصب کردم از شما خریدم اما باز نمیاره این گزینه رو.پاک کردم دوباره نصب کردم اما باز نمیاره
سلام وقت شما بخیر،
از همراهی شما بسیار ممنونیم ، خواهشمند است از ناحیه کاربری خود اقدام به ارسال تیکت فرمایید تا این مورد بررسی شود.
با تشکر.
سلام وقتتون بخیر من المنتور پرو نصب کردم و تو ی فیلم اشاره کردید قالب های نوشته پرو دارن میارن ولی برای من خطا میده دلیلش چیه؟
سلام میشه لینک دان اکستنشن آل دانلودر رو بدید؟
سلام بر شما ، وقت بخیر از حضور شما ممنونیم.
ادان های مختلفی برای مرورگر های مختلفی وجود دارد ، در گوگل جستجو داشته باشید.
آرزوی موفقیت برای شما داریم.
متوجه شدم مرسی
سلام خداقوت
میخاستم بدونم چطور میشه هاور رو عکس قرارداد
من یه جایی دیدم که وقتی موس میره روی عکس “هاورش اینه که اون عکسه عوض میشه
سلام و عرض ادب
در ادامه آموزش ها سعی می شود همه این موارد آموزش داده شود.
با تشکر.
سلام و عرض ادب ببخشید قسمت های 23و24 را میخواهید بگذارید
سلام و عرض ادب
ما حتماً قسمت های جدید را در سایت قرار می دهیم. زمان آن را دقیق نمی دانیم اما می دانید خیلی زود انجام می شود.
با تشکر.
سلام چرا اینقدر دیر دیر قسمتها رو میزارید؟؟
سلام و عرض ادب،
در کنار زمانی که باید برای این آموزش گذاشت، برنامه ها و کار های فراوان دیگری در ابزار وردپرس وجود دارد که متاسفانه نمی توان خیلی سریع آموزش های جدید قرار داد.
البته تلاش ما این است که در هر ماه چندین قسمت قرار گیرد.
با سلام و تشکر از آموزش خوبتون که اینقدر شیوا و رسا و جذاب اموزش میدین
لطفا قسمتهای بعدی رو زودتر قرار بدید منتظریم
سلام و عرض ادب،
از حضور شما ممنونیم.