چگونگی شکل دادن مازول در css

[reelsj 10]

سلام

مدتی که رو اموزش ساخت قالب جوملا کار می کنم

تا حالا تونستم با تگ های div یه قالب بسازم و موقعیت ها رو هم توس ایجاد کنم

فایل css و xml رو هم ساختم

قالب هم بدرستی نصب میشه و مشکلی نداره

فقط مشکلی که هست اینه که

نمیدونم چطوری برای قسمت بالای مازول ها و بدنه اونها یه عکس مخصوص بذارم

منظورم اینه که مثلا مازول هایی که در ستون left قرار می گیرند یک Heder و یا یک background خاص داشته باشند

از چه کدی باید استفاده کنم

[ابوالفضل طالبی 280]

توضیح دادن این موضوع کمی وقت گیر و مفصله .. پیشنهاد میکنم از دو راه کار استفاده کنید:

1- استفاده از ابزار firebug تا بتونید جایی که باید استایل بدید رو پیدا کنید (مثلا بدونید که هدر ماژول چه کلاسی داره که راحت بهش استایل اختصاصی بدید)

2- یک قالب نمونه رو نگاه کنید و مشابه همون کار کنید (باز هم ابزار firebug به شما کمک میکنه)

[reelsj 10]

سلام

ممنونم از پاسخ تون

من این قالب رو از روی اموزش های ویدویی از صفر شروع کردم

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

برداشت من از صحبت های شما اینه که باید در فایل index به مازول یه کلاس خاص اختصاص بدم

و بعد در فایل css براش background بزارم

ولی خوب چیجوری باید این کار و بکنم؟

میشه بیشتر راهنمایی کنید

[ابوالفضل طالبی 280]

لینک زیر رو نگاه کنید همه چیز گویاست:

http://docs.joomla.org/Creating_rounded_corners

[reelsj 10]

ممنون

ولی اون چیزی که من میخوام نشد

فقط اپلود در اپلود سنتر انجمن

این لینک دانلود فایل هاست میخوام عکس modual-head.jpg برای همه مازول ها به عنوان هدر بکار برده شه

باید چیکار کنم؟

میشه لطف کنید و انجامش بدین

ویرایش شده در مهر 91 توسط blazhel

[blazhel 16]

دوست عزیز لطفا به قوانین احترام بزارید

فایل مورد نظر خودتون رو فقط در آپلود سنتر انجمن آپلود کنید نه جای دیگه تا به موضوع شما رسیدگی بشه

[reelsj 10]

اینم لینک فایل ها

http://jupload.ir/do.php?filename=joomlaforum.ir_13495863751.zip

[reelsj 10]

لطفا کمک کنید

[saber 208]

برای عنوانها معمولا از تگهای h استفاده میشه به این مثال توجه کنید همین کار رو برای عنوانهای ماژول انجام داده

h3 {
   background-image: url("../images/bac_h3.png");
   background-position: right center;
   background-repeat: no-repeat;  
}

[reelsj 10]

سلام

ممنون از پاسخی که دادی

ولی خوب یه سوال اینجا هست

از کجا میفهمه که h3 رو به مازول های مثلا موقعیت left مربوط میشه؟

من فایل ها رو اپلود کردم

میشه مثلا برای موقیعت های اینکار و انجام بدی؟

http://jupload.ir/do.php?...3495863751.zip

[mahsam 10]

با سلام.

شما با مراجعه به سایت mozilla fire fox افزونه webdeveloper رو دانلود کن و روی فایرفاکس نصب کن. بعدش تو گوگل بزن آموزش کار با افزونه ..... در فایرفاکس برات کلی آموزش میاره با این افزونه براحتی کدهای یک قالب رو می تونی بدونی کجاها به کار رفته ادیت کنی و غیره ...

یکم حوصله با علاقه + پشتکار داشته باشی می تونی بزودی سایت خودت رو داشته باشی.

با آرزوی موفقیت

[Abbas_Afshar 15]

سلام.

من یکم راهنماییت می کنم. ولی در نهایت خودت باید با روش آزمون و خطا راه حل رو پیدا کنی. چون بحث خیلی مفصله.

ابتدا داخل فایل index.php قالبت، کد زیر رو برای ساخت ماژول left وارد کن:

<div id="left"> <jdoc:include type="modules" name="left" style="rounded" /> </div>

خب حالا برو کدهای زیر رو در Template.css قالبت وارد کن:

#left {

width: 282px;

float:left;

}

#left .module {

background-image: url(../images/left-middel.jpg);

background-repeat:repeat-y;

background-position: top right;

}

#left .module div {

background-image: url(../images/left-top.png);

background-repeat:no-repeat;

background-position: top right;

}

#left .module div div {

background-image: url(../images/left-bottom.jpg);

background-repeat:no-repeat;

background-position: bottom right;

}

عرض ماژول left رو تغییر بده و آدرسه عکس ها رو هم با آدرسه عکس های خودت جایگزین کن.

انجام بده، مشکل داشتی باز مطرح کن.:ooof:

[reelsj 10]

دستت درد نکنه

عالی بود