آموزش ساخت فرم تماس در وردپرس

آموزش ساخت فرم تماس در وردپرس

زمان مطالعه

5 دقیقه

تعداد بازدید

186

تعداد پرسش ها

0

افزودن به لیست علاقه مندی ها



اشتراک گذاری این مطلب

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

اولین کار برای ساخت فرم تماس در وردپرس دانلود افزونه Contac Form 7 می باشد. پس برای نصب و فعالسازی  این افزونه و ایجاد فرم تماس در وردپرس مطالب زیر را از جاب تیم را مطالعه فرمایید.

آموزش ساخت فرم تماس در وردپرس [Contact Form 7]

مرحله اول: ایجاد فرم جدید

افزونه ای که نصب و فعالسازی کردید در هیچ جای پیشخوان وردپرس نمایش داده نمی شود و به طور مستقیم با Contact Form 7 ارتباط برقرار می کند و بعد از نصب افزونه و فعالسازی آن منوی جدیدی به نام فرم تماس در پیشخوان وردپرس نمایش داده می شود. در ابتدا به سراغ منوی فرم تماس بروید و روی آن کلیک کنید. سه گزینه نمایش داده می شود که برای ایجاد فرم جدید باید روی گزینه افزودن جدید کلیک کنید.

ایجاد فرم جدید برای ساخت فرم تماس


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

مرحله دوم: تکمیل تب فرم

در پایین صفحه ساخت فرم چندین تب وجود دارد که هر کدام کارایی خود را دارند. در تب فرم باید اطلاعاتی را که قصد دارید از کاربر دریافت کنید را وارد کنید. در اینجا چندین فیلد کاربردی مانند تلفن، شماره، تاریخ و ... قرار داده شده که با انتخاب هر کدام از آن ها به طور خودکار کد html مربوط به هر یک در پایین قرار می گیرد. برای وارد کردن هر کدام از آن ها در فرم تماس خود می توانید روی هر یک کلیک کنید.
 

تکمیل تب فرم برای ساخت فرم تماس در وردپرس


برای مثال اگر می خواهید تلفن خود را وارد کنید باید روی برچسب تلفن کلیک کنید تا پنجره ای باز شود که مربوط به تنظیمات فیلد شماره تلفن می باشد.

تنظیمات فیلد شماره تلفن در فرم تماس 7 وردپرس


 

نوع زمینه: اگر تیک این فیلد پر شود وارد کردن شماره تلفن برای کاربر الزامی خواهد شد و بدون وارد کردن شماره تلفن ارسال فرم امکان پذیر نخواهد شد.

نام: این فیلد مربوط به نام فیلد است که به دلخواه می توان انتخاب کرد.

مقدار پیش فرض: اگر این فیلد را پر کنید شماره تلفنی که در آن قرار می دهید به صورت پیش فرض نمایش داده خواهد شد.

نکته: اگر تیک گزینه "این متن به عنوان نگه دارنده در زمینه استفاده می شود" پر شود وقتی کاربر روی آن کلیک کند شماره تلفن پیش فرض پاک می شود.

دو فیلد بعدی را اگر با css آشنایی دارید می توانید پر کنید و نام آن ها را انتخاب کنید و در فایل style.css و یا در مسیر نمایش شخصیسازی تغییراتی ایجاد کنید تا استایل فرمتان را تغییر دهید. سپس بر روی دکمه گذاشتن برچسب کلیک کنید تا به فرم شما اضافه شود.

اگر می خواهید فیلد دکمه رادیو برای پرسیدن سوالی مانند جنسیت قرار دهید باید تنظیمات زیر را اجرا کنید:

تنظیمات دکمه رادیو برا قرار دادن فرم تماس

 

در کادر قرمز رنگ هر تعداد گزینه که مد نظر دارید را وارد کنید. فقط باید دقت کنید که هر گزینه در یک خط قرار می گیرد. سپس بر روی دکمه گذاشتن برچسب کلیک کنید تا سوالتان به همراه گزینه ها در فرم قرار گیرد.

به همین ترتیب می توانید فیلدهای بعدی مورد نیاز خود را وارد کنید تا این قسمت از فرم تماستان تکمیل شود.

مرحله سوم: تکمیل تب ایمیل

وقنی کارتان در تب ایمیل به پایان رسید به تب بعدی یعنی ایمیل بروید. صفحه ای مانند زیر برای شما نمایش داده خواهد شد که باید به صورت زیر پر شود:

