contact form 7 – طلوع ارتباطات – قالب وردپرس | افزونه وردپرس | آموزش وردپرس https://teeweb.ir قالب وردپرس ، پوسته وردپرس ، طراحی سایت Sat, 14 Oct 2017 20:27:17 +0000 fa-IR hourly 1 https://wordpress.org/?v=6.4.4 آموزش چند مرحله ای تکمیل فرم تماس ۷ در وردپرس https://teeweb.ir/contact-form-7-multi-step-forms/ https://teeweb.ir/contact-form-7-multi-step-forms/#respond Sat, 14 Oct 2017 20:27:17 +0000 http://teeweb.ir/?p=12668 آموزش چند مرحله ای تکمیل فرم تماس ۷ در وردپرس سلام دوستان؛... مشاهده مطلب »

نوشته آموزش چند مرحله ای تکمیل فرم تماس ۷ در وردپرس اولین بار در طلوع ارتباطات - قالب وردپرس | افزونه وردپرس | آموزش وردپرس پدیدار شد.

]]>
آموزش چند مرحله ای تکمیل فرم تماس ۷ در وردپرس

سلام دوستان؛
همه ی ما در وبسایتمان از فرم های متعددی مثل فرم تماس، ارتباط با ما و …استفاده می نماییم. وردپرس نیز افزونه های خیلی خوبی برای ساخت این گونه فرم ها در اختیارمان می گذارد که هر کدام ویژگی های مخصوص به خود را دارند.

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

افزونه Contact Form 7 Multi-Step Forms

اگر از فرم تماس ۷ استفاده می کنید و آن را در وردپرس خود نصب کرده اید، می توانید با نصب کردن افزونه ی “Contact Form 7 Multi-Step Forms” به آن امکان چند مرحله ای شدن را بدهید! فقط باید طی چند مرحله تنظیماتی را انجام دهیم تا تکمیل فرم تماس ۷ در وردپرس را داشته باشیم.

در گام اول افزونه را نصب و فعال می کنیم. این افزونه در هیچ قسمتی از پنل وردپرس نمایش داده نخواهد شد و به طور مستقیم با “Contact form 7” ارتباط برقرار می کند. در تکمیل فرم تماس ۷ در وردپرس، سه گزینه ی “hidden field، form value، back button” اضافه شده است که مربوط به افزونه می باشد.
پس از فعال کردن افزونه، به سراغ ساخت فرم خود می رویم. در این آموزش من میخواهم فرم را در ۳ مرحله ایجاد کنم! پس باید ۳ فرم و سه برگه داشته باشیم.

contact-form-7-hamyarwp3

سه فرم مختلف به نام های فرم ۱، فرم ۲ و فرم ۳ ایجاد خواهیم کرد.

فرم ۱ را به ترتیب تصویر زیر با افزودن نام و نام خانوادگی و همچنین دکمه ی بعدی ایجاد می کنیم.

form1-hamyarwp

فرم ۲ را نیز با اضافه کردن آدرس ایمیل و دکمه ی قبلی برای بازگشت به فرم ۱ و دکمه ی بعدی برای رفتن به فرم ۳ ایجاد کردیم.

form2-hamyarwp

فرم ۳ نیز با اضافه کردن عنوان و متن پیام و دکمه ی ارسال ایجاد شد.

form3-hamyarwp

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

حال باید به سراغ ایجاد برگه ها برای تکمیل فرم تماس ۷ در وردپرس خود برویم. بر روی گزینه ی افزودن برگه ی جدید کلیک کنید و هر فرم را در یک برگه ی مجزا قرار دهید. فرم ۱ در برگه ی اول، فرم ۲ در برگه ی دوم و فرم ۳ در برگه ی سوم قرار می گیرد.

page-1-hamyarwp2page-2-hamyarwpform3-hamyarwp1

حال باید برای مرحله ای کردن و تکمیل فرم تماس ۷ در وردپرس، دوباره به سراغ صفحه ی فرم ها رفته و از ویژگی “hidden” که به فرم تماس ۷ اضافه شده استفاده کنیم. بر روی گزینه ی ویرایش برای هر بک از فرم ها کلیک کرده و شورت کد مناسب را در انتهای آن قرار می دهیم.

 

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

hidden1-hamyarwp

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

 

1
on_sent_ok: "location.replace('http://example.com/my-second-page/');"

link2-hamyarwplocation-hamyarwp

به صورت تصویر بالا عمل می کنیم و سپس تنظیمات را ذخیره می کنیم.

به همین شکل در فرم دوم شورت کد مربوطه را وارد کرده و در تنظیمات اضافی آن، آدرس برگه ی سوم را می دهیم.

hidden2-hamyarwp

و همچنین فرم ۳ را به همین شکل انجام می دهید!

توجه!!! دقت کنید که در فرم سوم نیازی به وارد کردن آدرسی از برگه ها نیست! زیرا فرم سوم آخرین فرم ما می باشد.

hidden-3-hamyarwp

 

حال با وارد کردن آدرس فرم اول تمامی فرم ها مرحله به مرحله پیش می روند!

result-hamyarwp

جمع بندی!

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

منبع : همیار وردپرس

نوشته آموزش چند مرحله ای تکمیل فرم تماس ۷ در وردپرس اولین بار در طلوع ارتباطات - قالب وردپرس | افزونه وردپرس | آموزش وردپرس پدیدار شد.

]]>
https://teeweb.ir/contact-form-7-multi-step-forms/feed/ 0