الأربعاء، 30 مارس 2011

هاك إضافة 3 أعمدة في الفوتر لمدونات بلوجر Blogger

بسم الله الرحمن الرحيم

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

ملحوظة هامة : لا تنس بأخذ نسخة أحتياطية من قالبك

  •  ادخل الى لوحة تحكم مدونتك ثم الى التصميم ثم تحرير ال html ثم قم بتوسيع القالب .
قم بالبحث عن هذا الكود
</body>
ثم أضف هذا الكود بعده مباشرة 
<div id='lower'>
<div id='lower-wrapper'>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar1' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar2' preferred='yes'>
</b:section>
</div>
<div id='lowerbar-wrapper'>
<b:section class='lowerbar' id='lowerbar3' preferred='yes'>
</b:section>
</div>
<div style='clear: both;'/>
</div> </div>
ثم ابحث عن ]]></b:skin>
 ثم أضف هذا الكود قبل الكود السابق مباشرة
/* -----   LOWER SECTION   ----- */
#lower {
       margin:auto;
       padding: 0px 0px 10px 0px;
       width: 100%;
       background:#dde9f3;
}
#lower-wrapper {
       margin:auto;
       padding: 20px 0px 20px 0px;
       width: 960px;

}

#lowerbar-wrapper {
     border:1px solid #DEDEDE;
       background:#fff;
       float: right;
       margin: 0px 5px auto;
       padding-bottom: 20px;
       width: 32%;
       text-align: justify;
       font-size:100%;
       line-height: 1.6em;
       word-wrap: break-word;
       overflow: hidden;
}

       .lowerbar {margin: 0; padding: 0;}
       .lowerbar .widget {margin: 0; padding: 10px 20px 0px 20px;}

.lowerbar h2 {
      margin: 0px 0px 10px 0px;
       padding: 3px 0px 3px 0px;
       text-align: right;
       color:#0084ce;
        text-transform:uppercase;
      font: bold 13px Tahoma, Verdana;
       border-bottom:3px solid #0084ce;
}

.lowerbar ul {
      margin: 0px 0px 0px 0px;
      padding: 0px 0px 0px 0px;
      list-style-type: none;
}

.lowerbar li {
      margin: 0px 0px 2px 0px;
      padding: 0px 0px 1px 0px;
      border-bottom: 1px dotted #ccc;
}

ثم بعد ذلك قم بحفظ القالب وادخل الى عناصر الصفحة .. ستجد الإضافة كما بالشكل إن شاء الله

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

هناك 13 تعليقًا:

  1. اهلا اخ باسم الاضافة جد رائعة سبق ورايتها باحدى مواقع الاجنبية
    تستحق الاعجاب بها فقط نسيت شرح في الاخير كيفية تغير العنوانين الزرقاء وكدا الخلفية البيضا من خلال كود css حتى يعرف باقي الزوار كافة تنسيقها مع مدوناتهم

    ردحذف
  2. ايه الحلاوة دى ممتز

    ردحذف
  3. @ كريم قدوري : مرحبا بك أخي كريم , ضيق الوقت هو ما يمنعني من الشرح بالتفصيل ..

    ردحذف
  4. @ mohmad : مرحب بيك يا أبو حميد ..

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

    بارك الله فيك أخي الحبيب باسم .. وأثابك على جهودك في خدمة أخوانك ..

    بعد إذنك عندي مشكلة في التجربة ..

    طبقت كل الخطوات بدقة ، لكن النتيجة طلعت إن الأعمدة تحت بعض ، وليس بجوار بعض بالعرض كما هو مفترض ..

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

    ردحذف
  6. @ عمر : بص يا عمر باشا , حضرتك لو أضف أول عمود , وثاني عمود , وثالث عمود, من التخطيط , وضغط حفظ , ستجد عن معاينتك للقالب انهم ليسوا تحت بعض , ولكنهم متجاورين , جرب كده , ولو فيه اي مشاكل , لا تتردد في وضع استفسارك ..

    ردحذف
  7. السلام عليكم ..

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

    جزاك الله خيرًا ونفع بك ..

    ردحذف
  8. @ عمر : تحت أمرك أخي الغالي عمر .. نورت المدونة ..

    ردحذف
  9. ِشكراً يا باسم بس التجربة منجحتش برده لدرجة انى غيرت جميع اكواد #333333 ل #ffffff كلمنى على الفيس بوك اديلك اميل حسابى ادخل جربها بنفسك

    ردحذف
  10. معلش يا باسم انا غلطت وكتبت تعليق على الموضوع ده بالغلط
    انا كنت اقصد تعليقات الفيس بوك ال بتظهر اسفل المواضيع

    مش عارف انا كتبت تعليق فى الموضوع ده ازاى

    ردحذف
  11. @ Ahmed Nassar : هههههه , ولا يهمك يا برنس , المدونة كلها تحت أمرك يا معلم , أوكي حاضر ..

    ردحذف
  12. والله يا باسم انا ما عارف اقولك ايه
    شكرا جزيلا يا معلم
    وربنا يوفقك

    ردحذف
  13. @ Ahmed Nassar : الله يكرمك يا ريس , وبعدين شكر ايه يا راجل عيب , دا انت صاحبي ..

    ردحذف