پارس جوم ::  انجمن های تخصصی جوملا
کادر برای قالب - نسخه‌ی قابل چاپ

+- پارس جوم :: انجمن های تخصصی جوملا (https://forums.parsjoom.ir)
+-- انجمن: پشتیبانی (/forum-70.html)
+--- انجمن: مباحث و مشکلات عمومی (/forum-33.html)
+--- موضوع: کادر برای قالب (/thread-4849.html)

صفحه‌ها: 1 2


کادر برای قالب - محمدرضا بهارلو - ۱۲-۱۲-۱۳۹۰ ۰۷:۳۶ صبح

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

میخوام مثل تصویر زیر بشه
[attachment=3525]

ممنون
منتظرم


RE: کادر برای قالب - 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;
}



RE: کادر برای قالب - صدرا حسابی - ۱۲-۱۲-۱۳۹۰ ۰۸:۲۵ صبح

* در تمامی موارد در 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;
}


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


RE: کادر برای قالب - محمدرضا بهارلو - ۱۲-۱۲-۱۳۹۰ ۰۸:۳۱ صبح

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


RE: کادر برای قالب - صدرا حسابی - ۱۲-۱۲-۱۳۹۰ ۰۸:۴۰ صبح

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

کد:
.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 نبود تغییرش بدی.


RE: کادر برای قالب - محمدرضا بهارلو - ۱۲-۱۲-۱۳۹۰ ۰۷:۳۳ عصر

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

با تشکر


RE: کادر برای قالب - محمدرضا بهارلو - ۱۴-۱۲-۱۳۹۰ ۰۱:۰۱ صبح

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


RE: کادر برای قالب - 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;
}



RE: کادر برای قالب - صدرا حسابی - ۱۴-۱۲-۱۳۹۰ ۰۱:۲۹ صبح

در 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;
}



RE: کادر برای قالب - محمدرضا بهارلو - ۱۴-۱۲-۱۳۹۰ ۰۱:۴۸ صبح

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

این کد رو:
کد:
#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;
}


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

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