إضافة زر دردشة واتساب على مدونة بلوجر الخاصة بك باستخدام HTML و CSS، سنتعرف على طريقتين لإضافة زر دردشة WhatsApp في بلوجر / Blogger.
إضافة زر دردشة واتساب في بلوجر زر عائم
العديد من مدونات بلوجر تحتاج لإضافة زر دردشة واتساب/ WhatsApp للتواصل مع زائرين الموقع بشكل أسرع عن طريق واتساب، اليوم سنتعرف على كيفية القيام بذلك عن طريق HTML و CSS، الكود خفيف ولا يؤثر على سرعة مدونتك ويمكنك استخدامه في صفحة معينة أو في الموقع بشكل عام .
خطوات إضافة زر واتساب / في مدونة بلوجر
- إضافة زر واتساب ثابت بصفحة معينة.
- إضافة زر دردشة واتساب / زر عائم.
1. إضافة كود HTML لجلب زر WhatsApp
يمكنك استخدام كود HTML التالي لإضافة زر دردشة واتساب / WhatsApp على مدونة بلوجر الخاصة بك، قم بإضافة الكود في المكان الذي تريد أن يظهر فيه الزر على الصفحة.
في كود الزر التالي، استبدل "0901234556789" برقم هاتفك المرتبط بحسابك على واتساب الخاص بك، ويمكنك أيضاً استبدل النص الموجود برسالة أخرى مخصصة حسب رؤيتك.
2. إضافة كود CSS زر واتساب / WhatsApp
في قالب مدونة بلوجر الخاصة بك أدخل إلى لوحة المعلومات بمدونتك > المظهر > تعديل HTML > انقر في الكيبورد على Ctrl +Fوابحث عن وسم الإغلاق <head/> وضع قبله كود CSS التالي لتصميم زر الدردشة على واتساب / WhatsApp.
في هذا الكود، يمكنك تغيير لون خلفية الزر #25D366 ولون الخط المستخدم وحجم الخط وحدود الزر وفقًا للمعايير المتوافقة مع موقع الويب الخاص بك.
بعد الانتهاء من إضافة كود HTML و CSS، قم بمعاينة موقعك لرؤية زر دردشة واتساب / WhatsApp الذى قمت بإضافته. وتأكد أنه يعمل بشكل صحيح.
3. كود إضافة زر واتساب / WhatsApp زر عائم في بلوجر
وبالنهاية أتمنى ان تكون ساعدتك المقالة في إضافة زر دردشة الواتس اب بمدونتك، وإذا كان لديك أي استفسار بشأن الكود المقدم يمكنك مراسلتي او ترك تعليق بمشكلتك وسيتم الرد عليك.
سعدنا بوجودك 😍 شكراً لك اترك تعليقك بمدى أستفادتك من المحتوى دعمنا لنا وسيتم الرد عليك في أقرب وقت. يسعدنا دائماً اقتراحاتكم بخصوص المحتوى وأذا كان لديك أى أستفسار لاتترد بالتعليق أو المراسلة عبر صندوق البريد.