آموزش گرویتی فرم (Gravity Forms) برای ساخت فرم حرفه ای در وردپرس + آموزش ویدئویی

افزونه گرویتی فرم (Gravity Forms) حرفه ای ترین و بهترین افزونه فرم ساز وردپرس است. در این مطلب به آموزش این افزونه می پردازیم تا بتونید انواع فرم ها را در سایت خود پیاده کنید. یکی از موارد بسیار پر کاربرد در تمام سایت ها، فرم های آن ها می باشد. اما گاهی اوقات نیاز دارید یک سری فرم های حرفه ای تر در سایت خود داشته باشید. به عنوان مثال فرمی که بتواند به درگاه پرداخت متصل شود، فرمی که بتواند بر اساس شرایط مختلف فیلد های مختلف نمایش دهد، فرمی که امکان ارسال پیامک را داشته باشد و … . در وردپرس بهترین افزونه برای ساخت این گونه فرم ها و در کل بهترین فرم ساز وردپرس، افزونه Gravity Forms است.

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

افزونه گرویتی فرم فقط به صورت پولی ارائه می شود اما در آموزش ویدئویی و در دوره گفته ایم که چگونه این افزونه را به صورت رایگان و البته قانونی و امن دانلود کنید. پس برای آموزش این فرم ساز و دانلود رایگان افزونه Gravity Forms، ویدئو را ببینید.

میخوای فرم سازی حرفه ای رو کامل یاد بگیری؟ در دوره آموزش فرم سازی وردپرس، افزونه گرویتی فرم رو کامل آموزش دادیم!

گرویتی فرم

آموزش ساخت فرم های فوق حرفه ای در وردپرس با افزونه گرویتی فرم (Gravity Forms)

دانلود ویدئو

برای دریافت این افزونه، می توانید با مراجعه به آدرس github.com/wp-premium/gravityforms آن را دانلود کنید. همچنین افزونه فارسی ساز این افزونه نیز در wordpress.org/plugins/persian-gravity-forms قابل دانلود است. پس از دریافت این دو افزونه، آن ها را نصب و فعال کنید. پس از فعال سازی، منو فرم ها به پنل مدیریت وردپرس اضافه می شود.

Gravity Forms menu

آموزش بخش ویرایش فرم در افزونه گرویتی فرم

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

Gravity Forms forms

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

Gravity Forms new form

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

Gravity Forms form builder

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

Gravity Forms drag

اگر روی هر فیلد در سمت راست کلیک کنید، تنظیمات مربوط به آن فیلد باز می شود. مثلا در تب عمومی می توانید نام فیلد، توضیحات، حداکثر کاراکتر، ضروری بودن یا نبودن، قالب ورودی، یونیک بودن مقدار (کاربر دیگر نتواند مقدار تکراری برای این فیلد وارد کند) را مشخص کنید.

Gravity Forms field general settings

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

Gravity Forms display settings

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

Gravity Forms advance settings

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

Gravity Forms logic condition

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

Gravity Forms conditions

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

از انواع فیلد های دیگر سمت چپ، فیلد های پیشرفته را داریم. این فیلد ها بر اساس کاربر آن ها قابل استفاده است. مثلا اگر بخواهید فیلدی را داشته باشید که کاربر فقط بتواند در آن فیلد ایمیل وارد کند و حروف الکی وارد نکند، می توانید از نوع فیلد ایمیل استفاده کنید. یا مثلا اگر بخواهید ساختار کدملی رعایت شود، کافیست از نوع فیلد کدملی استفاده کنید. این فیلد بعضی از ورودی ها را کنترل می کنند تا صحیح وارد شود. همچنین اگر بخواهید از کاربر فایلی را دریافت کنید، می توانید از نوع فیلد “بارگذاری فایل” استفاده کنید تا کاربر امکان آپلود فایل در فرم را داشته باشید و از کاربر فرمی را دریافت کنید. برای آشنایی بیشتر با تنظیمات این فیلد ها، لطفا ویدئو بالا یا دوره فرم سازی حرفه ای را ببینید.

Gravity Forms advance fields

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

Gravity Forms post

