در این مقاله ما قصد داریم در رابطه با تکیمل مرحله به مرحله فرم تماس 7 با Contact Form 7 Multi-Step Forms صحبت کنیم.اگر تمایل دارید فرم تماس سایت خود را که با فرم تماس 7 ایجاد کرده اید را برای تکمیل شدن به صورت چند مرحله ای کنید این مقاله نحوه انجام این کار به صورت کامل توضیح خواهد داد.
افزونه contact form 7 رایگان می باشد. اگر نیاز به فرم ساز دیگری هستید که پرمیوم باشد. دیجی وردپرس افزونه فرم ساز پیشرفته گراویتی فرم را پیشنهاد می کند.
تمام افرادی که دارای سایت هستند برای سایت فرم ها مختلفی را ساخته و در آن قرار داده اند. اگر بخواهیم چندی از این فرم ها را نام ببریم می توان به فرم تماس، ارتباط با ما و فرم های دیگری از این قبیل اشاره کرد. همانطور که همه شما عزیزان در جریانید وردپرس برای ساخت هر المانی یا هر کار دیگری دارای افزونه ایست، ساخت فرم هم از این قضیه مستثنی نمی باشد.
تکمیل فرم تماس 7 در چند مرحله با افزونه Contact Form 7 Multi-Step Forms
وردپرس دارای افزونه وردپرس بسیاری برای ساخت فرم می باشد، افزونه هایی که می توان به وسیله آن ها فرم های گوناگون و متفاوتی را ساخت. هر کدام از این افزونه های دارای قابلیت های خاص خود هستند که هر کدام به نوبه خود می تواند به ما در ساخت فرم دلخواهمان کمک کند.
ما در این مقاله می خواهیم به افزونه Contact form 7 یکی قابلیت جدید بیافزاییم. این افزونه یکی از بهترین افزونه های فرم ساز وردپرس است که در بین کاربران دارای محبوبیت بسیار بالایی می باشد، دلیل محبوبیت این افزونه می تواند قدرتمندی آن در ساخت فرم باشد. قبلا در بخش مقالات آموزشی آموزش نحوه ایجاد استایل سفارشی در فرم تماس 7 رو توضیح دادیم که می تونه مقاله مفیدی براتون باشه.
حتما شما هم در سایت های مختلف فرم هایی را دیده اید که به صورت مرحله به مرحله یا step by step اطلاعات تماس را از کاربران می گیرد. یکی از عواملی که می تواند برای کاربران جذاب باشد همین مرحله به مرحله گرفتن اطلاعات تماس آن هاست.
حال اگر مایلید که شما هم در سایت خود اطلاعات تماس را از کاربران به صورت مرحله به مرحله بگیرید در ادامه با ما همراه باشید تا افزونه ای که می توانید با آن این کار را انجام دهید را به شما معرفی کنیم و نحوه کار با آن را به شما آموزش دهیم. این افزونه مربوط به گرفتن مرحله به مرحله اطلاعات تماس با فرم تماس 7 می باشد.
پلاگین Contact Form 7 Multi-Step forms
اگر شما برای ساخت فرم در سایت خود از افزونه contact form 7 استفاده می کنید و مایلید که آن را تکمیل کرده و اطلاعات کاربران را به صورت مرحله ای از آن ها دریافت کنید باید افزونه contact form7 multi-step forms را دانلود کرده و سپس نصب و فعال سازی کنید.
بعد از اینکه افزونه مورد نظر را نصب کردید باید به سراغ تنظیمات آن بروید. به این نکته توجه داشته باشید که وقتی افزونه را نصب می کنید این افزونه در هیچ بخشی از پیشخوان وردپرس نمایش داده نمی شود و برای دسترسی به آن و اعمال تنظیمات باید مستقیما از طریق contact form 7 وارد عمل بشوید.
بعد از این که به طور مستقیم با افزونه contact form 7 ارتباط برقرار کردید در بخش تکمیل فرم تماس 7 در وردپرس سه گزینه که مربوط به افزونه contact form7 multi-step forms است نمایان شده است. این گزینه های، گزینه های hidden field , form value , back button می باشند. بعد از اینکه افزونه را فعال کردیم نوبت به ساخت فرم مختص به خودمان می رسد. در این مقاله ما قصد داریم اطلاعات تماس را در 3 مرحله از کاربر دریافت کنیم، پس مسلما باید 3 فرم و 3 برگه بسازیم.
ابتدا شروع به ساخت سه فرم با نام های فرم 1 ، فرم 2 ، فرم 3 می کنیم.
ما می خواهیم در مرحله اول نام و نام خانوادگی کاربر را از او دریافت کنیم، پس فرم یک را همانند تصویری که در پایین مشاهده می کنید با دو المان نام، نام خانوادگی و یک دکمه برای رفتن به فرم دوم می سازیم.
در مرحله بعد نوبت به ساخت فرم دوم می رسد.
در فرم دوم اطلاعاتی که قصد دریافت آن ها را از کاربر داریم آدرس ایمیل می باشد. پس فرم دوم را با یک المان برای دریافت ایمیل و دو دکمه برای رفتن به فرم قبل و رفتن به فرم بعد ایجاد می کنیم.
و در مرحله آخر فرم سوم را برای دریافت عنوان و متن پیام ایجاد می کنیم. در این فرم شما باید دو فیلد، یکی برای عنوان و دیگری برای متن پیام و یک دکمه برای ارسال اضافه کنید.
در بالا همراه هم 3 فرم مجزا را ساختیم، حالا همانطور که در تصویر می بینید سه شورت کد در اختیار داریم.
بعد از این که ما 3 فرم خود را ساختیم نوبت به ساخت برگه ها برای کامل کردن فرم تماس 7 می رسد. برای ساخت برگه به پنل پیشخوان وردپرس مراجعه کرده و از منو کناری گزینه برگه ها و از داخل آن گزینه افزودن برگه جدید را انتخاب کنید. هر فرم را در یک برگه جداگانه قرار دهید، یعنی فرم 1 در برگه اول، فرم 2 در برگه دوم و فرم 3 هم در برگه سوم.
حال نوبت به تکمیل فرم تماس 7 در وردپرس و پایان دادن به عملیات مرحله ای کردن دریافت اطلاعات می رسد. برای این کار مجددا باید به سراغ بخش فرم ها برویم و از گزینه ای که به افزونه اضافه شده است و در بالا به آن اشاره کردیم استفاده کنیم، این گزینه: ویژگی hidden می باشد. برای ویرایش شما باید بر روی گزینه ویرایش کلیک کرده و وارد آن شده و شورت کد مناسب آن را در انتهای آن وارد کنید.
هر فرم شورت کد مخصوص به خود را دارد، این شورت کد ها همان شورت کد هایی هستند که در چند تصویر قبل مشاهده کرید.
در مرحله اول شما باید به سراغ ویرایش فرم اول رفته و شورت کد آن را که نشان دهنده این است که در حال حاظر در فرم اول از سه فرم ایجاد شده هستیم وارد کنید.
حالا نوبت به انجام عملیات و نوشتن کد مربوط انتقال از فرم اول به فرم دوم می رسد. برای این که وقتی کاربر اطلاعات خواسته شده در فرم اول را وارد کرد و قصد رفتن به فرم را داشت باید آدرس برگه ای را که برای فرم 2 ساختید را در بخش تنظیمات اضافی فرم که با کدی که در پایین نمایان است وارد کنید.
on_sent_ok: "location.replace('http://example.com/my-second-page/');"
در این مرحله همانند تصاویر بالا عمل کنید و در نهایت تنظیمات انجام شده را ذخیره کنید.
عملیاتی که در بالا برای فرم 1 انجام دادید یعنی همان قرار دادن شورت کد و وارد نمودن آدرس برگه بعد در بخش تنظیمات اضافی برگه کنونی را در فرم دوم هم انجام دهید.
شورت کد مربوط به فرم دوم را وارد کرده و آدرس برگه سوم را برای رفتن از فرم 2 به فرم 3 در بخش تنظیمات اضافی فرم 2 قرار دهید.
حال شما می توانید برای مشاهده فرم ها آدرس فرم اول را وارد کرده و مشاهده کنید که فرم ها کاملا مطابق میل شما و به صورت مرحله به مرحله یا همان Step by Step پیش می روند.
نتیجه گیری
اگر شما قصد این را دارید که فرم هایی را که در سایت خود ساخته و قرار داده اید را به صورت چند مرحله ای دراورید و یا فرم تماس 7 را در وردپرس کامل کنید، می توانید از افزونه ای که ما امروز در این مقاله آموزش وردپرس به شما آموزش دادیم استفاده کرده و فرم مورد نظرتان به صورت هر چند مرحله ای که می خواهید ایجاد کنید.
