كيفية إضافة نموذج اشتراك Kit إلى WordPress خطوة بخطوة مع تحسين السرعة

إذا كنت تملك موقع WordPress وتريد تحويل القراء إلى مشتركين في نشرتك البريدية، فلا تحتاج بالضرورة إلى تركيب خمس إضافات أو تعديل قالب الموقع. توفر Kit (ConvertKit سابقًا) طريقتين عمليتين لعرض نموذج الاشتراك: تضمين كود JavaScript الرسمي داخل كتلة Custom HTML، أو تركيب إضافة Kit الرسمية واستخدام كتلتها أو Shortcode. الاختيار بينهما يتعلق بعدد المواقع التي سيظهر فيها النموذج ومدى حاجتك إلى إدارة النماذج من داخل WordPress.

الخلاصة: لمقال واحد أو صفحة محددة، ابدأ بتضمين النموذج الرسمي في كتلة Custom HTML واختبره على الهاتف. وإذا أردت تحديد نموذج مختلف لكل قسم أو إعداد نموذج افتراضي لمجموعة صفحات، فقد تناسبك إضافة Kit الرسمية. لا تضع كود التضمين مرتين ولا تستخدم كود نموذج Landing Page على أنه Form. سنوضح بالتفصيل كيف تقلل أثر أي سكربت إضافي على سرعة الموقع، وكيف تتحقق من أن الاشتراك يعمل حقًا.

الشرح مبني على توثيق Kit الرسمي المحدث خلال 2026، وتمت مراجعته في 18 أكتوبر 2026. هو خطوات تطبيق موثقة، لا ادعاء بأننا أجرينا اختبار سرعة فعليًا على موقع بعينه. تتغير أسماء الأزرار أحيانًا بحسب القالب ومحرر Gutenberg أو Elementor، لذلك سنوضح وظيفة كل خطوة.

ما الذي تحتاجه قبل إضافة النموذج؟

تحتاج حساب Kit متاحًا، وصلاحية تحرير مقالات أو صفحات WordPress، ونموذج اشتراك Form أُنشئ وحُفظ داخل Kit، وصفحة اختبار تستطيع فتحها من هاتفك. لا تحتاج خطة Creator المدفوعة لعرض نموذج اشتراك بسيط؛ إذ تتيح الخطة المجانية نماذج وصفحات هبوط غير محدودة ضمن حدود الحساب. لكن الأتمتة المرئية الموسعة وMCP وظائف منفصلة قد تتطلب خطة مؤهلة.

يجب أيضًا التأكد من أن إعدادات الموقع لا تمنع تحميل سكربتات خارجية دون سبب، وأن أدوات الكاش والأمان لا تعيد كتابة السكربت بطريقة تكسر وظيفة النموذج. إذا كنت على WordPress.com لا الاستضافة الذاتية، تحقّق من شروط خطتك لإضافة JavaScript؛ توضح Kit أن تضمين السكربت عبر WordPress.com قد يحتاج Business أو أعلى، مع إمكانية استخدام الإضافة الرسمية على خطط WordPress.com المدفوعة المناسبة.

أولًا: إنشاء نموذج اشتراك داخل Kit

1. سجل الدخول إلى Kit، ثم اذهب إلى Grow → Landing Pages & Forms أو الاسم الموافق لهذه الوظيفة في إصدار حسابك.
2. اختر إنشاء عنصر جديد، ثم اختر Form وليس Landing Page؛ فالأخير صفحة مستقلة وقد لا يمكن تضمينه بالطريقة نفسها داخل مقال.
3. حدد نوع Inline إذا أردت ظهوره داخل متن المقال. أما Modal وSlide-in فلهما قواعد ظهور وسلوك مختلفان.
4. اختر عنوانًا واضحًا ووعدًا دقيقًا، مثل «ملخص أسبوعي لأحدث أدوات الذكاء الاصطناعي»، مع حقل البريد فقط إذا لم تكن بحاجة إلى بيانات أخرى.
5. عدّل ألوان الخط والخلفية لتنسجم مع قالب مدونتك، وتأكد من وضوح تباين النص والزر.
6. اضبط نص الرسالة التي تظهر بعد الاشتراك أو إعادة التوجيه، وخيار تأكيد البريد بحسب إعدادات القائمة وسياساتك.
7. اضغط Save & Publish أو ما يعادله. توضح وثائق Kit أن التعديلات ليست محفوظة تلقائيًا دائمًا في Form Builder.

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

