کادر برای قالب

[محمدرضا بهارلو]

به نام دادار هستی بخش مهر آفرین
سلام به همگی دوستان عزیز
امروز قالبی نصب کردم که خیلی دنبالش بودم
ولی یه مشکلی هست
اینکه ماژول ها و مطالب انگار با هم قاطی شده اند
میخوام کادری دور مطالب و ماژول هام قرار بدم
دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

میخوام مثل تصویر زیر بشه
   

ممنون
منتظرم

[ehsansabet]

سلام!

کدهای زیر رو به css قالب اضافه کن.

کد: (انتخاب همه)

table.blog {
border:1px solid red;
}

#s5_rightcolumn .s5_whitemodleftwrap .s5_whitemodrightwrap .s5_backmiddlemiddle_r {border:1px solid red;}

#s5_breadcrumbs {
border:1px solid red;
}

[صدرا حسابی]

* در تمامی موارد در border ضخامت و رنگ رو می تونی تغییر بدی، و برای آشنایی بیش تر در تغییرات border در css می تونی این آموزش رو ببینی:

دیدن لینک ها برای شما امکان پذیر نیست. لطفا ثبت نام کنید یا وارد حساب خود شوید تا بتوانید لینک ها را ببینید.

- برای اخبار مطالب بالا این کد رو در template.css:

کد: (انتخاب همه)

#s5_breadcrumbs {
    font-size: 12px;
    height: 45px;
    margin-bottom: 0;
    width: 100%;
}

با این جایگزین کن:

کد: (انتخاب همه)

#s5_breadcrumbs {
    font-size: 12px;
    height: 45px;
    margin-bottom: 40px;
    width: 98%;
    border: 2px solid #CCCCCC;
    padding-right: 10px;
}

برای خود قسمت مطالب می تونی این کد رو باز در template.css:

کد: (انتخاب همه)

table.contentpaneopen {
    width: 100%;
}

با این جایگزین کنی:

کد: (انتخاب همه)

table.contentpaneopen {
    width: 100%;
    border: 2px solid #CCCCCC;
}

و برای قسمت راست قالبت این کد رو باز در template.css:

کد: (انتخاب همه)

.s5_backmiddlemiddle_r {
    margin-left: 7px;
    margin-top: -5px;
}

با این جایگزین کن:

کد: (انتخاب همه)

.s5_backmiddlemiddle_r {
    margin-left: 7px;
    margin-top: 0px;
    border: 2px solid #CCCCCC;
    padding-right: 3px;
}

___________
من الان جواب آقا احسان رو دیدم، یه چند دقیقه کلا نتم قطع شد!!

[محمدرضا بهارلو]

ممنون از دوستان
یه چیز دیگه که یادم رفت بگم.
فونت های قالب خیلی جالب نیست؛میخوام عوض کنم
و میخوام برای عنوان مطالب هم کادری قرار داده و توش را رنگ کمرنگ بزنم

[صدرا حسابی]

برای گزاشتن بک گراند یا تغییرات در تایتل مطالب این کد رو باید تغییر بدی که می تونی براش بک گراند بزاری یا تغییرات دیگه که می خوای رو اعمال کنی:

کد: (انتخاب همه)

.contentheading {
    color: #454545;
    font-size: 16px;
    font-weight: normal;
    line-height: normal;
    text-shadow: 1px 1px #FFFFFF;
}

برای تغییر فونت در این قسمت در template.css با تغییر فونت اکثر قسمت های سایتت درست می شه:

کد: (انتخاب همه)

body {
    color: #393939;
    font-family: Helvetica,Arial,Sans-Serif;
    font-size: 14px;
    margin: 0;
    text-align: right;
}

بازم حالا در فایل های css قالبت باید font-family رو جستجو کنی و هر جا tahoma نبود تغییرش بدی.

[محمدرضا بهارلو]

سلام
ممنون از زحمات دوستان
یه زحمت دیگه
میخواهم مثل عکس های زیر هم بشه
دور عنوان ماژول ها ، دور ماژول های بالایی و پایینی هم میخواهم کادر بزارم
درضمن میخواهم تصویر زمینه ای برای عنوام ماژول ها قرار بدم
ممنون میشم راهنماییم کنید

با تشکر

[محمدرضا بهارلو]

اگه امکانش هست کمک کنید
بسیار ممنون

