تخصيص قسم الرأس في مدونة Blogger.com الخاصة بك

قد 1, 2024

في آخر برنامج تعليمي ، قمنا بتخصيص قسم الروابط في Blogger الخاص بك^TM مدونة. الآن ، سنقوم بتخصيص قسم الرأس في أعلى المدونة. يحتوي العنوان على عنوان مدونتك ووصفها. سنقوم بتغيير المحرف أو الخط للنص وإضافة خلفية ملونة.

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

@ ميديا جميع
@ الوسائط المحمولة
#عنوان المدونة
# عنوان المدونة
# blog-title a: hover
#وصف

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

media all {
#header {
لون الخلفية: # EFE3EF ؛
...
بعد ذلك ، سوف نقوم بتغيير محرف العنوان للخط الشعبي غير الرسمي والمسمى Comic Sans MS. بالطبع ، أنت حر في استخدام أي خط تريد. تتحكم الأجزاء الثلاثة التالية من شفرة CSS الخاصة بالقالب (# blog-title، # blog-title a، # blog-title a: hover) في خصائص عنوان المدونة. يتحكم الجزء الأول في الخصائص العامة بينما يتحكم الجزءان الآخران في مظهر النص عندما يعمل كارتباط تشعبي. لتعيين محرف العنوان ، أو الخط ، لجميع الحالات ، سنضيف كود CSS لعائلة الخط إلى الجزء الأول (# blog-title). نظرًا لأن اسم الخط الخاص بنا يحتوي على مسافات ، فسيحتاج أيضًا إلى وضعه داخل علامات اقتباس ("comic sans ms").

#عنوان المدونة {
font-family: "comic sans ms"؛
...
أخيرًا ، سنعمل على كود CSS لوصف مدونتك (#description). هذا هو الجزء الأخير من الستة الأصلي. كما ترون أدناه ، يتم سرد كل رمز CSS الذي يتحكم في خصائص الخط لنص الوصف معًا في سطر واحد. كل ما نحتاج إلى فعله هو إضافة "comic sans ms" في مقدمة قائمة الخطوط التي ستجعل Comic Sans MS الخط الافتراضي لنص الوصف.

#وصف {
...
الخط: 78٪ / 1.4em "بلا رسوم هزلية مللي"، "Trebuchet MS"، Trebuchet، Arial، Verdana، Sans-serif؛
...
}

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

لقطات شاشة أعيد طبعها بإذن من شركة Google Inc. Google^TM، المدون^TM و BlogSpot^TM هي إما علامات تجارية مسجلة أو علامات تجارية لشركة Google Inc. في الولايات المتحدة و / أو بلدان أخرى.

تعليمات الفيديو: كيف اعدل على اقسام مدونة بلوجر؟ تفادي جميع المشاكل (قد 2024).

تخصيص قسم الرأس في مدونة Blogger.com ، HTML ، وتغيير عنوان ووصف مدونة Blogger الخاصة بك ، وتغيير محرف قالب Blogger ، وإضافة خلفية ملونة إلى قالب Blogger ، وتغيير رمز CSS لقالب Blogger ، وإضافة رمز CSS إلى Templage الخاص بـ Blogger ، خط قالب Blogger ، قالب خط عائلة Blogger ، علامات نمط CSS

المقال السابق

المقالة القادمة

InDesign CS5 Mini Bridge

قد 2024

يمكن أن تساعد لوحة جديدة تسمى Mini Bridge سير عملك في InDesignR CS5. يمكنني استخدام InDesign لتخطيط كل إصدار من مجلة Mused ، مجلة CoffeBreakBlog الأدبية. كما تتوقع ، لا أقوم فقط باستيراد جميع الأعمال...

أجهزة الكمبيوتر

فاينل فانتسي العاشر تجول

قد 2024

اختر المستوى الذي تريد المساعدة به! ليس محاولة لقراءة المستقبل - أكثر من غيرها من متعة لعب الألعاب الاستراتيجية هو اكتشاف الألغاز لنفسك! أساسيات الحرب الخاطفة أساسيات عمل يمر اطلاق الرصاص HP -...