تصميم جديد من اضافة ثلاث اعمدة اسفل مدونة بلوجر بشكل جميل ومتناسق

فى احدى التدوينات من قسم دروس بلوجر وضعت لكم اضافة ثلاثة اعمدة اسفل مدونة بلوجر بدون اخطاء THREE COLUMN FOOTER .

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

الأضافة عبارة عن ثلاث اعمدة اسفل مدونة بلوجر تعمل بخاصية CSS وتعمل على جميع القوالب سواء كانت الافتراضية او المعدلة .

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

كيفية تركيب اضافة ثلاث اعمدة اسفل مدونة بلوجر 

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

]]></b:skin>

ضع هذا الكود التالى قبلة مباشرة :

#lower {
border-top: #737373 6px solid;
margin:auto;
font-family: Georgia;
width: 1000px;
padding: 0px 0px 10px 0px;
background:#1f1f1f;
}
#lower a {
color: #DBDBDB;
font-family: Georgia;
}
#lower-wrapper {
margin:auto;
font-family: Georgia;
padding: 20px 0px 20px 0px;
width: 960px;
}
#lowerbar-wrapper {
background:#1f1f1f;
float: left;
color: #ebedee;
font-family: Georgia;
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: left;
color:#fff;
text-transform:uppercase;
font: bold 16px Arial, Tahoma, Verdana;
border-bottom:3px solid #666666;
}
.lowerbar ul {
list-style:none;
margin: 0;
padding: 0;
}.lowerbar li a {
width: 265px;
font-family: Georgia;
background: #3f3f3f;
border: 1px solid #111;
line-height: 1.4em;
-moz-border-radius: 5px;
padding: 0.5em;
margin-bottom: 11px;
margin-right: 3px;
-webkit-border-radius: 5px;
overflow: hidden;
color:#000000;
}.lowerbar li a:visited {
width: 265px;
font-family: Georgia;
background: #3f3f3f;
border: 1px solid #111;
line-height: 1.4em;
-moz-border-radius: 5px;
padding: 0.5em;
margin-bottom: 11px;
margin-right: 3px;
-webkit-border-radius: 5px;
overflow: hidden;
color:#000000;
}.lowerbar li a:hover {
background: #4f4f4f;
border: 1px solid #7a7a7a;
line-height: 1.4em;
-moz-border-radius: 5px;
padding: 0.5em; -webkit-border-radius: 5px;
overflow: hidden;
color:#000000;
}.lowerbar a {
font-family: Georgia;
background: #3f3f3f;
border: 1px solid #111;
line-height: 1.4em;
float:left;
-moz-border-radius: 5px;
padding: 0.5em;
margin-right: 3px;
margin-bottom: 11px;
-webkit-border-radius: 5px;
overflow: hidden;
color:#000000;
}.lowerbar a:hover {
background: #4f4f4f;
border: 1px solid #7a7a7a;
line-height: 1.4em;
-moz-border-radius: 5px;
padding: 0.5em; -webkit-border-radius: 5px;
overflow: hidden;
color:#000000;
}

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

</body>

ضع بعدة مباشرة هذا الكود :

<div id='lowerbar-wrapper'>

<b:section class='lowerbar' id='lowerbar1' preferred='yes'/>

</div>

<div id='lowerbar-wrapper'>

<b:section class='lowerbar' id='lowerbar2' preferred='yes'/>

</div>

<div id='lowerbar-wrapper'>

<b:section class='lowerbar' id='lowerbar3' preferred='yes'/>

</div>

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

بالاخير اضغط على حفظ 

الان بأمكانك ان تقوم بأضافة اضافات بلوجر اسفل المدونة بكل سهولة . 

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

(( لا خير فى كاتم العلم ))