#170986 gửi bởi aptx1987
Ngày 23 Tháng 07 2015 , 05:24
Mình muốn màu mè chút. Sủa vài chỗ trên block category nhưng bị bế tắc chỗ này
Đây là cái Menu category. Đính kèm menu.jpg
Ở đây các menu con đều có thêm cái bullet (mũi tên đằng trước á)

Nhưng đến phần block menu site thì chỉ dc gần giống như trên (đính kèm menu-cuibap.jpg). Bullet các mục con ko có. Mình chả biết chèn code vào đâu nữa.
Đính kèm
(24.19 KB) Đã tải về 42 lần
(16.54 KB) Đã tải về 40 lần
#170993 gửi bởi aptx1987
Ngày 23 Tháng 07 2015 , 06:26
thì mình vẫn dùng menu metismenu nên css của nó cũng là metismenu.css thôi bạn. vấn đề là khi mình mở file menu_blocks.php thì ko biết phải chèn thêm code vào đâu để hiện cái bullet lên
#171002 gửi bởi anhyeuviolet
Ngày 23 Tháng 07 2015 , 20:30
Thử code này nhé
Mã: Chọn hết
.active > ul > li {
background: transparent url("../images/arrow_left_orange.png") no-repeat scroll 20px 18px;
}


Chèn vào \themes\default\css\jquery.metisMenu.css

Cổng nhôm đúc Nhật Bản
http://www.asuzac-acm.com.vn/vi/acm/cong-nhom-duc/
#171014 gửi bởi aptx1987
Ngày 24 Tháng 07 2015 , 02:53
đã chèn f12 lên thì thấy .active > ul > li {
background: transparent url("../images/arrow_left_orange.png") no-repeat scroll 20px 18px;
}
Nhưng ngoài web ko thay đổi gì cả bạn à. Hay là minh xai nv4.0 nên ko làm vậy dc
#171016 gửi bởi aptx1987
Ngày 24 Tháng 07 2015 , 03:07
hình ảnh đó có tồn tại mà. bạn có thể gửi mình file css đó ko. Đây là code global.metismenu.tpl của mình. Đã xong cái bullet của menu cha và mũi tên xổ xuống. h chỉ còn cái bullet của menu con cho giống hình kia thôi

Mã: Chọn hết
<!-- BEGIN: tree -->
<li>
<a title="{MENUTREE.note}" href="{MENUTREE.link}" class="sf-with-ul"{MENUTREE.target}>{MENUTREE.title_trim}</a>
<!-- BEGIN: tree_content -->
<ul>
{TREE_CONTENT}
</ul>
<!-- END: tree_content -->
</li>
<!-- END: tree -->
<!-- BEGIN: main -->
<link rel="stylesheet" type="text/css" href="/themes/{BLOCK_THEME}/css/jquery.metisMenu.css" />
<script type="text/javascript" src="/js/jquery/jquery.metisMenu.js" data-show="after"></script>

<div class="clearfix panel">
<aside class="sidebar">
<nav class="sidebar-nav">
<ul id="menu_{MENUID}">
<!-- BEGIN: loopcat1 -->
<li>
<span class="bullet"><img src="/themes/default/images/bullet.png"></span><a title="{CAT1.note}" href="{CAT1.link}"{CAT1.target}>{CAT1.title_trim}</a>
<!-- BEGIN: expand -->
<span class="arrow expand"><img src="/themes/default/images/arrow.png"></span>
<!-- END: expand -->
<!-- BEGIN: cat2 -->
<ul>
{HTML_CONTENT}
</ul>
<!-- END: cat2 -->

</li>
<!-- END: loopcat1 -->
</ul>
</nav>
</aside>
</div>
<script type="text/javascript" data-show="after">
$(function () {
$('#menu_{MENUID}').metisMenu({
toggle: false
});
});
</script>
<!-- END: main -->
Sửa lần cuối bởi zkhanh vào Ngày 24 Tháng 07 2015 , 03:13, với tổng số 1 lần sửa.
#171017 gửi bởi anhyeuviolet
Ngày 24 Tháng 07 2015 , 03:13
Mã: Chọn hết
.arrow {
float: right;
margin: -32px 12px 0;
padding: 4px 8px 4px 8px;
color: #fff;
cursor: pointer;
}

.fa.arrow:before {
content: "\f104";
}

.active > a > .fa.arrow:before {
content: "\f107";
}

.plus-times {
float: right;
}

.fa.plus-times:before {
content: "\f067";
}

.active > a > .fa.plus-times {
filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=1);
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
}

.plus-minus {
float: right;
}

.fa.plus-minus:before {
content: "\f067";
}

.active > a > .fa.plus-minus:before {
content: "\f068";
}

.sidebar {
display: block;
float: left;
width: 100%;
background: #333;
}
.content {
display: block;
overflow: hidden;
width: auto;
}

.sidebar-nav {
border-bottom: 1px solid rgba(0, 0, 0, 0.3);
background-image: -webkit-linear-gradient(left, color-stop(#333333 10px), color-stop(#222222 10px));
background-image: linear-gradient(to right, #0855A1 10px, #043C72 10px);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ff333333', endColorstr='#ff222222', GradientType=1);
margin: 0px;
}
.sidebar-nav ul {
padding: 0;
margin: 0;
list-style: none;
}
.sidebar-nav ul li, .sidebar-nav ul a{
display: block;
}
.sidebar-nav ul a {
padding: 10px 20px;
color: #e2e2e2;
border-top: 1px solid rgba(0, 0, 0, 0.3);
box-shadow: 0px 1px 0px rgba(255, 255, 255, 0.05) inset;
text-shadow: 0px 1px 0px rgba(0, 0, 0, 0.5);
}
.sidebar-nav ul a:hover, .sidebar-nav ul a:focus, .sidebar-nav ul a:active {
color: #fff;
text-decoration: none;
}
.sidebar-nav ul ul a {
padding: 10px 30px;
background-color: rgba(255, 255, 255, 0.1);
}
.sidebar-nav ul ul a:hover, .sidebar-nav ul ul a:focus, .sidebar-nav ul ul a:active {
background-color: rgba(255, 255, 255, 0.2);
}
.sidebar-nav-item {
padding-left: 5px;
}
.sidebar-nav-item-icon {
padding-right: 5px;
}
.active > ul > li {
background: transparent url("../images/arrow_left_orange.png") no-repeat scroll 20px 18px;
}


Dòng cuối cùng là cái mình thêm vào.

Cổng nhôm đúc Nhật Bản
http://www.asuzac-acm.com.vn/vi/acm/cong-nhom-duc/