التخطي إلى المحتوى الرئيسي

طريقة جعل قالب متوافق مع جميع الشاشات { الحل 2 }


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

فمنصة البلوجر وفرت بعض الاضافات في نسخة الهاتف (متوافقة مع نسخة الهاتف و الحاسوب و شاشات مختلفة) و التي هي :
  • رأس الصفحة (Header)
  • رسائل المدونة الإلكترونية (Blog Posts)
  • AdSens
  • الاسناد (Attribution)
  • الملف الشخصي (Profile)
طريقة اظهار أو اخفاء أدوات بلوجر في نسخة الهاتف 

الطريقة سهلة فماعليك الا الذهاب الى لوحة تحكم مدونتك ثم قالب ثم تحرير html بعد ذالك تبحث عن اسم الأدات التي تريد أن تخفيها أو أن تظهرها في الهاتف فقط ..


كما قمت بتسميتها بالضبط , بعد ايجادها سترى أنها في كود يبدء بوسم b:widget و هذا الوسم يدل على أن هذا كود خاص بأداة  عموما بعد ايجاد الكود و ملاحظة الوسم ستجد كود الأدات بهذا الشكل 

ما سنقوم بفعله هو أننا سنذهب الى ذالك المكان الفارغ الذي بين b:widget و  "id  ="HTML1 و سنقوم بوضع أحد هذه الأكواد في ذالك الفراغ 

'mobile='yes لكي تضهر في نسخة الهاتف و نسخة الحاسوب 
'mobile='no لكي لا تضهر في نسخة الهاتف و تظهر في نسخة الحاسوب فقط
'mobile='only لكي تضهر في نسخة الهاتف فقط و لا تظهر في نسخة الحاسوب  
ملا حظة : لقد وجدت أن هناك خطأ في البلوجر عندما تقوم بوضع علامة  'Mobile='only فعندما تقوم بتعديل على الأداة فلن يتم التعديل و ستظهر لك رسالة خطأ و الحل للتعديل على الأداة هو , حذف علامة  'Mobile='only بعد ذالك عدل ما تريد تعديله ثم أعد اضافة علامة  'Mobile='only  .


كما ترى هذا الدرس الطويل كله فقط من أجلك فلماذا لا تقوم بكتابة بعض الأحرف في تعليق , أنا أتقبل كل تسائلاتك و كل أرائك 


موضوع :
100 من 100 | 100 تقييم من المستخدمين و 68 من أراء الزوار


أساسيات جعل قالب بلوجر متجاوب مع جميع الأجهزة

تعليقات

المشاركات الشائعة من هذه المدونة

اضافة اداة المشاركه عبر المواقع الاجتماعيه تحت كل تدوينة

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

كيف تستفيد من أداة Inspect Element في جوجل كروم

Inspect Element هي أداة توجد في متصفح جوجل كروم وهي أداة وضعت خصيصا لمطوري الويب أو web devloper فيها العديد من المميزات لمساعدة مطور الويب في عمله و لهدا سأريك في هدا الدرس أهم الاستعمالات لأداة Inspect Element  كيف تستفيد من أداة Inspect Element في جوجل كروم  نافذة Elements من هده القائمة يمكنك مشاهدة جميع عناصر الصفحة و أكواد ال css الخاصة بكل عنصر ,ويمكنك التعديل عليها حسب ذوقك ادا كنت تتقن ال HTML و CSS  نافذة Sources هده النافذة تمكنك من مشاهدة مصادر موقعك التي تتمثل في السكريبتات  و كل ما يتصل به موقعك نافذة Resources هده النافذة تقوم باضهار موارد موقعك و أقصد بموارد هي الصور و السكريبتات و ال Stylesheets فعبر فتح ملف Frames يمكنك أن تشاهد الصور والسكريبتات و ال Stylesheets الخاصة بأي موقع أو مدونة  نافذة console  وهي وحدة تحكم المدونة أو الموقع يمكنك القاء أوامر للموقع أعطيك مثال على ذالك تلك الخدع التي تراها في الفيسبوك عن طريقة اختراق أي حساب أو فتح كامرا أي شخص ... فتلك الخدع تعمل بواسطة console وتلقي أوامر

كود Html تكبير الصورة بمرور الماوس عليها

السلام عليكم و رحمة الله وبراكته HTML اليوم أردت أن أقدم لكم اضافة لمدوناتكم و هي عبارة عن كود و هدا الكود يقوم بتكبير صورة بطريقة جميلة وبمجرد مرور الماوس عليها معاينة مرر الماوس على هده الصورة  تكبير الصورة بمرور الماوس عليها Htmlكود   تكبير الصورة بمرور الماوس عليها < image src = "رابط الصورة"  onmouseover = "this.height='300';this.width='300'"   onmouseout = "this.height='200';this.width='200'"  height = "200"  width = "200" > الكلمات الدلالية HTML الماوس صورة