بسم الله الرحمن الرحيم
الدرس الثالث طريقة تصميم ستايل IP.Borad 3
نبدأ بأذن الله سلسلة دروس تصميم الاستايل
--------------------------------------------------------------------------
الدرس الثامن :-
هو كيفية تغير خلفية عناوين بينات العضو الموجودة فى الموضوع ( post_block h3 )
الموجود بها اسم العضو ورقم المشاركة # والاى بى الذى يظهر للادارة العامة :rolleyes:
نقوم بالبحث عن :-
كود:
}
.post_block h3 {
background: #d5dee5;
}
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:
قبل التعديل
نقوم بتغير d5dee5 الى اللون الذى نريدة مثلا C76114
ليتعدل شكل الكود السابق الى شكل الكود التالى
كود:
}
.post_block h3 {
background: #C76114;
}
بعد التعديل
اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة
فعليك إستبدال :-
كود:
background: #درجة اللون;
بالكود التالى :-
كود:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;
حيث ipbcity = اسم الصورة المختارة
حيث pin = صيغة الصورة حيث يمكن اختلافها كـــ Gif او Jepg
ثم اضغط على Save
--------------------------------------------------------------------------
الدرس التاسع :-
هو كيفية تغير خلفية المواضيع التى تمت كتابتها وتسمى ( Post background )
نقوم بالبحث عن :-
كود:
/* Post background */
.post_block {
background: #fafbfc;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:
قبل التعديل
نقوم بتغير fafbfc الى اللون الذى نريدة مثلا CDB79E
ليتعدل شكل الكود السابق الى شكل الكود التالى
كود:
/* Post background */
.post_block {
background: #CDB79E;
بعد التعديل
اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة
فعليك إستبدال :-
كود:
background: #درجة اللون;
بالكود التالى :-
كود:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;
حيث ipbcity = اسم الصورة المختارة
حيث pin = صيغة الصورة حيث يمكن اختلافها كـــ Gif او Jepg
ثم اضغط على Save
--------------------------------------------------------------------------
الدرس العاشر :-
هو كيفية تغير خلفية المشريط الموجود بة خيارت الموضوع من تعديل واقتباس الخ
وتسمى ( ul.post_controls )
نقوم بالبحث عن :-
كود:
ul.post_controls {
background-color: #e4ebf3;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:
قبل التعديل
نقوم بتغير e4ebf3 الى اللون الذى نريدة مثلا CDAF95
ليتعدل شكل الكود السابق الى شكل الكود التالى
كود:
ul.post_controls {
background-color: #CDAF95;
بعد التعديل
اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة
فعليك إستبدال :-
كود:
background: #درجة اللون;
بالكود التالى :-
كود:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;
حيث ipbcity = اسم الصورة المختارة
حيث pin = صيغة الصورة حيث يمكن اختلافها كـــ Gif او Jepg
ثم اضغط على Save
--------------------------------------------------------------------------
الدرس الحادى عشر :-
هو كيفية تغير خلفية صندوق ادوات الرد السريع وتسمى ( Fast reply )
كود:
سنقوم بالعمل على ملف ipb_editor.css
نقوم بالبحث عن :-
#ipboard_body .ips_editor .toolbar {
height: 30px;
background: #e4ebf2 url({style_images_url}/gradient_bg.png)
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:
قبل التعديل
نقوم بتغير e4ebf2 الى اللون الذى نريدة مثلا C76114
ليتعدل شكل الكود السابق الى شكل الكود التالى
كود:
#ipboard_body .ips_editor .toolbar {
height: 30px;
background: #C76114 url({style_images_url}/gradient_bg.png)
بعد التعديل
اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة
فعليك إستبدال :-
كود:
background: #درجة اللون;
بالكود التالى :-
كود:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;
حيث ipbcity = اسم الصورة المختارة
حيث pin = صيغة الصورة حيث يمكن اختلافها كـــ Gif او Jepg
ثم اضغط على Save
--------------------------------------------------------------------------
الدرس الآثنى عشر :-
هو كيفية تغير خلفية صندوق ادوات الرد السريع وتسمى ( Fast reply )
الموجود بها مشاركة والمحرر الكامل
كود:
هنرجع تانى لـــ ipb_styles.css
نقوم بالبحث عن :-
كود:
body#ipboard_body fieldset.submit,
body#ipboard_body p.submit {
background-color: #d5dde5;
حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:
قبل التعديل
نقوم بتغير d5dde5 الى اللون الذى نريدة مثلا C76114
ليتعدل شكل الكود السابق الى شكل الكود التالى
كود:
body#ipboard_body fieldset.submit,
body#ipboard_body p.submit {
background-color: #C76114;
بعد التعديل
اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة
فعليك إستبدال :-
كود:
background: #درجة اللون;
بالكود التالى :-
كود:
background: url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;
حيث ipbcity = اسم الصورة المختارة
حيث pin = صيغة الصورة حيث يمكن اختلافها كـــ Gif او Jepg
ثم اضغط على Save
وبهذا أعزائى الآعضاء نكون انتهينا من التعديل
--------------------------------------------------------------------------------
وبكدة يكون انتهى درسنا اليوم بخصوص ال3 اقسام الللى تم شرحهم
الى لقاء أخر باذن الله فى تكملة الدروس والكمال لله عز وجل