كيفية إنشاء نماذج AMP في WordPress

نشرت: 2020-07-07

من أجل جعل مواقع الويب يتم تحميلها بشكل أسرع على الأجهزة المحمولة ، أنشأت Google مشروعًا يسمى Accelerated Mobile Pages أو AMP. وعلى الرغم من أنه يوفر تجربة تصفح رائعة للجوال من خلال جعل صفحات الويب الخاصة بك يتم تحميلها بشكل أسرع ، إلا أنه يعطل أيضًا العديد من الميزات المفيدة على موقع الويب الخاص بك. إحدى تلك الميزات التي يمكن اعتبارها خسارة كبيرة هي نماذج الاتصال. نظرًا لأن AMP تستخدم مجموعة محدودة من HTML وجافا سكريبت ، فلن تتمكن من تحميل نماذج WordPress بشكل صحيح على صفحات AMP. لحسن الحظ ، هناك حل سهل متاح. WPForms هو ملحق نموذج WordPress صديق للمبتدئين إلى حد ما يساعدك على إنشاء نماذج WordPress جاهزة لـ AMP. لذلك ، في المقالة التالية ، سنشرح بالتفصيل كيفية إنشاء نماذج AMP في WordPress باستخدام WPForms .

مربعات أحرف مكتوب عليها كلمة "wordpress" ولوحة مفاتيح كمبيوتر بيضاء وهاتف محمول أبيض
يعد تحسين موقع الويب الخاص بك للوصول إلى الهاتف المحمول أسهل بكثير مع AMP.

تعرف على كيفية إنشاء نماذج AMP في WordPress

لذا ، فإن AMP مفيدة إلى حد ما في جعل موقع الويب الخاص بك مناسبًا للجوّال. يعد تثبيت وتفعيل المكون الإضافي AMP الرسمي لبرنامج WordPress شرطًا أساسيًا لاستخدام AMP مع WordPress. بمجرد تنشيطه ، سيضيف المكون الإضافي تلقائيًا دعم Google AMP لموقع WordPress الخاص بك . ومع ذلك ، يمكنك تغيير إعدادات AMP لموقعك على الويب بالانتقال إلى AMP> عام من لوحة التحكم. عندما تكون في صفحة إعدادات AMP ، يمكنك تمكين أو تعطيل AMP على موقع الويب الخاص بك ، ولكن يمكنك أيضًا اختيار وضع موقع الويب لـ AMP واختيار النماذج المدعومة. بعد تكوين AMP ، سيتعين عليك إنشاء نموذج اتصال متوافق مع AMP على موقع WordPress الخاص بك.

إنشاء نموذج WordPress باستخدام WPForms

لبدء العملية ، سيتعين عليك تثبيت وتفعيل المكون الإضافي WPForms Lite على موقعك. هذه هي النسخة الخفيفة من ملحق WPForms Pro. يسمح لك كل من الإصدارين الاحترافي والخفيف من WPForms بإنشاء نموذج اتصال جاهز جاهز لـ AMP. هنا سنتحدث عن النسخة المجانية. بعد تثبيت البرنامج المساعد وتنشيطه ، سيتعين عليك التوجه إلى WPForms> إضافة صفحة جديدة لإنشاء نموذج WordPress جديد. عندما تكون في شاشة إعداد النموذج ، ستتمكن من اختيار قالب نموذج للبدء بسرعة.

إذا كنت تريد أن تبدأ من نقطة الصفر ، فنحن نقترح عليك اختيار النموذج الفارغ. سيفتح بعد ذلك صفحة منشئ النموذج. من هنا ، يمكنك إضافة حقول النموذج أو إزالتها. لإضافة حقل جديد إلى النموذج الخاص بك ، ما عليك سوى النقر فوق حقل النموذج من اللوحة اليسرى ، وسيظهر في لوحة منشئ النموذج على يمينك. بعد الانتهاء ، يمكنك تكوين خيارات الحقل. للقيام بذلك ، انقر فوق أحد الحقول ، ثم ستظهر خيارات الحقل. بطريقة مماثلة ، يمكنك تخصيص جميع الحقول الأخرى.

رجل يعمل على الكمبيوتر
سيسمح لك البدء من نقطة الصفر بتخصيص الإعدادات حسب رغبتك.

بعد ذلك ، انقر فوق علامة التبويب "الإعدادات" لتهيئة إعدادات النموذج. من خلال الإعدادات العامة ، يمكنك تغيير اسم النموذج ، وإرسال نص الزر ، وإرسال نص معالجة الزر ، وتمكين Honeypot لمكافحة البريد العشوائي ، والمزيد. انتقل إلى علامة التبويب "الإشعارات" لإعداد إشعارات البريد الإلكتروني التي ستعلمك عندما يكمل المستخدم النموذج. ستساعدك علامة التبويب "التأكيدات" في إعداد رسالة تأكيد ليتم عرضها عندما يرسل المستخدم النموذج. بعد اكتمال التكوين ، تأكد من حفظ النموذج الخاص بك.

إضافة نموذج AMP إلى الصفحة

