شرح تغيير اماكن القائمة الجانبية Sidebar من الجهة اليسرى او اليمنة

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

صورة توضح مكان Sidebar فهو بالجهة اليمنة فأنا اريدها بالجهة اليسرى :

شرح تغير Sidebar من الجهة اليمنة الى اليسرى والعكس :

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

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

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

#main-wrapper { 

سنجد باسفلة بعض الأكواد وبالأخص هذا الأمر float فهذا الأمر هو المسؤل عن ذلك بجعل القائمة الجانبية يمينا او يسارا كل ما نفعلة بأن نضع امر التحديد اذا كنت تريد ان تجعل القائمة الجانبية بالجهة اليسرى فنضع امر التحديد left اما اذا نريد ان نجعل القائمة الجانبية بالجهة اليمنة فنضع امر التحديد  right اعتقد بأنها ليست معقدة ولكن كيف ان نضع هذه الأوامر؟

مثال توضيحى لتتعرف على طريقة التركيب او التغيير :

من خلال بحثك عن الكود السابق وهو #main-wrapper { سنجد مثلا الأكواد الخاصة بة على النحو التالى فهو يختلف من قالب الى اخر :

#sidebar-wrapper {

float: right;

width: 620px;

margin: 0;

padding: 0 20px 10px;

overflow: hidden; /* fix for long non-text content breaking IE sidebar float */

}

كما تلاحظ بالكود السابق ستجد امر التحديد  right المحدد باللون الاصفر بجانب امر المسؤل float فأمر التحديد right هو الذى سنقوم بتغيرة كما ذكرنا بالسابق اذا كنت تريد ان تجعل القائمة الجانبية بالجهة اليمنة فنضع كلمة right وبالجهة اليسرى كلمة left فالتغيرات من خلال هذه الكلمات فقط امر التحديد فلا تقوم بتغيير اى رموز كالنقاط او الفواصل وغيرها فالتغيير من خلال الكلمة فقط .

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