إضافة 3 أعمدة في الأسفل مدونة بلوجر

عدد مشاهدات الموضوع:

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





محاذاة إلى اليمينانتقل إلى لوح تحكم مدونتك،إختر "تصميم" ،ثم "تحريرHTML " ثم ضع علامة في خانة توسيع قوالب عناصر واجهة المستخدم.
قم بالبحث عن الكود التالي بالإستعانة بلوحة التحكم (CTRL+F).

]]></b:skin>
ثم قم بلصق الكود التالي فوقه :
#footer-column-container {
clear:both;
}

.footer-column {
padding: 10px;
}
ثم قم بالبحث عن الكود التالي:
<div id='footer-wrapper'>
فإن لم تجده قم بالبحث عن كود يحتوي على كلمة footer-wrap, footer, footer-end أو ماشابهها .

ثم قم بإضافة الكود التالي بعده :

<div id='footer-column-container'>

<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>

<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>

<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>

<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>

<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>

<div style='clear:both;'/>

<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>

<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text2' locked='false' title='' type='Text'/>
</b:section>

</div>
<div style='clear:both;'/>

</div>



#footer-column-container {
clear:both;
}

.footer-column {
padding: 10px;
}

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


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

  1. اخي الكريم آسف جدا ولكني لم افهم الموضوع لأنك قلت لنا في الأول أن نلصق الكود الأول فوقه ولكن في الكود الثاني قبله هل فوقه يعني ان نلصقه قبله أم بعده ام نستبدله به

    ردحذف
  2. اخي الكريم أعتذر لسوء الفهم و الخلط بين كملة "قبله" و "فوقه" فلهما نفس المعنى ،يعني يجب لصق الكودين الاول و الثاني فوق الاكواد المذكورة ،ولقد تم تصحيح العبارة في الموضوع لاجتناب اي التباس آخر ،فارجو المعذرة وشكرا للتنبيه

    ردحذف
  3. مشكور اخي الكريم ابو اياد

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

    تحياتي
    مهند ناصر

    ردحذف
  4. غير معرف4:04 م

    للاسف فشلت التجربة معايا
    المدونة الاولى لم اجد فيها كود div id='footerwrapper

    المدونة الثانية طبقت زى ما قلت لكن حدث خطأ

    ما اعرفش المشكلة فين مع انى طبقت زى ما قلت بالظبط

    ردحذف
  5. أزال المؤلف هذا التعليق.

    ردحذف
  6. بارك الله فيك أخي على الشرح . هذا ما كنت أبحث عنه

    ردحذف
  7. لا شكر على واجب أخي مبروك عليك

    ردحذف
  8. للأسف لم تنجح معي الطريقة
    لم أجد الكود div id='footerwrapper
    فنسخت الكود الثاني فوق /body فوجدت ثلاثة أعمدة و لكن فوق بعضها كما هذه الصورة

    http://a.imageshack.us/img36/1338/0002ei.jpg

    في انتظار الاجابة أخي

    ردحذف
  9. قم بالبحث عن هذا الكود بدلا من الآخر
    <div id='footer'>

    فان لم تجده قم بالبحث عن هذا الكود
    <b:section class='footer' id='footer'/>
    و قم باستبداله بالكود الثاني

    ردحذف
  10. للأسف أخي نفس المشكلة
    معليش لا أتعبك معي سأبحث عن قالب آخر فيه هذه الاضافة
    و بارك الله فيك على الردود

    ردحذف
  11. غير معرف5:32 م

    الاكواد غير صحيحة يرجى التاكد منها

    ردحذف
  12. تم تصحيح الأكواد ،والإضافة الآن تعلم 100% شكرا جزيلا للتنبيه

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

    ردحذف
  14. لأخي لم أوفق في ذلك مع أني أعدت العملية مرات متتالية.
    على العموم شكرا لمجهودك.

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

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

    دمت بحفظ الرحمن

    ردحذف
  16. @ريحانة الإسلام
    السلام عليكم ربما قمت بلصق الكود في المكان الغير المناسب

    ردحذف
  17. @أبو إياد

    و عليكم السلام و رحمة الله
    ربما..لأنني لم أجد الكود الذي ذكرته،
    هل لك أن تساعدني؟

    ردحذف
  18. @ريحانة الإسلام
    أرسلي إلي نسخة من قالب مدونتك على بريدي الإلكتروني للمعاينة وسوف أجيبك غدا إنشاء الله
    E-mail:camelion20051@hotmail.com

    ردحذف
  19. منه الله المصريه8:04 م

    ااخى الف شكر اضافه رائعه جدا

    تقبل تحياتى

    ردحذف
  20. @ريحانة الإسلام
    السلام عليكم أختي ،لقد تم حل مشكلة ،وتم إرسال قالب مدونتك عبر البريد

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

    فانا لم اجد الكود في الخطوة الثانية وبحث عن فوتر ووضعت الكود ولكنه لم ينجح

    انظر مدونتي :
    http://w-learn.blogspot.com/

    واحتاج منك مساعدات ونصائح اخرى اذا أمكن

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

    ردحذف
  23. اخي يظهر خطا عند حفظ القالب

    ردحذف
  24. حوووووووت يا ابو اياد

    زبطت الحمد لله

    ردحذف
  25. بالنسبة للكود الثاني

    ابحث عن هذا الكود

    div id='footer-wrap1

    ثم اضف الكود الثاني بعده

    ودمتم طيبين

    ردحذف
  26. لو تكرمت اخي الفاضل كيف اضافتة هذة الخاصية في الهيدر اي في الجزء العلوي من الصفحة بدل الفوتر..
    شكرا لك

    ردحذف
  27. غير معرف7:19 م

    مشكور اخي لكن ظهرت العبارة
    #footer-column-container { clear:both; } .footer-column { padding: 10px; }
    في المدونة ممكن

    تعدل على الكود

    ردحذف
  28. غير معرف8:46 م

    جزاك الله كل خير

    ردحذف
  29. اخي غير معروف مشاركة رقم 27

    ابحث عن هذا الكود

    #footer-column-container { clear:both; } .footer-column { padding: 10px; }
    في المحرر وقم بحذفه

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

    ردحذف
  31. غير معرف9:59 م

    مش راضيه تنفع معي و لا طريقه footer تطلع لي 28 مره وجربت كلهم

    الرحاء احد يساعدني

    ردحذف
  32. غير معرف10:43 م

    شكرا لك كثير
    استفدت من مدونتك
    جزاك الله خير

    ردحذف
  33. نجت الطريقة يااخي ولكنني قمت بلبحث عن هذا الكود <div id='footer
    ولم اقوم بحذفه بل لصقت الكود الثاني امامه ونجحت كليا وشكرا

    ردحذف
  34. بارك الله بك ... وجعله في ميزان حسناتك ...

    http://leave1name.blogspot.com

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

    ردحذف
  36. أزال المؤلف هذا التعليق.

    ردحذف
  37. السلام عليكم ورحمة الله وبركاته .
    مدونتك رائعة .أخي ابو اياد واتمني لك التوفيق ،
    لكن هذه الإكواد جربتها كثيراً فلم تصلح معي مع أني نفذت بالحرف الواحد ،وأري ان هذه الأكواد بها خطأ !
    أرجوا مراجعة الأكواد
    والسلام عليكم ورحمة الله وبركاته .

    ردحذف
  38. بارك الله فيك

    ردحذف
  39. السلام عليكم ممكن اعرف طريقة عشاان اقدر اضيف ادااه على الجانب ؟؟؟؟

    ردحذف
  40. غير معرف10:51 ص

    مشكور دائما يا ابو اياد ..دائما متالق

    ردحذف
  41. جزاك الله خيراُ

    ردحذف
  42. اضافة رائعة شكرا لك

    ردحذف
  43. ياخوي سويت نفس الشرح وسويت حفظ وطلع لي كذا

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

    ايش الحل رجاء رد بسرعه!

    ردحذف
  44. انا اريد تغيير لون الفوتر
    اعمل ايه

    ردحذف
  45. السلام اخي ابو اياد شكرا على هذه المجهودات القيمة,اريد مساعدة اذا كانت ممكنة.عندي مذونة http://hamzaa86.blogspot.com/ واريد ان الصق برنامج من نوع باور بوانت في صفحة ثابثة فهل هذا ممكن واذا امكن كيف ذلك وشكرا جزيلا.

    ردحذف
  46. في البداية مازبطت معايا
    بس بعدين بحثت عن footer وبعد اخر واحد حطيت الكود وزبط معايا
    ثاااااااااانكس

    ردحذف
  47. أعتقد بأنك أخي كررت هذا الكود في الأسفل:

    #footer-column-container {
    clear:both;
    }

    .footer-column {
    padding: 10px;
    }

    ويظهر على الصفحة كخطأ برمجي ، تحياتي لك أخ إياد "عاجبني فوووور"

    ردحذف
  48. بارك الله فيك اخي الطيب علي مجهود الكبير لتواصل وتقديم كل ما هو مفيد
    جزاك الله خيرا

    ردحذف
  49. @أبو إياد

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

    هل يمكنك ان تساعدني ؟
    مدونتي : مدونة علوم الحياة
    http://3olomlife.blogspot.com/

    ردحذف
  50. asalammo 3alaykom momkin ya akhi inaak tssa3edni fi taghyir chakl wa madhar modawanati blogger www.alta3alom.blogspot.com
    ida bidak tssa3éédni ya akhi hada fisboki dw abdelghni
    aw arssil ressala ila modawanati

    ردحذف
  51. جزااااااااك الله عالي الجنان يارب

    ردحذف
  52. أخي أريد مثله و لكن في الأعلي و ليس في الأسفل و شكرا و أتمني أ تتشرف بزيارتي و إخباري برأيك في المدونة :-
    www.islameyate4islam.blogspot.com

    ردحذف
  53. باركـ الله فيكـ و أكثر من إبداعاتكـ

    ردحذف
  54. سلتم عليك
    ممكن طلب ابو اياد
    في اسفل مدونتك يوجد ارقام من 1 الى 16 لمن اضغط على 1 انتقل لصفحة جديدة اضغط 2 انتقل لصفحة جديد وهكذا لحد اخير ... ممكن موضوع منك تعليمي كيف اعمل لمدونتي هكذ
    جواب اخي العزيز ......

    ردحذف
  55. سلتم عليك
    ممكن طلب ابو اياد
    في اسفل مدونتك يوجد ارقام من 1 الى 16 لمن اضغط على 1 انتقل لصفحة جديدة اضغط 2 انتقل لصفحة جديد وهكذا لحد اخير ... ممكن موضوع منك تعليمي كيف اعمل لمدونتي هكذ
    جواب اخي العزيز ......

    ردحذف
  56. شكرا لك اخ ابو اياد على الموضوع المميز


    لدي مشكلة وارجو حلها واعتذر اني قد طرحتها في مكان غير مناسب
    انا استعمل قالب بلوجر الخاص بمدونتك واليوم واجهتني مشكلة هي انتشار مثلثات في كل المدونة كما في الصورة
    http://lh6.ggpht.com/_4_wf1DKMvX4/TMWm472NmPI/AAAAAAAABmw/aioU52gp7Zw/box-bgr.gif

    وحتى احل المشكلة حررت قالب المدونة وبحثت عن كل صورة تخص هاذا الموقع ggpht.com وحذفتها لانه يبدو ان الموقع قد تعطل وجميع الصور التي رفعت عليه لم تعد تعمل

    الان حللت المشكلة ولكنني اخشى ان يؤثر قيامي بحذف الصور الى أضرار اخرى

    ارجو ان تقول لي ان كان هذا سيؤثر على المدونة

    اتمنى ان تجبني بأسرق وقت على هذا الحساب almalawany@facebook.com

    ردحذف
  57. و الله أنا معجب كبييييييييير بك

    ردحذف
  58. هناك خطأ في الكود الكود الخاض ب السكين مكرر

    ردحذف
  59. الكلمة المراد البحث عنها في الرابط الثاني هي " footer-wrapper "

    تحياتي لك

    ردحذف
  60. اشكرك استاذاي الفاضل

    لقد نجحت معي بالفعل

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

    ردحذف
  62. أخي الاكواد متلخبطة حاول تنسقها لأن كود css داخل علي الكود التاني

    ردحذف
  63. السلام عليكم
    أخي هذاه الاكواد لاتوجدعندي ماهي المشكلة
    وأرجو الرد في أسرع وقت ممكن

    ردحذف
    الردود
    1. عليكم السلام
      أى اكواد لم تجدها بقالبك
      يرجى التوضيح

      حذف
  64. السلام عليكم
    الكود الثاني
    وهذه الكلمات : footer-wrap, footer, footer-end

    ردحذف
  65. شكرا لك على الموضوع الرائع اتمنى زيارتي هنا :
    مدونة معراج

    ردحذف
  66. تسلم يا بشمهندس محمد

    ردحذف
  67. شكرا لك لقد تعب كثيرا حتى وجدت الكود الثاني والذي هو
    footer-wrapper

    ردحذف

مدونة أبو إياد تصميم بلوجرام جميع الحقوق محفوظة 2016

اعلان مخفى فى الرئيسية