و اما آخرین بخش این قسمت هم فیلد های قیمت گذاری است. از طریق این فیلد ها می توانید فرم خود را به درگاه بانکی وصل کنید و کاربر طبق اطلاعات فرم، مبلغی را پرداخت کند. مثلا می توانید فرم پرداخت مبلغ در سایت داشته باشید تا کاربر مبلغی را وارد و پرداخت کند. یا مثلا ثبت نام یک همایش دارید و می خواهید بلیط بفروشید. یک راهکار آن استفاده از همین افزونه گرویتی فرم و فیلد های قیمت گذاری است. کافیست نام محصول، انوع مکان های صندلی و قیمت ها را مشخص کنید تا کاربر آن را رزرو کند. از طریق این فیلد ها و فرم های پرداخت، کاربر های مختلفی می توانید داشته باشید. البته برای اتصال به درگاه، باید افزونه مربوط به درگاه، مانند زرین پال برای گرویتی فرم را وصل کنید و اطلاعات درگاه را داخل تنظیمات فرم وارد کنید. برای آموزش دقیق این بخش و مثال های عملی، می توانید دوره آموزش فرم سازی حرفه ای وردپرس را تهیه کنید.

Gravity Forms pricing

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

Gravity Forms result

آموزش بخش تنظیمات در افزونه گرویتی فرم

در تب دوم یعنی تنظیمات، سه بخش تنظیمات فرم، تاییدیه ها و اعلان ها را داریم.

Gravity Forms Settings

در تنظیمات فرم، شما می توانید تنظیماتی مانند نام و توضیحات فرم،  متن و استایل دکمه ثبت فرم، محدودیت در فرم، زمانبندی فرم و … را انجام دهید.

Gravity Forms form settings

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

Gravity Forms messages

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

Gravity Forms message edit

از بخش اعلان ها نیز می توانید ایمیل های ارسالی را مدیریت کنید. مثلا تنظیم کنید که بعد از ثبت فرم، ایمیل به ادمین سایت ارسال شود.

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

در تب صندوق ورودی نیز می توانید تمام فرم های ثبت شده توسط کاربر برای آن فرم را ببینید.

Gravity Forms inbox

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

Gravity Forms inbox details

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

نحوه درج و نمایش فرم در سایت

پس از اینکه فرم خود را ساختید، حالا باید آن را در مکان مد نظرتان در سایت نمایش دهید. مثلا شاید بخواهید فرم را در یک برگه یا نوشته قرار دهید. کافیست وارد ویرایش برگه شوید، و خواهید دید که یک گزینه با عنوان “افزودن فرم” به بالا ادیتور وردپرس اضافه شده است.

Gravity Forms add form

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

Gravity Forms forms list

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

Gravity Forms shortcode

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

Gravity Forms final result

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

امیدواریم این آموزش برای شما مفید بوده باشد. اگر سوال یا نظری دارید، حتما از بخش نظرات همین مطلب با ما در میان بگذارید.

میخوای فرم سازی حرفه ای رو کامل یاد بگیری؟ در دوره آموزش فرم سازی وردپرس، افزونه گرویتی فرم رو کامل آموزش دادیم!
حتما عضو کانال تلگرام و صفحه اینستاگرام فصل وردپرس باشید! ما در تلگرام و اینستاگرام مطالب متفاوت تری داریم که در سایت نیست!


من مسعود جواهری نویسنده این مقاله هستم

لیسانس نرم افزار و دیپلم زبان انگلیسی دارم و بیش از 8 سال است که در زمینه طراحی سایت فعالیت می کنم. هم اکنون مدیریت تیم طراحی سایت ورتکس را بر عهده دارم و همچنین در زمینه آموزش طراحی سایت، سایت فصل وردپرس را راه اندازی کردم. در زمینه بازاریابی اینترنتی نیز مشغول مطالعه هستم.

Sl در 16 نوامبر 2019 - 00:19 پاسخ

باعرض سلام و خسته نباشید.من اموزش گرویتی شما رو خریدم اما برای نمایش فرم در سایت به دلیل اپدیت مثل اموزش ، گزینه افزودن فرم وجود ندارد اگر ممکنه راهنمایی کنید
این عکس برگه های من
http://s7.picofile.com/file/8378334684/1.png
این ماله اموزش شما
http://s7.picofile.com/file/8378334726/2.png

    مسعود جواهری در 16 نوامبر 2019 - 12:40 پاسخ

    سلام خدمت شما
    میتونید افزونه ویرایشگر کلاسیک رو نصب کنید تا ویرایشگر قبلی وردپرس رو داشته باشید. متاسفانه مثل اینکه فعلا با ویرایشگر جدید هماهنگ نشده.
    https://wordpress.org/plugins/classic-editor/
    البته شما میتونید شورتکد های مورد نظرتون رو خودتون بنویسید و قرار بدید.

دانلود رایگان کتاب آموزش سئو!