الطريقة الأولى: إضافة Kit إلى WordPress دون تثبيت إضافة

هذه أبسط طريقة لموقع يعتمد Gutenberg أو محرر HTML ويدير عددًا قليلًا من نماذج الاشتراك. يفضل Kit تضمين JavaScript لأنه يحدّث شكل النموذج المعروض على الموقع عندما تعدله من داخل Kit، بعكس كود HTML الثابت الذي يحتاج غالبًا إعادة نسخه بعد التحديث.

الخطوة 1: نسخ كود التضمين الرسمي

افتح النموذج داخل Kit، ثم اضغط زر Embed في أعلى محرر النموذج. اختر تبويب JavaScript ثم اضغط Copy. لا تنسخ شريط العنوان من المتصفح أو رابط صفحة إنشاء النموذج: المطلوب كود Embed الذي تولده Kit لنموذجك أنت. يحتوي عادة على سطر سكربت مخصص؛ يختلف عنوانه ومعرفه بين الحسابات، ولذلك لا نعطي هنا كودًا عامًا مختلقًا قد يربطك بنموذج شخص آخر.

الخطوة 2: إنشاء كتلة Custom HTML في WordPress

1. افتح المقال أو الصفحة من لوحة WordPress، وضع المؤشر حيث تريد ظهور النموذج، ويفضل بعد فقرة مفيدة أو قرب الخاتمة.
2. اضغط زر إضافة كتلة (+) وابحث عن Custom HTML / HTML مخصص.
3. الصق كود Kit كما هو داخل الكتلة، دون لفّه بكود script آخر ودون تكرار الوسم في كتلة أخرى.
4. استخدم زر Preview داخل الكتلة إن أمكن، ثم راجع معاينة الصفحة الأصلية.
5. احفظ المقال كمسودة عند الاختبار أو انشر الصفحة فقط حين تصبح مستعدًا فعلًا لاستقبال المشتركين.

يؤكد دليل Kit للتضمين في WordPress أن كتلة Custom HTML هي المسار المناسب في Gutenberg. قد ترى في شاشة المحرر مكانًا فارغًا أو عرضًا يختلف عن الموقع الفعلي؛ الحكم يكون على صفحة المعاينة أو الواجهة العامة، لا فقط على شاشة الكتابة.

الخطوة 3: التضمين عبر المحرر الكلاسيكي أو Elementor

في Classic Editor، بدّل من العرض المرئي إلى تحرير الكود، والصق Embed في المكان المطلوب ثم عاين الصفحة. في Elementor، استخدم عنصر HTML المخصص، ولا تلصق JavaScript في حقل نص عادي يحوّل الوسوم إلى حروف مرئية. إذا كانت الصفحة تُبنى بواسطة قالب معقد، راجع وثائق القالب لأن بعض القوالب تنظف عناصر script أو تمنعها داخل مناطق معينة.

الخطوة 4: تحقق من عمل الاشتراك

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

الطريقة الثانية: استخدام إضافة Kit الرسمية في WordPress

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

الخطوة 1: تثبيت الإضافة من مصدر موثوق

1. من WordPress انتقل إلى Plugins → Add New ثم ابحث عن Kit أو اسم الإضافة الرسمي الحالي.
2. تحقق من الناشر والوصف والتوافق مع نسخة WordPress قبل التثبيت، وتجنب إضافات متشابهة الاسم من ناشر مجهول.
3. ثبّت الإضافة وفعّلها، ثم شغّل معالج الإعداد.
4. اضغط منح الوصول إلى WordPress عند طلب الربط، ثم اختر حساب Kit الصحيح إذا كنت عضوًا في أكثر من حساب.
5. حدد نموذجًا افتراضيًا أو اختر عدم إظهار نموذج على كل المقالات إن كنت تريد التحكم اليدوي؛ فهذا الخيار موثق في دليل إعداد إضافة Kit.

الخطوة 2: إضافة نموذج داخل المقال

إذا كنت تستخدم Gutenberg، أضف كتلة Kit Form من قائمة الكتل، ثم اختر النموذج من إعدادات الكتلة. في المحرر الكلاسيكي يمكنك استعمال زر Kit في شريط الأدوات إذا كان متاحًا، أو نسخ Shortcode من خيارات Embed في حساب Kit بعد تركيب الإضافة. لا تخترع معرف النموذج؛ انسخ رمز الاختصار المرتبط بحسابك كما هو من Kit، لأن معرفًا غير صحيح سيؤدي إلى صفحة بلا نموذج.

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

