كيف أحوّل رابط wa.me إلى زر واتساب في موقعي الخاص؟

الكود الجاهز

أنشأنا في منشئ روابط واتساب رابطًا برقم مثال ورسالة قصيرة يكتبها العميل عن طلبه، ثم وضعناه في وسم رابط:

<a href="https://wa.me/966501234567?text=Hi%2C%20I%20have%20a%20question%20about%20my%20order" target="_blank" rel="noopener">راسلنا على واتساب</a>

انسخ الرابط من الأداة بزر «نسخ الرابط» والصقه بين علامتي التنصيص بعد href كما هو. لا تعدّل الرموز التي فيه، ولا تفك ترميزها، فهي التي تحمل رسالتك سليمة. استبدل النص بين الوسمين بالكلمات التي تريدها على الزر.

ماذا تعني كل خاصية

• href: الرابط نفسه. هذا هو الجزء الوحيد الذي يأتي من الأداة.
• target=_blank: يفتح الرابط في تبويب أو نافذة جديدة، فلا يغادر الزائر موقعك. زر «فتح الرابط» في الأداة نفسها يعمل بالطريقة ذاتها.
• rel=noopener: يمنع الصفحة الجديدة من التحكم في صفحتك، وهي ممارسة معتادة مع أي رابط يفتح تبويبًا جديدًا.

لماذا wa.me وليس الصيغة البديلة؟

الأداة تعطيك أيضًا صيغة api.whatsapp.com، وفيها علامة & بين الرقم والرسالة. داخل كود HTML، الكتابة الصحيحة تمامًا لعلامة & داخل خاصية هي ‎&‎. المتصفحات تتسامح غالبًا مع & المجردة، لكن بعض المحررات وأدوات فحص الكود تعترض عليها أو تغيّرها. رابط wa.me لا يحتوي على & أصلًا حين تكون فيه رسالة واحدة، فتتجنب المسألة كلها. استخدم الصيغة البديلة فقط إن طلبها نظام معين.

أفكار عملية للموقع

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

إن كان موقعك مبنيًا على منصة جاهزة لا تسمح بتحرير HTML، فغالبًا فيها حقل رابط لزر أو قائمة. الصق فيه رابط wa.me نفسه، فهو يعمل في أي مكان يقبل رابطًا.

قبل النشر

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