تکمیل تب ایمیل در فرم تماس در وردپرس

به: در این فیلد باید ایمیلی را وارد کنید که وقتی یک فرم توسط کاربری پر میشود برای آن ایمیل ارسال شود. درواقع ایمیلی برای دریافت فرم ها را در این قسمت وارد کنید. فرم تماس 7 ایمیلی که به سایت شما لینک داده است را به طور خودکار در این فیلد قرار می دهد پس فقط کافیست صحت آدرس ایمیل را بررسی کنید.

از طرف: این فیلد مربوط به عنوان سایت و ایمیل ارسال کننده می باشد که در هنگام دریافت ایمیل نمایش داده خواهند شد. می توانید آن را شخصی سازی کنید.

موضوع: این فیلد هم مربوط به موضوع ایمیل خواهد بود که در آن ابتدا نام سایت شما و سپس برچسب موضوع می آید. در این فیلد چیزی که کاربر برای موضوع ایمیل پر کرده نمایش داده خواهد شد.

تا اینجا این سه فیلد، فیلدهای اصلی بودند که می توانید برچسب های ایمیل را در هر جایی از آن ها قرار دهید. برچسب های ایمیل با برچسب های فرم تفاوت دارند و هر کدام داری سینتکس متفاوتی هستند. برای مثال از برچسب [text* your-name] در فرم و از برچسب [your-name] در ایمیل استفاده کرد.

سرآیند های اضافی: این فیلد مربوط به برچسب های اضافه می باشد. مثلا اگر در محیط ایمیل روی پاسخ دادن کلیک کنید ایمیل برای کاربری که این فرم را پر کرده ارسال خواهد شد.

محتوای پیام: در این قسمت باید تمامی برچسب هایی که در قسمت فرم وارد کرده بودید را قرار دهید تا تمامی اطلاعاتی که در صفحه تماس از کاربر می خواهید را دریافت کنید.

ایمیل 2: با کلیک بر روی این قسمت نیز یک صفحه دقیقا مشابه همین صفحه نمایش داده می شود. تمامی فیلد های این صفحه نیز مانند مراحلی که الان انجام دادید پر خواهند شد تنها در قسمت "به" باید آدرس ایمیل جدید برای دریافت ایمیل را وارد کنید.

این فیلد به این منظور استفاده می شود که وقتی کاربر فرمی پر کرد اطلاعات ارسالی کاربر را در این ایمیل نیز دریافت کنید. این ایمیل تنها زمانی ارسال خواهد شد که ایمیلی را با موفقیت دریافت کرده باشید.

مرحله چهارم: تکمیل تب پیام

این تب مربوط به پیام های مختلفی می باشد که برای کاربر نمایش داده خواهند شد. برای مثال پیام های خطا، پیام های حاوی پیام موفقیت آمیز بودن انجام هملی و یا ... را به دلخواه می توانید ویرایش کنید. در انتها روی دکمه ذخیره کلیک کنید.

تکمیل تب پیام در فرم تماس با ما وردپرس


 

مرحله پنجم: تکمیل تب تنظیمات اضافی

در این تب می توانید قالب نمایش صفحه ارسال فرم که برای کاربر نمایش داده می شود را تغییر دهید. برای این کار باید به زبان های html و css مسلط باشید تا تغییرات دلخواهتان را اعمال کنید. در این قسمت می توانید ویژگی های خاصی را نیز با استفاده از کد اسنیپت به فرم تماس خود اضافه کنید.

تکمیل تب تنظیمات اضافی در ساخت فرم در وردپرس

در نهایت بعد از اتمام کارتان باید روی دکمه ذخیره کلیک کنید.

مرحله نهایی: قرار دادن شورت کد در برگه

بعد از پر کردن تمامی تب ها و ذخیره کردن پیامی برای شما ارسال می شود که مانند تصویر زیرحاوی یک شورت کد می باشد.

قرار دادن شورت کد ساخت فرم وردپرس در برگه

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


حای گذاری شورت کد فرم تماس وردپرس در برگه


 

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

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

محمد شهبازی
در مورد نویسنده : "من همیشه می توانم آزادانه انتخاب کنم، اما باید بدانم که اگر انتخاب نکنم، باز هم انتخابی کرده ام."


نظرات
0