الخطوة 3: نموذج افتراضي لكل الموقع أم لكل قسم؟

اختيار Form عالمي قد يناسب المواقع التي تقدم نشرة واحدة لجميع القراء، لكنه قد يكون مزعجًا إذا ظهر أسفل كل صفحة أو تكرر فوق نموذج آخر. عند استخدام نموذج مختلف حسب التصنيف، تأكد من أولوية الإعدادات بين النموذج الافتراضي ونموذج المقال والتصنيف؛ وتذكر وثائق Kit أن بعض أشكال الظهور تختلف بين الصفحات والأرشيفات، وأن النموذج Inline ليس هو نفسه النافذة المنبثقة الافتراضية.

بالنسبة إلى مدونة أدوات AI، يمكنك وضع دعوة «نشرة أدوات التصميم» أسفل مقالات الصور، و«نشرة أدوات البرمجة» أسفل شروحات التطوير، لكن لا تفترض اهتمام القارئ بمجرد تصفحه مقالًا واحدًا. اطلب موافقته الصريحة على الاشتراك في الموضوع المحدد.

أي الطريقتين أفضل للأداء وسرعة الصفحة؟

ليس من الدقة القول إن إضافة Kit دائمًا أسرع أو أبطأ من التضمين اليدوي؛ كلاهما قد يستدعي موارد خارجية، ويتوقف الأثر على القالب والإضافات ومكان ظهور النموذج ووقت تحميله. الفرق العملي أن التضمين اليدوي يسمح بوضع الكود في صفحة محددة فقط، بينما قد يؤدي إعداد Form افتراضي على مستوى الموقع إلى تحميل موارد على صفحات أكثر. القرار يُتخذ بعد اختبار فعلي وليس تخمينًا.

النقطة الأولى: تجنّب إبطاء LCP

عند قياس Largest Contentful Paint، ينبغي ألا يؤخر كود النموذج تحميل العنوان والصورة الرئيسية أعلى المقال. ضع النموذج بعد محتوى مفيد عندما يناسب تجربة القارئ، وتجنب إقحام نافذة منبثقة كبيرة فور فتح الصفحة. لا تعِد كتابة سكربت Kit لتضيف async أو defer بغير توثيق؛ فقد يؤدي تغيير طريقة التنفيذ إلى منع ظهور النموذج. اختبر تأثير النص البرمجي الأصلي أولًا قبل أي تحسين.

النقطة الثانية: تقليل القفزات البصرية CLS

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

النقطة الثالثة: اختبر INP والاستجابة

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

كيف تقيس النتيجة بدقة؟

1. سجل نتيجة صفحة ممثلة قبل إضافة النموذج باستخدام PageSpeed Insights أو أدوات المتصفح، واحتفظ ببيانات LCP وCLS وINP عندما تتوفر.
2. أضف النموذج على نسخة اختبار أو صفحة محددة.
3. افحص الصفحة نفسها بعد الإضافة في الظروف المتقاربة، مع تكرار القياس لأن النتائج تتذبذب.
4. استخدم تبويب Network لمعرفة السكربتات الإضافية، ولا تعتبر حجم الملف وحده دليلًا على تأثيره النهائي.
5. اختر موضعًا لا يحجب المحتوى الأساسي؛ فالسرعة الحقيقية وتجربة الزائر أهم من درجة اختبار منفردة.

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

أفضل موضع لنموذج اشتراك في مقالات عربية

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

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

نموذج نص عربي احترافي يمكنك استخدامه

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

هذا نص تحريري توضيحي يمكن نسخه إلى Form Builder، وليس كود اشتراك بحد ذاته. اجعل الزر «اشترك في النشرة» أو «أرسل لي ملخص الأسبوع»، واترك حقل البريد واضحًا وعنوانه مرئيًا، ولا تكتفِ بنص Placeholder قد يختفي عند الكتابة. راجع رسالة نجاح التسجيل وقالب البريد للتأكد من سلامة اتجاه العربية.

الأمان والخصوصية والموافقة على المراسلات

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

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

حل المشكلات: النموذج لا يظهر أو لا يسجل البريد

لا يظهر Form داخل المحرر

قد لا ينفذ Gutenberg كود التضمين داخل لوحة التحرير بالطريقة نفسها التي يظهر بها للزوار. راجع Preview للصفحة؛ وفي Classic Editor قد لا ترى نموذجًا مرئيًا قبل المعاينة. تأكد أيضًا أن النموذج مُعد نوع Inline وليس نافذة تتطلب حدثًا خاصًا.

