Transform در المنتور – آموزش کامل تغییر شکل المان ها (ویدیوی آموزشی)
جلسه 20
مدت زمــان :
06:59 دقیقه
سطـــح :
متوسط
مـدرس :
محمد رحیمی
دانلود نسخه جدید افزونه المنتور پرو ، کاملا اورجینال و فارسی با لایسنس دائمی و قابلیت نصب و استفاده روی بی نهایت دامنه دانلود افزونه Elementor Pro
فهرست مطالب
Transform در المنتور از ابزارهای قدرتمند در المنتور هستند که به شما امکان میدهند تا المان های خود را به صورت سه بعدی یا دو بعدی تغییر دهید. این قابلیت شامل چرخش، تغییر اندازه، جابجایی و شیب دادن المان هاست که میتواند ظاهر طراحی شما را حرفهای تر و جذاب تر کند.
در جلسه قبلی در مورد موشن افکت در المنتور به طور کامل یادگرفتیم و در این جلسه در مورد Transform در المنتور تمامی قسمت ها را با هم بررسی خواهیم کرد، پس با میهن تم ، همراه باشید.
انواع Transform در المنتور
چرخش (Rotate)
با استفاده از ویژگی چرخش، میتوانید المانها را در محورهای X، Y یا Z بچرخانید.
مثال:
- چرخاندن تصویر در جهت عقربههای ساعت یا برعکس.
- ایجاد جلوههای چرخش سهبعدی.
آفست (جایجایی افقی و عمودی)
این ویژگی به شما امکان میدهد المانها را در محورهای افقی یا عمودی جابجا کنید.
مثال:
- انتقال یک دکمه به سمت بالا هنگام هاور کردن.
- جابجایی عناوین یا تصاویر در هنگام اسکرول.
تغییر اندازه (Scale)
ترنسفرم Scale اندازه المان را کوچکتر یا بزرگتر میکند.
مثال:
- بزرگتر کردن دکمه هنگام کلیک.
- افزایش سایز تصویر هنگام قرار گرفتن موس روی آن.
شیب دادن (Skew)
این ویژگی باعث میشود المانها به صورت زاویهدار و غیرمستقیم نمایش داده شوند.
مثال:
- ایجاد جلوهای مدرن برای باکسهای متنی.
- اضافه کردن استایل خاص به تصاویر.
نحوه استفاده از Transform در المنتور
1. ورود به ویرایشگر المنتور
برای دسترسی به قسمت Transform در المنتور ، ابتدا وارد صفحه موردنظر شوید و آن را با المنتور ویرایش کنید.
2. انتخاب المان
المانی که میخواهید تغییرات ترنسفرم را روی آن اعمال کنید، انتخاب کنید.
3. مراجعه به تنظیمات پیشرفته
در پنل سمت چپ، به بخش پیشرفته بروید و گزینه تغییر شکل (Transform) را پیدا کنید.
4. اعمال تنظیمات
در این بخش میتوانید موارد زیر را تنظیم کنید:
- Rotate: تعیین زاویه چرخش.
- Translate: تنظیم جابجایی افقی و عمودی.
- Scale: تغییر اندازه.
- Skew: تنظیم میزان شیب.
5. پیشنمایش و انتشار
بعد از اعمال تنظیمات، پیشنمایش طراحی خود را مشاهده کنید و در صورت رضایت، تغییرات را ذخیره و منتشر کنید.
جدول تنظیمات تغییر شکل در المنتور
| نوع ترنسفرم | توضیح | کاربرد |
|---|---|---|
| چرخش | چرخش المان در محورهای X، Y، Z | چرخش تصاویر، عناوین یا آیکونها. |
| آفست | جابجایی المان در محورهای افقی و عمودی | انتقال دکمهها یا جابجایی متون. |
| Scale | تغییر اندازه المان | بزرگتر یا کوچکتر کردن تصاویر و دکمهها. |
| Skew | شیب دادن به المان | ایجاد جلوههای مدرن برای باکسها. |
| چرخش افقی | چرخش افقی المان ها | |
| چرخش عمودی | چرخش عمودی المان ها |
نکات مهم درباره Transform در المنتور
سازگاری مرورگرها
ترنسفرمها در بیشتر مرورگرهای مدرن پشتیبانی میشوند، اما باید سازگاری با دستگاههای موبایل را نیز بررسی کنید.
ترکیب ترنسفرمها
میتوانید چندین ترنسفرم را به صورت همزمان روی یک المان اعمال کنید تا جلوههای پیچیدهتر و حرفهایتری ایجاد شود.
نتیجهگیری
ترنسفرمهای css ، یکی از ابزارهای کلیدی در المنتور هستند که به شما امکان میدهند طراحیهای خلاقانه و منحصربهفردی داشته باشید. با استفاده از این قابلیت، میتوانید جلوههای بصری جذابی ایجاد کرده و تجربه کاربری را بهبود ببخشید. اگر به دنبال یک طراحی پویا و حرفهای هستید، حتماً از ترنسفرمها استفاده کنید.
