كيفية التحكم وتغيير هيدر المدونة

14
تحت تسمية: اضافة هيدر المدونة,التحكم في الهيدر,هيدر مدونة بلوجر,تصميم اللوجو,شعار المدونة,تركيب هيدر المدونة


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

سأقوم بشرح كيفية تغيير هيدر المدونة والتي يسميها البعض Logo المدونة :

هناك خطوتان لتغيير وتركيب الهيدر اما عن طريق لوحة التحكم بلوقر او عن طريق تحرير القالب واضافة كود الهيدر .

·        تركيب هيدر المدونة عن طريق لوحة تحكم البلوقر
ادهب الى لوحة تحكم مدونتك|| تصميم || تحرير عناصر الصفحة

 ادهب الى تصميم || في اعلى الصفحة اظغط على تحرير|| رأس الصفحة|| ستظهر نافدة  مع عدة خيارات.
الخيار الاول :

يمكنك رفع صورة الهيدر من جهازك

 الخيار الثاني:

 وضع رابط لصورة الهيدر ان كنت رفعته من قبل على احد مواقع الرفع الصور.

يلزمك الان وضع علامة صح على الخيارات التالية :

·        اما ان تكون الصورة فوق عنوان المدونة
·        او تكون صورة الهيدر تحت العنوان والوصف
 وانا انصحك بالخيار الاول لكي لايؤثر دلك على مظهر تناسق الهيدر مع العنوان والوصف
في الأخير اضغط على حفظ .

·        تركيب الهيدر عن طريق تحرير Html
ابحث عن الكود التالي:

#header-wrapper {
هدا نمودج لكود الهيدر:

background: url(http://yourblog.com/image.png) ;

و استبدل وصلة الصورة بمكان الصورة التي صممتها.
ان قمنا بتركيب هيدر المدونة في بعض الاحيان تكون الصورة صغيرة ,لدا يتوجب علينا اضافة خلفية للهيدر  ودلك عن طريق الكود التالي:
background: #000000 url(http://www.site.com/image.png) no-repeat top right;

حيث تمثل الرموز التالية في الكود اعلاه ما يلي:

#000000 لون خلفية الهيدر
http://www.site.com/image.jpeg رابط صورة الهيدر
no-repeat لعدم تكرار الصورة في الهيدر
top right لتحديد مكان الصورة يمين او يسار 
وفي الاخر يمكنك  || حفظ القالب ||

هدا درس بسيط اتمنى ان يعجبك اخي الكريم لمتابعة مثل هده المواضيع قم بالتسجيل في قائمتنا البريدية لتكون السباق ليصلك الجديد والمفيد الى بريدك الالكتروني .

المصدر



التعليقات

  1. جربتها اخي لكنها لم تعمل لم تستبدل الصورة
    هده مدونتي إطلع عليها فانا مصمم محترف لاكن تغيير الهيدر لم يعمل
    http://letsgo2digital.blogspot.com/

    ردحذف
  2. جميل جدا اخى تسلم ..
    http://learn-price-action.blogspot.com

    ردحذف
  3. أنا لدي هذا التصميم http://tekafa.blogspot.com/ ولا اعرف لماذا لا يعمل معي شعار المدونة

    ردحذف
    الردود
    1. السلام عليكم اخي عبد الله
      هناك بعض القوالب لاتقبل رفع الشعار من لوحة تحكم مدونتك
      ولكن من خلال تحرير القالب ويجب الاستعانة بالاكود التي تم دكره في الموضوع
      يمكنك ان ترسل القالب لي وسأحول ان اضيف الشعار :)

      حذف
  4. شكرا لك اخي على تجاوبك سوف اغير القالب و اذا وجدت اي مشكلة سوف اقوم بارساله لك . وبالمناسبة اعجبتني ابداعاتك في تصميم الشعارات ولدي سؤال: هل تقوم برسم الشعارات على الورق قبل البدء في تصميمها ام لا

    ردحذف
  5. هدا واجب .بخصوص سؤالك ففي كثير من الاحيان لا استعين فقط
    بالأفكار التدي تدور في ذهني .والحمد لله

    ردحذف
  6. السلام عليكم و رحمة الله

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

    جزاك الله خيرا و وفقك لما يرضاه

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

    تصميم مواقع الانترنت

    ردحذف
  8. جميل جدا
    http://04computer.blogspot.com/

    ردحذف
  9. أخى فى الله لقدأحببت هذا القالب ولكن يلزمه بعض التعديلات هل يمكن مسعدتى
    1- عوز أغير رئس المدونه وإضافة هيدرلها
    2- تعديل رسائل المدونه حيث تأتى فى الجانب وليس فى المنتصف
    http://www.ragab.tk/
    وهذه حسابى على الفيس بوك
    https://www.facebook.com/ma7moudragabeg
    أرجومراسلتى

    ردحذف
  10. تسلم اخي جاري التجربه
    http://msmmun.blogspot.com/

    ردحذف
  11. مدونتك رائعة اخي اتمني لك مزيد من النجاح والنقدم
    تفضل بزيارة مدونتي ملك التقنيات واتمني لو تعدل لي القالب لاني جديد في بلوجر ولااعرف الكثير حول تعديل القالب اجتهدت وعدلت ولكن مازال القالب لايعجبني وغير جيد هذا رابط مدونتي http://yousifmalik.blogspot.com

    ردحذف
  12. موضوع جممييل
    --------------------
    موقع يحتوي على حجز شركات الطيران والفنادق والسيارات وشركات الحجوزات المتواجدة في الموقع تقوم يعمل تخفيضات لكل من يقوم بالحجز من خلال الموقع وجاري التواصل مع شركات اخرى لزيادة نسبة الشركات في الموقع وتسهيل للجميع في سرعة الحجز باسعار مخفضة ومنافسة

    الموقع Mazaj Travels تابع الى رحلات مزاج وموقع رحلات مزاج يقوم بتنسيق رحلات السفر والسياحة في جميع انحاء العالم

    موقع Mazaj Travels هو تم عمل موقع تابع لرحلات مزاج والموقع يختص في جميع حجوزات الطيران والفنادق والسيارات باسعار منافسة والموقع يحتوي على شركات متعددة التي تقوم في حجز الطيران والفنادق والسيارات والمهم في نتيجة عمل الموقع بانه يحتوي على جمع من شركات الطيران والفنادق وجميع انواع السياحة باسعار خاصة لجميع زوار الموقع ومن يقوم بالحجز من خلال الموقع التالي http://www.mazajtravels.com

    رابط تحمل التطبيق للآيفون
    https://itunes.apple.com/us/app/mazaj-travels/id1097556585?ls=1&mt=8

    للاندرويد
    https://play.google.com/store/apps/details?id=travel.cheap&hl=en

    ردحذف

أكتب تعليقك هنا وشاركنا برأيك .