[ehsansabet]

در فایل template_rtl.css به جای کد :

کد: (انتخاب همه)

#s5_above_body_1_33,
#s5_above_body_2_33,
#s5_above_body_3_33 {
float:right;
}

این کد را جایگزین کن:

کد: (انتخاب همه)

#s5_above_body_1_33,
#s5_above_body_2_33,
#s5_above_body_3_33 {
border:1px solid #ccc;
margin:0px;
padding:0px;
height:260px;
}

و در فایل template.css به جای کد :

کد: (انتخاب همه)

#s5_rightcolumn div.module h3.s5_mod_h3, #s5_leftcolumn div.module h3.s5_mod_h3 {
margin-top:8px;
}

این کد را جایگزین کنید:

کد: (انتخاب همه)

#s5_rightcolumn div.module h3.s5_mod_h3, #s5_leftcolumn div.module h3.s5_mod_h3 {
margin-top:8px;
border:1px solid red;
}

[صدرا حسابی]

در template.css برای قسمت بالا:

این کدها رو:

کد: (انتخاب همه)

#s5_above_body_1_33 {
    float: left;
    padding-bottom: 0;
    padding-right: 4px;
    width: 33%;
}

#s5_above_body_2_33 {
    float: left;
    padding-bottom: 0;
    padding-right: 4px;
    width: 33%;
}

#s5_above_body_3_33 {
    float: left;
    padding-bottom: 0;
    width: 33%;
}

با این جایگزین کن:

کد: (انتخاب همه)

#s5_above_body_1_33 {
    float: left;
    padding-bottom: 0;
    padding-right: 4px;
    width: 32%;
    border: 1px solid #CCCCCC;
    height: 270px;
    direction: rtl;
}
#s5_above_body_2_33 {
    float: left;
    padding-bottom: 0;
    padding-right: 4px;
    width: 33%;
    border: 1px solid #CCCCCC;
    height: 270px;
    direction: rtl;
}
#s5_above_body_3_33 {
    float: left;
    padding-bottom: 0;
    width: 33%;
    border: 1px solid #CCCCCC;
    height: 270px;
    direction: rtl;
}

که باعث می شه راست چین بشن، کادر دورشون بیاد و ارتفاع یکسان داشته باشن،

برای قسمت مشابه پایین هم که عکسش رو نزاشتی این کد رو:

کد: (انتخاب همه)

.s5_userpositions {
    float: left;
    margin: 0;
    padding: 0;
}

با این جایگزین کن:

کد: (انتخاب همه)

.s5_userpositions {
    float: left;
    margin: 0;
    padding: 0;
    border: 1px solid #CCCCCC;
    height: 300px;
}

و این خط رو به template.css اضافه کن تا بیرون نزنه پربازدیدترین مطالب:

کد: (انتخاب همه)

.mostread {
    padding: 3px;
}

برای قسمت تایتل های قسمت راست هم:

این کد رو:

کد: (انتخاب همه)

#s5_rightcolumn div.module h3.s5_mod_h3, #s5_leftcolumn div.module h3.s5_mod_h3 {
    margin-top: 8px;
}

با این جایگزین کن:

کد: (انتخاب همه)

#s5_rightcolumn div.module h3.s5_mod_h3, #s5_leftcolumn div.module h3.s5_mod_h3 {
    margin-top: 8px;
    border: 2px solid #CCCCCC;
    width: 191px;
    padding-right: 5px;
}

[محمدرضا بهارلو]

نقل قول: برای قسمت تایتل های قسمت راست هم:

این کد رو:

کد: (انتخاب همه)

#s5_rightcolumn div.module h3.s5_mod_h3, #s5_leftcolumn div.module h3.s5_mod_h3 {
    margin-top: 8px;
}

با این جایگزین کن:

کد: (انتخاب همه)

#s5_rightcolumn div.module h3.s5_mod_h3, #s5_leftcolumn div.module h3.s5_mod_h3 {
    margin-top: 8px;
    border: 2px solid #CCCCCC;
    width: 191px;
    padding-right: 5px;
}

ممنون از راهنماییتون


میخواهم پس زمینه هم براش قرار بدم
مثلا : سفید
یا تصویر براش قرار بدم و عنوان ماژول روی تصویر قرار بگیره
(اگه تصویر باشه خیلی بهتره)