آموزش کامل ساخت فرم وردپرس با فرم تماس ۷ (Contact form 7)
همانطور که میدانید امروزه هر سایتی در هر زمینه ای، دارای حداقل یک فرم تماس با ما می باشد. فرمها در وبسایت ها نقش مهمی دارند چراکه بهوسیله آنها می توان از کاربران سایت داده و اطلاعات دریافت کرد. یکی از ساده ترین و رایج ترین نوع فرم که بسیار در صفحات ارتباط با ما سایت های گوناگون دیده ایم، فرم تماس با ما می باشد.
ما در این مقاله به آموزش همه جانبه ساخت فرم در سایت و تنظیم و پیکربندی فرم ها به وسیله افزونه فرم تماس ۷ وردپرس یا همان Contact form 7 می پردازیم. همچنین به ساخت فرم ساده تماس با ما و همچنین فرم پیچیده تری مانند فرم همکاری با ما میپردازیم تا به طور همه جانبه نحوه ساخت فرم در وب سایت و نیز کار با افزونه contact Form 7 را یاد بگیریم.
افزونه های مختلفی برای ساختن فرم در وردپرس وجود دارد. از جمله مهمترین آنها می توان contact form 7 ،گرویتی فرم (Gravity Froms)، نینجا فرم و… را نام برد. در بین این افزونه ها، contact form 7 ساده ترین راه برای انجام این کار می باشد. همچنین فرم تماس ۷ رایگان است و می توانیم به راحتی آن را از مخزن وردپرس نصب کنیم. همچنین اگر به دنبال فرم های خیلی پیچیده و افزونه های سنگین نیستید، شاید بهترین گزینه همین فرم تماس ۷ باشد.
توجه: در این آموزش از افزونه contact form 7 استفاده میکنیم که میتوانید آنرا رایگان از مخزن وردپرس نصب کنید.
معمولاً زمانی که افزونه فرم تماس ۷ را فعال می کنید، داخل داشبورد وردپرس و قسمت فرم های تماس یک نمونه فرم از پیش ساخته شده به طور پیشفرض وجود دارد. هر چند در این آموزش از قالب بی تم استفاده میکنیم که نمونه فرمی از قبل برای ما می سازد و نیز در ادامه این مقاله به نحوه ویرایش آن می پردازیم اما در قدم اول میخواهیم این فرم را در هرجایی از سایت که می خواهیم نمایش دهیم.
ما با استفاده از کدهای کوتاه یا shortcode میتوانیم فرم مورد نظر در فرم تماس ۷ را نمایش دهیم. به این صورت که کد کوتاه فرم مورد نظر را کپی کرده و در هر جایی از سایت مانند برگه ها یا نوشته ها که مایلیم، قرار می دهیم.
به ازای هر فرمی که می سازیم یک شورت کد برای آن تولید می شود و ما میتوانیم کد کوتاه معادل با آن فرم را در هر نوع صفحه ساز و قالبی قرار داده و استفاده کنیم
برای ساختن فرم به قسمت فرمهای تماس در داشبورد وردپرس رفته و بر روی دکمه افزودن جدید کلیک میکنیم. در پنجره جدید عنوان دلخواهی به فرم می دهیم.
سپس مشاهده می کنیم که در قسمت ویرایش فرم تماس ۷ کار ما را از پیش راحتتر کرده و مقادیر رایج پیشفرضی را از قبل داخل ویرایشگر برای ما قرار داده. پس ما میتوانیم از آنها که فیلد های رایجی هستند استفاده کنیم و یا میتوانیم از آنها صرف نظر کرده و فیلدهای خود را را به آن اضافه کنیم.
توجه: در همین مرحله هم میتوانید شورت کد فرم ساخته شده را در جایی از سایت استفاده کنید و مشاهده کنید که فرم پیش فرض به چه شکل است!
گاهی اوقات علامت تعجبی را در فرم تماس ۷ مشاهده میکنیم که نشان از خطای پیکربندی در فرم دارد و هنگامی که مسیر علامت تعجب را می گیریم به تب ایمیل میرسیم و احتمالاً خطایی در فیلد های ایمیل وجود دارد.
فرم تماس ۷ برای سادگی کار ما کدهای کوتاه فیلد های مختلف فرم را برای استفاده در تنظیمات ایمیل فرم قرار داد است که میتوانیم به راحتی از آنها استفاده کنیم.
در ویدئوی این بخش به طراحی یک فرم همکاری با ما می پردازیم که در آن تمامی فیلد ها و امکانات فرم تماس ۷ بررسی شده است.
ساده ترین نوع ورودی برای دریافت یک خط متن از کاربر می باشد مثلاً نام کاربر
که یک فیلد همانند متن تک خطی است اما با این تفاوت که برای گرفتن ایمیل می باشد.
برای گرفتن چند خط پیام متنی است (مانند پیام مخاطب) و تفاوت آن با متن تک خطی در اندازه آن است.
همان دکمه ثبت و ارسال فرم می باشد که با زدن آن توسط کاربر داده ها ارسال می گردد.
یک فیلد تک خطی برای وارد کردن Url یک سایت است و تنها فرمت آدرس اینترنتی را می پذیرد.
همانند متن تک خطی است اما شماره تلفن (عدد) می گیرد.
که برای وارد کردن عدد به دو فرمت مختلف می باشد. حتی می توانیم برای این اعداد، محدوده کمترین و بیشترین تعیین کنیم.
برای انتخاب یک تاریخ از روزهای تقویم می باشد. همچنین می توان برای تاریخ محدوده زمانی قرار داد تا کاربر از آن محدوده تاریخ مورد نظر را انتخاب کند.
امکان قرار دادن منوی کشویی در فرم تماس ۷ نیز وجود دارد. برای این کار کافیست در قسمت تنظیمات فیلد، روی هر خط یک گزینه از منو را بنویسیم.
میتوانیم گزینههایی را قرار دهیم که کاربر هر کدام را که خواست تیک بزند. مثلاً در فرم همکاری با ما می تواند مهارتهایی را که دارد انتخاب کند.
همانند چک باکس برای انتخاب گزینه اما تنها یک مورد از گزینه هاست و تفاوت آن هم با چک باکس در همین موضوع است. مانند فیلد جنسیت که تنها یک جواب دارد.
بعضی از فرم ها دارای گزینه موافقت با قوانین و مقررات می باشند که این فیلد هم به همان منظور استفاده میشود.
برای طرح یک پرسش و پاسخ ابتدایی می باشد که اگر کاربر جواب آن را درست وارد کند، می تواند فرم را ارسال کند.
در فرم تماس ۷ امکان آپلود فایل توسط کاربر وجود دارد. به طور مثال میتوانیم از کاربر فایل رزومه یا عکس و غیره را بگیریم.
فرم تماس وردپرس به طور پیش فرض بر پایه ایمیل کار میکند. این بدان معناست که پیامهای دریافتی را به صورت ایمیل در صندوق ورودی ایمیل شما ذخیره میکند و نه در دیتابیس وردپرس. بنابراین هیچ پیامی داخل سایت شما ذخیره نمیشود. اما اگر شما مایلید که پیام های فرم را داخل وردپرس خود نیز داشته باشید، افزونه ای برای این کار ساخته شده است. این افزونه که فلامینگو نام دارد به شما کمک می کند که تمامی پیامهای Contact Form 7 را داخل سایت وردپرسی خود نیز ذخیره کنید.
برای این کار کافیست flamingo را در جستجوی افزونه وردپرس سرچ کنید و پس از نصب و فعال سازی این افزونه مشاهده خواهید کرد که یک منو تحت عنوان فلامینگو به داشبورد وردپرس شما اضافه میشود که میتوانید پیام های دریافتی را زین پس از آنجا مشاهده کنید.
در این مقاله به صورت همه جانبه و از صفر با کار کردن با فرم تماس ۷ وردپرس آشنا شدیم. ابتدا نحوه نمایش فرم با استفاده از کدهای کوتاه در سایت را مشاهده کردیم. و در بخش بعد با ساختن یک فرم تماس با ما ساده با فیلدهای ساده فرم آشنا شدیم. همچنین پس از آن با علامت خطای پیکربندی فرم تماس که بسیار ارور رایجی است مواجه شدیم. در نهایت با ساختن یک فرم همکاری با ما پیچیدهتر به توضیح تمامی امکانات Contact form 7 پرداختیم. همچنین دیدیم که میتوانیم با استفاده از یک پلاگین جدا به اسم فلامینگو، پیامها را داخل سایت وردپرسی خود نیز ذخیره کنیم.
5 Comments
ممنونم ، عالی بود
ممنون از نظر لطف شما
واقعا عالی بود
سلام و تشکررر فراوان بابت این آموزش. واقعا کاملترین و جامع ترین اموزشی بود که درباره فرم تماس ۷ پیدا کردم. وممنون از آقای پردیسان که همه ی مواردو دقیق توضیح داد.
یه سوال داشتم و اینکه توی تنظیمات فرم اگه پسوند ایمیل فرستنده رو روی دامین اصلی بذارم مشکلی پیش نمیاد؟ چون میخوام از سابدامین ارسال کنم
سلام، ممنون بابت نظر لطف شما و خیلی خوشحالم که به کارتون اومده..
نه مشکلی پیش نمیاد، شما اگر سایتتون روی ساب دامین باشه هم میتونین از آدرس خود سابدامین و هم از آدرس دامنه اصلی ایمیل فرستنده رو تنظیم کنید. مشکل فقط اونجاس که ایمیل دامنه دیگری قرار داده بشه.