چطور : تبدیل نمایش منو - طولی به عرضی

[dr.saleh14]

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

منو من همان منو رسمی جوملا و از ماژول ویا کامپوننت خاصی استفاده نکردم
ممنون

[novinfard]

با سلام،

در جوملا 1.5 در داخل ماژول منو این ویژگی قرار داشت. ولی در 2.5 به دلیل ایجاد جامعیت این ویژگی حذف شده تا طراحان توسط css اعمال کنند.

برای مثال به این مثال توجه کنید:

در index.php قالب جهت تعریف موقعیت مورد نظر منو:


<jdoc:include type="modules" name="top" />


خروجی jdoc:include این کد html خواهد بود:

<ul class="menu">
<li><a href="#">Item one</a></li>
<li><a href="#">Item two</a></li>
<li><a href="#">Item three</a></li>
<li><a href="#">Item four</a></li>
<li><a href="#">Item five</a></li>
</ul>

حال با اعمال این css می توان منوهای افقی ایجاد کرد:

ul.menu {
margin: 0;
padding: 0;
}
ul.menu li{
list-style-type: none;
margin: 0;
padding: 0;
padding-left: 10px;
float: right;
}

من فایل نمونه ای رو هم که این مثال آموزشی را در آن اجرا کردم را هم ضمیمه کردم.

پیروز باشید