در این مقاله قصد داریم نحوه تغییر رنگ یا پس زمینه و کلا متفاوت نمودن یکی از آیتم های منو در جوملا را به شما آموزش دهیم.
فکر کنید یک منو دارید مثلا منو اصلی و این منو شامل 5 آیتم است مانند تصویر زیر
و حالا قصد دارید یکی از این آیتم ها را متفاوت نمایش بدید و مثلا رنگ متن عنوان منو و یا پس زمینه آن را تغییر بدید تا در دید کاربر جلب توجه کند. مانند تصویر زیر
برای انجام این کار کافی است در فایل template.css قالب سایت یک کلاس با نام دلخواه مثلا bbt با پارامترهای دلخواه مثلا مانند کدهای زیر ایجاد نمایید و فایل مورد نظر را ذخیره کنید.
.bbt {
border: 1px solid #E67105;
color: #FFF !important;
text-shadow: 0px 1px rgba(0, 0, 0, 0.1);
background-color: #FC9E05;
background-image: -moz-linear-gradient(center top , #FC9E05, #F76F00);
}
پس تا اینجا باید کد بالا را در انتهای فایل template.css قالب خود قرار بدید و فایل را ذخیره کنید. (در کد بالا رنگ متن، حاشیه، پس زمینه و سایه را می توانید به دلخواه تغییر دهید)
سپس از مدیریت جوملا وارد آیتم منو مورد نظر شوید و در تب “نوع لینک” در قسمت “لینک سبک css” باید کلاس مورد نظر bbt که در قالب ایجاد کردیم را وارد نمایید و تنظیمات را ذخیره کنید.
با انجام این کار رنگ و پس زمینه آیتم دلخواه شما تغییر می کند و متفاوت از دیگر آیتم ها نمایش داده خواهد شد. اگر پس از مشاهده سایت تغییرات انجام نشده بود کش مرورگر خود را پاک کنید با ctrl+f5 و سپس تغییرات را مشاهده نمایید.