يظهر لي النموذج في نافذة خاصة فقط

قد يكون إعداد Kit مضبوطًا على إخفاء النموذج لمن اشترك سابقًا؛ لذلك اختبر من Incognito ومن جهاز آخر. راجع إعدادات Cookies والإخفاء داخل Kit قبل إزالة النموذج وإعادة إنشائه.

النموذج يظهر مرتين

ابحث عن نموذج افتراضي من إضافة Kit وعن كود إضافي داخل المقال نفسه. اختر طريقة واحدة لعرضه في الموضع المطلوب. ربما كانت هناك كتلة Kit Form وShortcode قديم أو عنصر Elementor يكرر المحتوى.

يظهر النموذج لكن لا تصل رسالة التأكيد

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

الخطوط والألوان تخرج عن تصميم الموقع

ابدأ بتعديل Form Builder بدل كتابة CSS عالمي قد يؤثر في كل نماذج الموقع. وتذكر أن تحديث نموذج JavaScript من داخل Kit غالبًا ينعكس تلقائيًا على الصفحات؛ أما نسخة HTML الثابتة فتحتاج إعادة تضمين بعد التغييرات بحسب الوثائق.

الفرق بين Form وLanding Page في Kit

النموذج Form عنصر يمكن وضعه داخل المقال أو عرضه بنمط آخر، أما Landing Page فصفحة كاملة مستقلة ذات رابط مباشر. تنص وثائق Kit Form Embedding على أن Landing Pages لا تُضمّن داخل نص المقال بالطريقة نفسها؛ لكن إضافة Kit الرسمية تتيح مسارًا خاصًا لتقديم صفحة Landing Page تحت عنوان على نطاق WordPress عند الحاجة. لذا اختر نوع العنصر بناءً على هدف الصفحة لا مجرد تشابه الشكل.

متى تحتاج إلى Kit MCP بدل إضافة WordPress؟

لا تخلط بين نموذج الاشتراك وبين موصل Kit إلى ChatGPT: الأول وسيلة لزوار موقعك لإعطاء موافقة على تلقي البريد، والثاني قناة تسمح لمساعد AI بقراءة بيانات حساب Kit أو أداء عمليات مصرح بها. تستطيع استخدام نموذج Form دون أي MCP، كما تستطيع إنشاء نشرة بريدية دون تثبيت إضافة جديدة إذا استخدمت صفحة الاشتراك المستقلة.

للمزيد عن الخدمة ابدأ بـشرح Kit بالعربي، ثم اقرأ دليل ربط Kit مع ChatGPT باستخدام MCP. وإن لم تحدد المنصة بعد فلدينا مقارنة Kit وbeehiiv وMailchimp لمعرفة الخيار الأقرب إلى احتياجات موقعك.

قائمة فحص بعد إضافة النموذج وقبل نشره

1. هل اسم النموذج الذي اخترته صحيح ويتبع حساب Kit المقصود؟
2. هل يظهر في المكان المحدد مرة واحدة فقط؟
3. هل يعمل زر الاشتراك على الهاتف والكمبيوتر؟
4. هل تستقبل رسالة التحقق إذا كانت مفعلة؟
5. هل تظهر العربية والحقول والأزرار من دون قص أو انعكاس؟
6. هل يحتفظ الزائر بسهولة قراءة المقال قبل الاشتراك؟
7. هل توجد طريقة واضحة للاطلاع على سياسة الخصوصية وإلغاء الاشتراك؟
8. هل راجعت أثر الكود على LCP وCLS وتجربة الهاتف بعد إضافته؟

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

الخلاصة

لأغلب مواقع WordPress الصغيرة، أنصح بالبدء بطريقة JavaScript الرسمية داخل Custom HTML في موضع محدد، ثم الترقية إلى إضافة Kit الرسمية فقط عندما توجد حاجة واضحة لإدارة نماذج متعددة أو قواعد ظهور حسب الأقسام والمقالات. اجعل الدعوة مرتبطة بالمحتوى، واختبر التسجيل بالعربية وعلى الهاتف، وراقب أداء الصفحة دون إجراء تعديلات غير مدروسة على السكربتات أو القالب. الهدف ليس تجميع عناوين بأي ثمن؛ بل بناء جمهور يريد فعليًا متابعة ما تنشره.