دروس تعريب قوالب بلوجر (2)

نواصل دروس تعريب قوالب بلوجر، بعد أن رأينا في الدرس الأول تعريب الجزء العلوي للقالب سنحاول اليوم تعريب القوائم. فكما ترون فالقوائم تتواجد في الجهة اليسرى وما سنقوم به هو جعلها على الجهة اليمنى.

قوائم بلوجر CSSعلى اليسار

لا تنسوا، تعريب قوالب بلوجر يتطلب معرفة ولو أولية بلغتي البرمجة HTML و CSS. ولا داعي للخوف كما قلت سابقا، لأن هاتين اللغتين سهلتي التعلم.

للقيام بذلك سنقوم بفتح أداة تغيير  القالب من واجهة المدونة ستنقرون قالب ثم تحرير HTML.
ثم من لوحة المفاتيح Ctrl+F ثم تبحثون عن .menus
ستجدون كود CSS الخاص بالقوائم يبدو بهذا الشكل:

.menus,.menus *{margin:0;padding:0;list-style:none;list-style-type:none;line-height:1.0}

.menus ul{position:absolute;top:-999em;width:100%}

.menus ul li{width:100%}

.menus li:hover{visibility:inherit}

.menus li{float:left;position:relative}

.menus a{display:block;position:relative}

.menus li:hover ul,.menus li.sfHover ul{left:0;top:100%;z-index:99}

.menus li:hover li ul,.menus li.sfHover li ul{top:-999em}

.menus li li:hover ul,.menus li li.sfHover ul{left:100%;top:0}

.menus li li:hover li ul,.menus li li.sfHover li ul{top:-999em}

.menus li li li:hover ul,.menus li li li.sfHover ul{left:100%;top:0}

.sf-shadow ul{padding:0 8px 9px 0;-moz-border-radius-bottomleft:17px;-moz-border-radius-topright:17px;-webkit-border-top-right-radius:17px;-webkit-border-bottom-left-radius:17px}

.menus .sf-shadow ul.sf-shadow-off{background:transparent}

.menu-primary-container{padding:0;position:relative;height:38px;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjWNkJMxE8zKwyxaHuQg1bZ7Vluui5rCOtCdNAZlk8PQQsDOKpLMHcpWFpC_QAg6GDCib01z8zQoKSAEaiUccfNSxvhSgDNkAnWQ1bGPmJOg_r1eXPLFzoJijP7eiTeaNlRdsut-PIvjFg/s0/menu-primary-bg.png) left top repeat-x;z-index:400;margin-bottom:10px}

.menu-primary{}

.menu-primary ul{min-width:160px}

.menu-primary li a{color:#FFF;padding:11px 15px 12px 15px;text-decoration:none;text-transform:uppercase;font:normal 13px/13px 'Oswald',sans-serif;margin:0 3px 0 0}

وما ستقومون به هو تعويض كافة كلمات Left بالأحمر بكلمة right

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

القوائم اصبحت على اليمبن

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

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