بعد أن يكون نموذج WordPress الخاص بك جاهزًا ، يمكنك إضافته إلى صفحة. ستحتاج أولاً إلى إنشاء صفحة جديدة أو فتح صفحة موجودة حيث تريد إضافة النموذج. افتح شاشة تحرير صفحتك ، وانقر على أيقونة إضافة كتلة جديدة ، وتابع تحديد كتلة WPForms. عند القيام بذلك ، ستتمكن من رؤية أداة WPForms المضافة إلى شاشة تحرير صفحتك. تحتاج فقط إلى تحديد النموذج الذي قمت بإنشائه مسبقًا ، وستقوم الأداة على الفور بتحميله في محرر الصفحة. يمكنك أيضًا نشر أو تحديث صفحتك. وهذا كل ما في الأمر. ليس عليك تكوين أي شيء آخر. سيضيف المكون الإضافي WPForms Lite الآن دعم AMP الكامل إلى النموذج الخاص بك. في حال كنت مهتمًا بالشكل الذي تبدو عليه ، يمكنك فتح الصفحة على هاتفك المحمول.

كيفية إضافة google reCAPTCHA إلى نموذج AMP الخاص بك

تتضمن WPForms مواضع جذب لمكافحة البريد العشوائي للقبض على البريد العشوائي وحظره افتراضيًا. بالإضافة إلى ذلك ، يمكنك استخدام Google reCAPTCHA لتقليل عمليات إرسال البريد العشوائي. من أجل استخدام Google reCAPTCHA مع نماذج AMP الخاصة بك ، سيتعين عليك تسجيل موقعك في Google reCAPTCHA v3 والحصول على مفاتيح Google API. للقيام بذلك ، انتقل إلى موقع Google reCAPTCHA وانقر فوق الزر "وحدة تحكم المشرف" في الزاوية اليمنى العليا من الصفحة. سيتعين عليك بعد ذلك تسجيل الدخول باستخدام حساب Google الخاص بك. عند القيام بذلك ، سترى صفحة "تسجيل موقع جديد". ابدأ في ملئه عن طريق إدخال اسم موقع الويب الخاص بك في حقل Label. يدعم Google AMP فقط reCAPTCHA v3 ، لذلك سيكون عليك اختياره من خيارات نوع reCAPTCHA.

بعد الانتهاء ، أدخل اسم المجال الخاص بك ضمن قسم المجالات. سيعرض قسم الملاك عنوان بريدك الإلكتروني بشكل افتراضي. اعلم أنه يمكنك أيضًا إضافة بريد إلكتروني آخر إذا كنت ترغب في القيام بذلك. بعد ذلك ، سيتعين عليك قبول شروط خدمة reCAPTCHA للمتابعة. أيضًا ، لا تنس تحديد مربع الاختيار "إرسال التعديلات إلى المالكين". سيسمح هذا لـ Google بإعلامك بمشكلات مثل التهيئة الخاطئة وحركة المرور المشبوهة على موقعك. بعد الانتهاء ، انقر فوق الزر "إرسال". سترى بعد ذلك رسالة نجاح مع مفتاح الموقع والمفتاح السري لإضافة reCAPTCHA على موقعك. يتيح لك هذا المفتاح إضافة reCAPTCHA إلى النماذج الخاصة بك.

تعديلات إضافية

ومع ذلك ، هناك تعديل آخر تحتاج إلى الاهتمام به. سيضمن توافق AMP مع reCAPTCHA. للوصول إليه ، انقر على رابط "الانتقال إلى الإعدادات" هناك. سيقودك هذا إلى إعدادات reCAPTCHA مرة أخرى باستخدام مربع الاختيار "السماح لهذا المفتاح بالعمل مع صفحات AMP". ما عليك سوى تحديد المربع والنقر فوق الزر "حفظ" أدناه.

فتاة تعمل على جهاز كمبيوتر محمول
لا تنس حفظ كل عملك بعد الانتهاء من ضبط الإعدادات.

الآن بعد أن أصبح لديك مفاتيح Google API لإضافة reCAPTCHA على نماذج AMP ، انتقل إلى WPForms> الإعدادات> صفحة reCAPTCHA في لوحة معلومات WordPress الخاصة بك. ثم اختر خيار reCAPTCHA v3 والصق مفتاح الموقع والمفتاح السري. انقر على زر حفظ الإعدادات. الآن بعد أن تمت إضافة Google reCAPTCHA إلى WPForms ، فأنت حر في تمكينه في النماذج الخاصة بك عند الحاجة. انتقل إلى WPForms> جميع النماذج وحدد النموذج الذي تريد تمكين reCAPTCHA فيه. عندما تظهر شاشة إعداد النموذج ، انقر فوق علامة التبويب "الإعدادات" وحدد قسم "الإعدادات العامة". سترى مربع الاختيار "تمكين Google v3 reCAPTCHA". حدد هذا المربع واحفظ النموذج الخاص بك. بعد ذلك ، قم بإعادة زيارة صفحة الاتصال الخاصة بك واطلع على نموذج AMP مع عملية reCAPTCHA.

ليس بهذا القدر

كما ترى ، من أجل إنشاء نماذج AMP في WordPress ، لن تحتاج إلى مواجهة الكثير من المتاعب. خاصة عندما يكون لديك هذا الدليل بجانبك. نأمل أن نكون قد ساعدتك وأن ترى جميع مزايا نماذج AMP بعد اتباع هذه الخطوات البسيطة القليلة.