إضافة ثلاثة أعمدة في الفوتر لمدونة بلوجر blogger

إضافة ثلاثة أعمدة في الفوتر لمدونة بلوجر blogger

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

والصلاة والسلام على خير خلق الله سيدنا محمد عليه أفضل الصلاة واتم التسليم

السلام عليكم ورحمة الله وبركاته.

إضافة ثلاثة أعمدة في الفوتر لمدونة بلوجر blogger

لا يخلوا قالب من فوتر , واغلب القوالب بها فوتر ذو ثلاث اعمدة , والفوتر لمن لا يعرفه هو تذليل الصفحة , انزل لاي موقع ستجد ان بآخر الموقع بالاسفل فوتر .

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

طريقة التركيب :

• ادخل مدونتك.
• القالب .
• ابحث عن </body>
• الصق هذا الكود قبله : 

<div id='ll-7lolblogger'>
<div id='ol-7lolblogger'>
<div id='jn-7lolblogger'>
<b:section class='pl-7lolblogger' id='qn-7lolblogger1' preferred='yes'>
</b:section>
</div>
<div id='jn-7lolblogger'>
<b:section class='pl-7lolblogger' id='qn-7lolblogger2' preferred='yes'>
</b:section>
</div>
<div id='jn-7lolblogger'>
<b:section class='pl-7lolblogger' id='qn-7lolblogger3' preferred='yes'>
</b:section>
</div>
<div style='clear: both;'/>
</div> </div>

الان ابحث عن ]]></b:skin> وضع هذا الكود فوقها :

/* -----   three column footer   ----- */
#ll-7lolblogger {
       margin:auto;
       padding: 0px 0px 10px 0px;
       width: 100%;
       background:#F5F5F5;
}
#ol-7lolblogger {
       margin:auto;
       padding: 20px 0px 20px 0px;
       width: 960px;
}
#jn-7lolblogger {
     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;
}
       .pl-7lolblogger {margin: 0; padding: 0;}
       .pl-7lolblogger .widget {margin: 0; padding: 10px 20px 0px 20px;}
.pl-7lolblogger 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;
}
.pl-7lolblogger ul {
      margin: 0px 0px 0px 0px;
      padding: 0px 0px 0px 0px;
      list-style-type: none;
}
.pl-7lolblogger li {
      margin: 0px 0px 2px 0px;
      padding: 0px 0px 1px 0px;
      border-bottom: 1px dotted #ccc;
}

الاخضر : هو لتخصيص خلفية الادوات وقد حددت لك كود الخلفية .

الاصفر : هو الصندوق الذي يحمل هذه الثلاث الصناديق وتستطيع تغير حجمه من خلال 960px.

الازرق : هو الصناديق الثلاث.

الاحمر : عنوان الصناديق h2 .