آیلین وب

دوستان عزیز، برای حمایت از ما حتما به ما رای بدهید​

ساخت فرم در المنتور میتونه یکی از آموزش هایی باشه که توی هر سایتی لازم باشه و هر کسی بخواد فرم های بسیار حرفه ای و کاملا واکنش گرا به سایت با استفاده از افزونه Elementor اضافه بکنه. و این آموزش هم یکی از آموزش هایی هست که خیلی از کاربران سایت درخواست داده بودن. پس حتما در ادامه همره ما باشید … .

مراحل آموزش ساخت فرم در المنتور

برای یادگیری بهتر، آموزش رو به صورت مرحله به مرحله کردیم تا براحتی بتونید مراحل رو به درستی پیش برید.

مرحله 1: این آموزش را با اضافه کردن بخش جدید شروع خواهیم کرد. (یک بخش یا سکشن جدید در المنتور ایجاد بکنید.)

Custom Elementor Mega Menu5 min - ساخت فرم در المنتور (رسپانسیو)
بخش جدید المنتور

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

Creating Dynamic Content Using Elementor7 min - ساخت فرم در المنتور (رسپانسیو)
ستون در المنتور

مرحله 3: در پنل ابزارک های موجود در نوار کناری سمت راست، بزارک “بخش داخلی” رو به صفحه و بخش مورد نظر بکشید و رها کنید تا ابزارک در محل موردنظر جا بگیره.

Elementorformresponsivetutorial3 - ساخت فرم در المنتور (رسپانسیو)
ابزارک بخش داخلی

تا الان باید چیزی شبیه به تصویر زیر ایجاد کرده باشید.

Elementorformresponsivetutorial4 - ساخت فرم در المنتور (رسپانسیو)
2 ستونه در المنتور

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

Elementorformresponsivetutorial5 - ساخت فرم در المنتور (رسپانسیو)
حذف ستون در المنتور

مرحله 5: مرحله بعدی جستجوی ویجت “فرم” است. توجه داشته باشید که این ویجت فقط در Elementor Pro موجود است.

Elementorformresponsivetutorial6 - ساخت فرم در المنتور (رسپانسیو)
ابزارک فرم

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

Elementorformresponsivetutorial7 - ساخت فرم در المنتور (رسپانسیو)
فرم در المنتور

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

Elementorformresponsivetutorial8 min - ساخت فرم در المنتور (رسپانسیو)
تنظیمات فرم در المنتور

مرحله 7: عرض هر عنصر را بطور مناسب تنظیم کنید. برای این کار ، عرض ستونم را به 25٪ تغییر می دهم.

Elementorformresponsivetutorial9 - ساخت فرم در المنتور (رسپانسیو)
عرض ستون

تا اینجا باید فرمی همانند تصویر زیر داشته باشید.

Elementorformresponsivetutorial10 - ساخت فرم در المنتور (رسپانسیو)
فرم خطی در المنتور

مرحله 8: به منظور ایجاد زمینه های متمرکز و وسط چین ، به “پیشرفته / موقعیت سفارشی” بروید و “عرض” را روی “خطی (خودکار)” تنظیم کنید.

Elementorformresponsivetutorial11 - ساخت فرم در المنتور (رسپانسیو)
خطی خودکار

مرحله 9: سپس فرم به شکل زیر خواهد بود. برای نشان دادن تنظیمات فرم ، روی نماد برجسته (یه آیکون 2 ستونه هست) کلیک کنید.

Elementorformresponsivetutorial12 - ساخت فرم در المنتور (رسپانسیو)
تنظیمات فرم در المنتور

مرحله 10: “تراز عمودی” را روی “وسط” و “تراز افقی” به “مرکز” تنظیم کنید تا نتایج مشابه با تصویر زیر را داشته باشید.

Elementorformresponsivetutorial13 - ساخت فرم در المنتور (رسپانسیو)
تنظیمات ستون عمودی و افقی

مرحله 11: عرض را مطابق با اولویت خود تنظیم کنید.

Elementorformresponsivetutorial14 - ساخت فرم در المنتور (رسپانسیو)
تنظیمات عرض

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

Elementorformresponsivetutorial15 - ساخت فرم در المنتور (رسپانسیو)
فرم در ستون

اگر می خواهید عناصر دارای یک “خط کامل” باشند ، فقط عرض ستون هر عنصر را روی 100٪ تنظیم کنید و به صورت زیر ظاهر می شود:

Elementorformresponsivetutorial16 - ساخت فرم در المنتور (رسپانسیو)
یک خطی در المنتور

خب دوستان گلم،تا اینجا ما یک فرم زیبا رو توی المنتور طراح کردیم و براحتی می توانید به تنظیمات استایل هم برید و رنگ ها و استایل فیلد ها رو تغییر بدید و به فرم مد نظر خودتون تبدیل کنید.

نتیجه گیری

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

موفق و پیروز باشید.

دیدگاه‌ خود را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

پیشنهاد میکنیم این مقالات را هم بخوانید
ساخت بخش دانلود به ازای دریافت ایمیل یا موبایل با المنتور + ویدئوی آموزشی

ساخت بخش دانلود به ازای

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

ارسال لینک دانلود به ایمیل در وردپرس با افزونه subscribe & download + ویدئوی آموزشی

ارسال لینک دانلود به ایمیل

با معرفی افزونه subscribe & download با ما همراه باشید،  یا همان ارسال

قالب Astra Pro : قالب

قالب Astra Pro | قالب آسترا مخصوص افزونه المنتور بعد از مدتها

ساخت استایل منوی اپلیکیشن موبایل با المنتور

ساخت استایل منوی اپلیکیشن موبایل

در این مقاله بسیار مفید می خوام که نحوه ساخت یک استایل

مطالب داغ
اسکرول به بالا
طراحی انواع سایت
طراحی انواع سایت با قیمت بسیار ارزان!