فرم ها بخش بسیار مهمی از سایت هستند. چرا که اگر درست و فکر شده طراحی نشوند، می توانند به تنهایی دلیلی برای ترک سایت توسط کاربران باشند. به خصوص وقتی صحبت از سایت هایی است که محصولات یا خدماتی را می فروشند، پر کردن فرم های ثبت نام، تکمیل خرید و … باید برای کاربران روان و راحت باشد. ما پیشتر در خصوص اهمیت فرم در وردپرس توضیح داده ایم.
اما اگر پیش از این تجربه چندانی در ساخت فرم ندارید، اصلاً نگران نباشید. در وردپرس همه چیز به لطف افزونه ها راحت و شیرین است. از طرفی یکی از قدرتمندترین افزونه های فرم ساز وردپرس، “eForm” است. پس در ادامه ما را دنبال کنید تا آموزش ساخت فرم در وردپرس به کمک این افزونه را به صورت گام به گام با هم ببینیم.
با افزونه eForm بیشتر آشنا شوید
پیش از آن که به سراغ آموزش ساخت فرم در وردپرس با افزونه eForm برویم، بهتر است کمی با این افزونه آشنا شویم. eForm یکی از محبوب ترین افزونه های فرم ساز است که بیش از 13500 کاربر راضی در سرتاسر دنیا دارد. این افزونه از PHP نسخه 5.6 نیز پشتیبانی می کند. لازم به ذکر است که eForm کاملاً با افزونه های محبوب و پرکاربردی مثل ووکامرس سازگار است.
از دیگر ویژگی های طلایی این افزونه این است که فرم هایی که توسط آن ساخته می شوند، برای تلفن های همراه و سیستم عامل های اندروید و iOS کاملاً ریپانسیو هستند. به این ترتیب که فرم ها به طور خودکار متناسب با دستگاهی که کاربر برای پیمایش سایت استفاده می کند، نمایش داده می شوند. از طرف دیگر کار با افزونه eForm بسیار راحت است. بنابراین می توانید بدون نیاز به دانش فنی خاصی، انواع فرم ها را طراحی کرده و در هر جایی از سایت منتشر کنید.
اما ویژگی های این افزونه به اینجا ختم نمی شود. همانطور که می دانید، یکی از رایج ترین مشکلاتی که در حیطه فرم های سایت رخ می دهد و می تواند عملکرد سایت را مختل کند، پر کردن و ارسال تعداد زیادی فرم توسط ربات های خرابکار است. به همین جهت یک افزونه فرم ساز استاندارد، موظف است تا جای ممکن از چنین حمله هایی جلوگیری کند. خوشخبتانه افزونه eForm نیز می تواند به روش های مختلف سپری را برای مقابله با این حملات بسازد.
نحوه استفاده از افزونه eForm برای ساخت فرم در وردپرس
اولین گام آموزش ساخت فرم در وردپرس این است که افزونه eFrom را مثل هر افزونه دیگری نصب و فعال کنید. اگر با نحوه انجام این کار آشنا نیستید، می توانید آموزش نصب افزونه را مشاهده کنید.
پس از آن که این افزونه روی وردپرس فعال شد، در منوی اصلی وردپرس یک گزینه تحت عنوان “eForm” با زیر منوهایی که در تصویر زیر می بینید، ظاهر می شود.
تنظیمات اولیه
قبل از این که به ادامه آموزش ساخت فرم در وردپرس بپردازیم، لازم است به یک نکته اشاره کنیم. اگر روی یکی از زیرمنوهای efotm کلیک کنید، چنین نوشته ای را بالای صفحه مشاهده می کنید:
طبق این نوشته، ابتدا باید یک سری تنظیمات را مشخص کنید. این تنظیمات مربوط به فضای کاربری خود افزونه هستند. به این معنی که می توانید قالب یا متونی که در بخش های مختلف این افزونه می بینید را به دلخواه خود تغییر دهید. پس “کلیک کنید” را انتخاب کنید تا تنظیمات اولیه را انجام دهید. با این کار لیستی از تنظیمات مربوط به ظاهر و متن ها را مشاهده می کنید. به عنوان مثال می توانید قالب صفحه را به چیزی دیگر تغییر دهید. اما اگر مایلید که از همان تنظیمات پیش فرض افزونه استفاده کنید، روی گزینه “بعد” که پایین و سمت چپ صفحه است، کلیک کنید.
در صفحه دوم نیز ادامه تنظیمات فضای کاربری افزونه را مشاهده می کنید. پس باز هم اگر تغییر خاصی مد نظر ندارید، روی گزینه “پایان” کلیک کنید.
حالا می توانید به سراغ گزینه های کاربردی eForm بروید. در ادامه کاربرد بخش های مختلف این افزونه را با هم بررسی می کنیم.
بخش “داشبورد”
آموزش ساخت فرم در وردپرس به کمک افزونه eFrom را با بررسی گزینه داشبورد این افزونه شروع می کنیم. این بخش مختص مدیریت و ارزیابی فرم هاست. اولین داده هایی که در آن می توانید مشاهده کنید، آمار ارسال فرم ها (در دو بخش همه فرم ها و جدیدترین ها) است.
حالا اگر تا پایین تر اسکرول کنید، تنظیمات ظاهری فرم ها را می بینید. در این بخش ابتدا باید از منوی کشویی فرم مد نظر خود را انتخاب کنید. همانطور که می بینید، چندین فرم پیشفرض در این افزونه ارائه شده است. اما وقتی خودتان فرم های جدید می سازید، آنها هم به این لیست اضافه خواهند شد. سپس می توانید ابعاد این فرم را تغییر داده و لینک و شورت کد این فرم را سفارشی سازی کنید.
پس در بخش داشبورد فقط می توانید گزارش فرم هایی که توسط کاربران ارسال شده را مشاهده کنید و تنظیمات سایز، لینک و شورت کد فرم ها را تغییر دهید.
بخش “نمایش همه فرم ها”
وقتی روی زیرمنوی افزونه eForm کلیک می کنید، لیستی از همه فرم هایی که تا به حال ساخته شده نمایش داده می شود که فرم های پیشفرض افزونه نیز در همین لیست هستند.
در این بخش این امکان را دارید که روی هر یک از این فرم ها کلیک کرده و داده هایی که برای آن فرم وجود دارند را مشاهده کنید. برای مثال اگر “Contact form” را انتخاب کنید، گزارشی از کاربرانی که این فرم را تکمیل و ارسال کرده اند را همراه با اطلاعاتی مثل ایمیل، تلفن، IP و … آن کاربر می بینید.
بخش “فرم جدید”
و اما می رسیم به مهم ترین بخش آموزش ساخت فرم در وردپرس، یعنی گزینه “فرم جدید”. برای ایجاد یک فرم جدید روی این گزینه کلیک کنید. با این کار وارد فضایی می شوید که می توانید تنظیمات کلی این فرم را انتخاب کنید. تنظیماتی مانند:
- اسم فرم
- ایمیل فردی که قرار است اعلان های ارسال فرم ها را دریافت کند (احتمالاً مدیر سایت)
- ایمیلی که قرار است پیام تأیید دریافت فرم را به کاربر ارسال کند
- پیامی که بعد از ارسال فرم به کاربر نمایش داده می شود
ما اینجا برای فرم جدید نام “فرم تکمیل ثبت نام” را وارد می کنیم. هر چند که این بخش دارای تب های مختلفی است، اما همین تب ها برای انتخاب همین تنظیمات است. اما برای ساخت و طراحی فرم باید گزینه “ایجاد فرم” را در تب “خالی” انتخاب کنید. پس بعد از انتخاب این تنظیمات، روی این گزینه کلیک کنید.
با انتخاب این گزینه، وارد ادیتور فرم افزونه eForm می شوید. در ادامه آموزش ساخت فرم در وردپرس به کمک این ادیتور را در مراحل مختلف با هم می بینیم.
ساخت عناصر جدید برای فرم:
اول باید بدانید قرار است در فرم خود چه اِلِمان هایی داشته باشید. ما در اینجا به عنوان مثال، یک فرم برای تکمیل ثبت نام و وارد کردن ایمیل توسط کاربر می سازیم. برای این کار 2 مرحله زیر را را برای اضافه کردن دو عنصر به این فرم طی می کنیم.
نکته: نحوه کار با همه اِلِمان های این ادیتور یکسان است. بنابراین در همه عناصر می توانید همین روال را طی کنید تا بخش های مختلف فرم خود را بسازید.
مرحله 1:
برای وارد کردن عنصر جدید به فرم، کافیست روی یکی از اِلِمان های موجود در سمت چپ صفحه کلیک کنید. به عنوان مثال ما روی اِلِمان “ورودی متن” کلیک می کنیم. حالا یک نوار برای این اِلمان ساخته شده که سمت چپ آن 3 آیکون وجود دارد. این آیکون ها عبارت اند از:
- حذف
- کپی کردن
- انتخاب تنظیمات
حالا برای این که این عنصر را سفارشی سازی کنید، روی آیکون تنظیمات کلیک کنید. با این کار پنجره زیر برای تعیین مشخصات این عنصر باز می شود. ما برای این فیلد تنظیمات زیر را وارد کردیم:
در نهایت برای ذخیره این تنظیمات، روی آیکون تیک بالا و سمت راست یا روی گزینه “ذخیره تنظیمات” پایین پنجره کلیک کنید.
مرحله 2:
می توانید به همین ترتیب باقی عناصر فرم را هم اضافه کنید. برای مثال ما یک فیلد دیگر از نوع “گزینه های چک باکس” به فرم اضافه می کنیم.
حالا روی آیکون تنظیمات کلیک می کنیم تا پنجره جزئیات آن ظاهر شود. ما متن زیر را برای این عنصر در نظر می گیریم.
سپس در تب “گزینه ها” انتخاب هایی که کاربر پیش رو دارد را تعیین می کنیم. سپس تغییرات را ذخیره می کنیم.
حالا فرم ساده ما با دو عنصر ساخته شده است. پس در قسمت بعدی به سراغ ذخیره کردن آن می رویم.
نکته 1: گزینه “ثبت کردن” که کاربر باید برای ارسال فرم روی آن کلیک کند، به طور خودکار به فرم اضافه می شود و نیازی به ساخت آن نیست.
نکته 2: هر زمان که لازم بود جایگاه عناصر را جا به جا کنید، کافیست روی آیکون آن عنصر در سمت چپ نوار مربوط به آن بروید. سپس وقتی آیکون دست ظاهر شد، آن را تا هر جایی که خواستید، درَگ کنید.
ذخیره و بازبینی فرم:
برای ذخیره این فرم جدید دو روش دارید. روش اول این که روی آیکون ذخیره فرم که بالا و سمت چپ صفحه است، کلیک کنید. روش دوم نیز این است که کلیدهای Ctrl+S کیبورد را فشار دهید.
حالا اگر حالت نمایش را روی “فقط نمایش فرم” یا “سازنده و فرم” قرار دهید، فرمی که ساختید را در سمت چپ صفحه مشاهده می کنید.
اضافه کردن صفحه های بعدی به فرم:
در افزونه eForm، می توانید فرم خود را در چند صفحه بسازید، به این ترتیب که کاربر با وارد کردن فرم صفحه اول، وارد صفحه بعدی شود. برای این کار کافیست روی آیکون ساخت صفحه جدید کلیک کنید. با این کار یک صفحه جدید ساخته می شود که می توانید به همان ترتیب قبلی، عناصر این صفحه را بسازید.
تغییر ظاهر فرم ها:
امکانات افزونه قدرتمند eForm به همین موارد محدود نیست. بلکه می توانید ظاهر فرم ها را به طور کل تغییر دهید. برای این کار روی گزینه “استایل” که بالا و سمت چپ صفحه است، کلیک کنید.
در پنجره ای که باز می شود، می توانید از کلیاتی مثل رنگ پوسته گرفته تا جزئیاتی مثل رنگ آیکون ها را تنظیم کنید. برای مثال ما پوسته روشن نیلی رنگ را برای فرم خود انتخاب کرده ایم. همینطور رنگ گزینه ارسال را از خاکستری به رنگ هماهنگ با این پوسته جدید تغییر دادیم. تصویر یک گرادیانت را هم برای بک گراند فرم انتخاب کرده ایم.
فراموش نکنید که برای ذخیره این تغییرات روی گزینه “ذخیره” کلیک کنید. فرم نهایی ما به این شکل است:
انتخاب تنظیمات کلی فرم:
اگر روی گزینه “پیکربندی” بالا و سمت چپ صفحه کلیک کنید، می توانید تنظیماتی کلی را برای فرم جدید خود تعیین کنید. این تنطیمات شامل موارد بسیاری است که در عمل نیازی به تغییر همه آنها ندارید. اما برای مثال اگر می خواهید این فرم را در یک دسته خاصی از فرم ها قرار دهید (پایین تر با ساخت دسته ها آشنا می شویم)، می توانید وارد تب “تنظیمات فرم” شده و یک دسته را بری آن انتخاب کنید.
انتشار فرم:
در نهایت وقتی از فرم خود راضی بودید، می توانید به راحتی آن را در هر جایی از سایت منتشر کنید. برای این کار روی آیکون علامت سؤال بالا و سمت چپ صفحه کلیک کنید. سپس گزینه “اضافه کردن به سایت” را انتخاب کنید.
اینجا پنجره ای داریم که چند اطلاعات مهم را در اختیارمان قرار می دهد:
- شورت کد فرم
- کد نمایش پاپ آپی فرم
- کد PHP فرم برای قرار دادن در فایل های اصلی سایت (در قسمت پایین تر پنجره)
می توانید هر یک از این کدها را کپی کرده و آن را در جایی که می خواهید فرم را منتشر کنید، Paste کنید. اما علاوه بر استفاده از کدها، می توانید به مسیر نمایش> ابزارک ها بروید و در ابزارکی که مد نظر دارید، فرم را منتشر کنید.
توجه: آموزش ساخت فرم در وردپرس به کمک افزونه eForm اینجا به پایان می رسد. اما در ادامه، کاربرد زیرمنوهای دیگری که در این افزونه ارائه شده اند را مرور می کنیم.
بخش “درون ریزی و برون ریزی فرم ها”
فرض کنید یک فرم در افزونه eForm طراحی کرده و تنظیماتی را برای ظاهر و فیلدهای آن انتخاب کرده اید. حالا می خواهید همین فرم را با همین تنظیمات در یک سایت دیگر داشته باشید. اینجاست که باید در این بخش فرم مد نظر را برون ریزی کنید. با انتخاب گزینه “تولید کد” کدهای این فرم در اختیارتان قرار می گیرد.
همینطور می توانید برعکس این کار را انجام دهید. یعنی فرمی را که در سایت دیگری ساخته اید، وارد این سایت کنید. برای این کار باید از بخش درون ریزی استفاده کنید. به این ترتیب که کافیست ابتدا نام فرم را وارد کرده و بعد کدهای آن فرم را در بخش مشخص شده وارد کنید.
بخش “دسته بندی فرم”
مبحث بعدی که می خواهیم در آموزش ساخت فرم در وردپرس به آن بپردازیم، دسته بندی فرم هاست. در این بخش می توانید ضمن ایجاد دسته جدید برای فرم ها، سایر دسته ها را هم مشاهده کنید. برای ساخت یک دسته جدید باید روی “افزودن جدید” بالای صفحه کلیک کنید. سپس نام دسته و در صورت تمایل، توضیحاتی را برای آن وارد کنید.
حالا اگر به صفحه قبل برگردید، می بینید که این دسته جدید به لیست دسته اضافه شده است.
حالا می توانید یک دسته را به فرم های خود اطلاق کنید. سپس در این قسمت روی نام دسته کلیک کنید تا همه فرم هایی که داخل این دسته هستند، نمایش داده شوند. با دسته بندی فرم ها، مدیریت فرم ها بسیار راحت تر خواهد بود.
بخش “گزارشات”
این بخش نیز از دیگر امکانات مدیریتی افزونه eForm است. در این بخش می توانید گزارشات یک فرم خاص یا یک بازه زمانی خاص را دریافت کنید.
بخش “نمایش یک ارسالی”
در این بخش هم این امکان را دارید که ارسالی های فرم ها را یک به یک و به تفکیک بررسی کنید.
بخش “نمایش همه ارسالی ها”
با ورود به این بخش می توانید لیست ارسالی ها را در قالب دیگری ببینید. به این ترتیب که به کمک فیلترهای بالای صفحه، می توانید نمایش فرم ها را بر اساس نام فرم، کاربر، دسته، آدرس و منابع فیلتر کنید.
بخش “نمایش پرداخت ها”
این قسمت از افزونه eFrom به طور ویژه برای نمایش پرداخت هایی است که از طریق فرم ها انجام شده اند. در این بخش نیز می توانید از فیلترهای نام فرم، کاربر، روش های پرداخت و وضعیت تراکنش، برای نمایش گزارش پرداختی ها استفاده کنید.
بخش “پیکربندی”
بخش بعدی، یعنی پیکربندی نیز برای انتخاب تنظیمات کلی تر افزونه است. در این بخش امکانات زیر را در دست دارید:
- ادغام کردن APIهای گوگل (مثل گوگل مپ)
- تعیین ایمیلی برای اطلاع رسانی های مربوط به فرم های افزونه
- انتخاب برگه های پیگری در مراحل مختلف
- فعال یا غیر فعال کردن اعلان های ارسال فرم
- تعیین سرصفحه و پاصفحه فرم ها
- و … .
دقت کنید که وقتی تنظیمات خود را انتخاب کردید، باید روی گزینه “ذخیره تغییرات” کلیک کنید.
کلام آخر
همانطور که در این راهنما مشاهده کردید، افزونه eForm دو قابلیت برجسته دارد. یکی امکان ساخت انواع فرم ها با ظاهر کاملاً سفارشی سازی شده و دیگری وجود چندین گزینه برای ارزیابی فرم ها و مشاهده گزارش فرم ها. امکانات مدیریت فرم ها در این افزونه به اندازه ای کاربردی است، که می توان به چند روش فرم ها را بررسی کرد. مثل مشاهده ارسالی های همه فرم ها، مشاهده ارسال های یک فرم خاص و … . بنابراین به کمک این افزونه می توانید دید جامع و منظمی به فرم ها و تعداد ارسال فرم ها داشته باشید.
لازم به ذکر است که چنانچه قصد استفاده از افزونه eForm را دارید، می توانید نسخه اورجینال و استاندارد آن را از مارکت ژاکت تهیه فرمایید. با خریداری این افزونه از ژاکت، از 6 ماه پشتیبانی رایگان نیز بهره مند خواهید شد. امیدواریم به کمک این آموزش ساخت فرم در وردپرس به کمک افزونه eForm بتوانید فرم هایی کارآمد برای سایت خود طراحی کنید و به دنبال آن تعامل باکیفیت تری با کاربران داشته باشید.