آموزش تغییر استایل فرم های طراحی شده با گرویتی فرم
در این مقاله به آموزش کار با افزونه Gravity form Styles Pro می پردازیم. فرم های جذاب نرخ تعامل بیشتری دارند بنابراین از این آموزش استفاده کنید تا فرم های جذاب تری طراحی کنید.
اگر در سایت خود از افزونه گرویتی فرم برای ایجاد فرم استفاده می کنید و نیاز به استایل جذابتری برای فرم های طراحی شده با این افزونه دارید، می توانید از افزونه گرویتی استایل استفاده کنید. با این افزودنی می توانید با افزودن آیکون، تغییر چینش برچسب، رنگ و اعمال استایل های جذاب به فیلدها، فرم های کاملا شخصی و متفاوتی ایجاد کنید. در ادامه به آموزش افزونه گرویتی استایل می پردازیم. در ابتدا می توانید آموزش ویدئویی افزونه گرویتی فرم را مشاهده کنید.
نکته: برای ساخت فرم های محاسباتی پیچیده در وردپرس بهتر است از افزونه ez Form Calculator استفاده کنید. ساخت فرم محاسباتی در وردپرس به وسیله افزونه، بسیار راحت و سریع است.
آموزش نصب افزونه گرویتی استایل
با سه گام ساده می توانید افزونه گرویتی استایل را نصب کنید.
- پکیج محصول خریداری شده از راست چین را حالت فشرده خارج کنید. در پوشه plugin یک فایل فشرده با نام gravitystyle وجود دارد. این فایل افزونه شماست.
- مشابه سایر افزونه های وردپرس به سادگی از پیشخوان> افزونه ها> افزودن را کلیک کنید. بر روی دکمه بارگذاری افزونه کلیک کرده و فایل gravitystyle را از پکیج آپلود کنید و دکمه نصب را بزنید.
- بعد از نصب شدن افزونه، از پیشخوان وردپرس وارد بخش افزونه ها شده و دکمه فعال شدن افزونه را برنید.
نکته: دقت داشته باشید قبل از نصب و فعالسازی افزونه گرویتی استایل باید آخرین نسخه گرویتی فرم را نصب کرده باشید.
آموزش ویدیویی افزونه گرویتی استایل
در ویدیوی زیر، آموزش کار با افزونه گرویتی استایل را قرار دادیم. در ادامه نیز مراحل را به صورت تصویری می توانید مشاهده کنید.
تغییر استایل فرم های گرویتی
برای سفارشی سازی فرم های ایجاد شده با گرویتی فرمز 2 روش وجود دارد:
1- اعمال استایل خاص به کلیه فیلدهای فرم: در این روش می توانید استایل هایی چون رنگ زمینه و نوشته، فونت، استایل برچسب ها، تنظیمات دکمه و آیکون ها را برای کلیه فیلدهای موجود در فرم تغییر دهید.
2- تغییر استایل تک تک فیلدهای فرم: در این روش تنظیم آیکون، نمایش یا عدم نمایش برچسب، ستون بندی و چیدمان یک فیلد خاص قابل تنظیم است.
تغییر استایل کلیه فیلدهای فرم
برای سفارشی سازی و تغییر استایل فرم مراحل زیر را دنبال کنید و تغییرات مورد نظر خود را در بخش های مختلف اعمال کنید.
- از پیشخوان وارد بخش فرم ها شوید.
- برای فرم مور نظر، اشاره گر موس را بر روی دکمه تنظیمات قرار دهید.
- از لیست باز شده استایل پرو را انتخاب کنید.
سپس از بخش استایل پرو می توانید تنظیمات کلی و یک قالب آماده را به فرم اعمال کنید. برای این منظور از لیست کشویی قالب یکی از آنها را انتخاب و بر روی دکمه ذخیره کلیک کنید.
در ادامه تنظیمات کلی می توانید تعیین کنید که پیام های اعتبار سنجی به صورت پاپ آپ باز شود یا اسکرول خودکار به فیلدهای ضروری که پر نشده انجام شود. تنظیم اسکرول خودکار کاربر را به فیلدهای خطا داری که باید اصلاح شوند منتقل می کند. این تنظیمات باعث ایجاد یک تجربه کاربری عالی می شود.
در ادامه می توانید مجموعه فونت های فعال و نمایش فوتر برای فرم ها را تعیین کنید. فوتر، چیدمان دکمه های بعدی و ارسال را تعیین می کند.
سفارشی سازی قالب های آماده گرویتی استایل
برای تغییر استایل فرم های گرویتی از قالب های آماده که در تنظیمات افزونه گرویتی استایل قرار دارند استفاده نمایید. هر یک از این قالب های آماده تنظیمات جذاب و منحصر به فردی دارند. یکی از قالب هایی که بیشترین شباهت را به فرم مورد نظر شما دارد از لیست قالب ها انتخاب کنید. سپس بر روی دکمه “ویرایش قالب در تنظیمات گرویتی استایل پرو ” کلیک کنید.
پنجره جدیدی باز می شود که می توانید استایل تمام فیلدهایی که در یک فرم قرار میگیرند را تغییر دهید. در تصویر زیر می توانید جزئیات بیشتری از فیلدهای قابل سفارشی سازی را ببینید.
تغییر فونت و سایز نوشته برچسب و فیلدها را می توانید در اولین بخش این پنجره ببینید. در ادامه آموزش کار با افزونه گرویتی استایل به سراغ تنظیمات استایل برچسب، پیشرفته فیلدها، تنظیمات توضیحات، آیکون و لیست های پیشرفته و استایل دهی دکمه می پردازیم.
تنظیمات استایل برچسب
در آموزش افزونه گرویتی استایل، برای تغییر استایل هر فیلد بر روی دکمه + کلیک کنید تا جزئیات نمایش داده شود. تصویر تنظیمات استایل دهی برچسب را در ادامه در ادامه آورده ایم.
فونت، رنگ پس زمینه، تراز بندی، استایل نوشته و حاشیه ها را می توانید برای کلیه برچسب های فرم تغییر دهید. تغییر متن توضیح و استایل فیلدها مشابه استایل برچسب است. از توضیح مجدد آن خودداری می کنیم.
استایل آیکن و لیست های پیشرفته
لیست های پیشرفته شامل دکمه های رادیویی و چک باکس ها هستند که برای تغییر رنگ حالت فعال آنها، کافیست تنظیمات رنگ را در بخش ” استایل آیکون و لیست های پیشرفته” انجام دهید.
استایل دهی پیشرفته دکمه
یکی از موارد مهم در آموزش افزونه گرویتی استایل، استایل دهی پیشرفته به دکمه ها است. در این بخش، رنگ متن دکمه، فونت و سایز نوشته، رنگ پس زمینه، پدینگ و استایل هاور دکمه ها قابل تنظیم است.
در ادامه استایل دکمه های اصلی قرار دارد. منظور ما دکمه های بعدی/قبلی/ ارسال است که می تواند متمایز از استایل دکمه های دیگر باشد.
انتخاب پس زمینه فرم در گرویتی فرم
تغییر رنگ پس زمینه فرم، یکی از موارد تغییر استایل فرم های گرویتی است که در بخش تغییر رنگ پس زمینه در تنظیمات انجام می شود. در این بخش علاوه بر نوع پس زمینه (رنگ، شفاف، تصویر) می توانید رنگ پیام های اعتبار سنجی (مانند * برای فیلدهای اجباری) را نیز تغییر دهید.
در این مقاله به آموزش افزونه گرویتی استایل پرداختیم. شما با نصب این افزودنی به همراه افزونه گرویتی فرم می توانید استایل های جذابی به فرم های خود بدهید. در نتیجه کاربران را تشویق به مشارکت در پر کردن فرم های طراحی شده خود کنید. در صورت داشتن سوال در مورد کار کردن با افزونه Gravity Forms Styles Pro می توانید در قسمت دیدگاه ها از ما بپرسید.
با سپاس از توضیحاتتون.
قسمت فیلد ضروری به انگلیسی نوشته شده، چطور می‌تونیم تغییرش بدیم؟