اذهب الي المحتوي
منتديات ياللا يا شباب
mr_design

الدرس الثالث طريقة تصميم ستايل IP.Borad 3

Recommended Posts

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

 

الدرس الثالث طريقة تصميم ستايل IP.Borad 3

 

نبدأ بأذن الله سلسلة دروس تصميم الاستايل

 

--------------------------------------------------------------------------

 

الدرس الثامن :-

 

 

هو كيفية تغير خلفية عناوين بينات العضو الموجودة فى الموضوع ( post_block h3 )

 

الموجود بها اسم العضو ورقم المشاركة # والاى بى الذى يظهر للادارة العامة :rolleyes:

 

نقوم بالبحث عن :-

 

}  .post_block h3 { background: #d5dee5; }

 

حيث الشكل التالى يقوم بتوضيح الآمر اكثر :blink:

 

قبل التعديل

 

post1.jpg

 

نقوم بتغير d5dee5 الى اللون الذى نريدة مثلا C76114

 

ليتعدل شكل الكود السابق الى شكل الكود التالى

 

}  .post_block h3 { background: #C76114; }

 

بعد التعديل

 

post2.jpg

 

اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة

 

فعليك إستبدال :-

 

 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:

 

قبل التعديل

 

Post%20background1.jpg

 

نقوم بتغير fafbfc الى اللون الذى نريدة مثلا CDB79E

 

ليتعدل شكل الكود السابق الى شكل الكود التالى

 

/* Post background */ .post_block { background: #CDB79E;

 

بعد التعديل

 

Post%20background2.jpg

 

اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة

 

فعليك إستبدال :-

 

 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:

 

قبل التعديل

 

ul.post_controls1.jpg

 

نقوم بتغير e4ebf3 الى اللون الذى نريدة مثلا CDAF95

 

ليتعدل شكل الكود السابق الى شكل الكود التالى

 

 

ul.post_controls { background-color: #CDAF95;

 

بعد التعديل

 

ul.post_controls2.jpg

 

اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة

 

فعليك إستبدال :-

 

 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:

 

قبل التعديل

 

submit%20bar1.jpg

 

نقوم بتغير e4ebf2 الى اللون الذى نريدة مثلا C76114

 

ليتعدل شكل الكود السابق الى شكل الكود التالى

 

	#ipboard_body .ips_editor .toolbar {		height: 30px;		background: #C76114 url({style_images_url}/gradient_bg.png) 

 

بعد التعديل

 

submit%20bar2.jpg

 

اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة

 

فعليك إستبدال :-

 

 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:

 

قبل التعديل

 

fastreblay1.jpg

 

نقوم بتغير d5dde5 الى اللون الذى نريدة مثلا C76114

 

ليتعدل شكل الكود السابق الى شكل الكود التالى

 

body#ipboard_body fieldset.submit, body#ipboard_body p.submit { background-color: #C76114;

 

بعد التعديل

 

fastreblay2.jpg

 

اما إذا ارت تغير الخلفية الخاصة بهذا القسم الى صورة

 

فعليك إستبدال :-

 

 background: #درجة اللون;

 

بالكود التالى :-

 

background:  url(http://www.ipbcity.net/forums/public/style_images/orang/ipbcity.png) repeat-x 50%;

 

 

حيث ipbcity = اسم الصورة المختارة

 

حيث pin = صيغة الصورة حيث يمكن اختلافها كـــ Gif او Jepg

 

ثم اضغط على Save

 

وبهذا أعزائى الآعضاء نكون انتهينا من التعديل

 

--------------------------------------------------------------------------------

 

وبكدة يكون انتهى درسنا اليوم بخصوص ال3 اقسام الللى تم شرحهم

 

الى لقاء أخر باذن الله فى تكملة الدروس والكمال لله عز وجل

شارك هذه المشاركه


رابط المشاركه
شار ك علي موقع اخر

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.

زائر
اضف رد علي هذا الموضوع....

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.


×
×
  • اضف...

Important Information

By using this site, you agree to our Terms of Use, اتفاقيه الخصوصيه, قوانين الموقع, We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue..