فرستادن پیام به صورت ای جکس در Contact Form 7

303 بازدید
دوشنبه ۱۸ مرداد ۱۳۹۵

ارسال پیام به صورت ای جکس

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

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

ایجکس در Contact Form 7

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

عیب یابی مشکل

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

برای حل این مشکل به مسیر نمایش » ویرایشگر در پیشخوان وردپرس بروید.

در صفحه ای که برایتان باز شد، از قسمت سمت چپ، فایل header.php را انتخاب کنید. وارد صفحه ویرایشگر این فایل خواهید شد.

کلید های ترکیبی Ctrl + F را در صفحه کلید فشار دهید. در فیلد بازشده کد زیر را وارد کرده و از نبودن آن در بین کد های موجود مطمئن شوید. در صورتی که چنین کدی را نیافتید، آن را قبل از بسته شدن تگ <head/> به فایل اضافه کنید:

<?php wp_head(); ?>

به شکل زیر:

ارسال پیام به صورت ای جکس در Contact Form 7

سپس از همان قسمت سمت چپ صفحه، روی گزینه footer.php کلیک کنید. وارد صفحه ویرایشگر این فایل خواهید شد.

باز هم کلید های ترکیبی Ctrl + F را بفشارید. اینبار دنبال کد زیر بگردید. در صورتی که نبود، آن را قبل از بسته شدن تگ <body/> اضافه کنید:

<?php wp_footer(); ?>

به شکل زیر:

ارسال پیام به صورت ای جکس در Contact Fotm 7

در پایان روی دکمه ذخیره تغییرات کلیک کنید.

در صورتی که با این کار مشکل برطرف نشد، احتمالا ساختار HTML قالب شما مشکل دارد. باید آن را از نظر استاندارد بودن بررسی کنید. برای اینکار پیشنهاد می کنیم که به سایت W3C Markup Validation Service بروید و آن را بررسی کنید. سپس مشکلاتش را برطرف کنید.

اگر باز هم مشکل وجود داشت، میتواند به علت عدم هماهنگی بین فایل های جاوااسکریپت قالب با افزونه فرم تماس ۷ باشد. میتوانید با افزونه Firebug در فایرفاکس ببینید مشکل جاوااسکریپت از کدام فایل ها می باشد.

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

تبلیغات

نویسنده (مدیر سایت)

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

پاسخ دهید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *