Tạo Sub title cho mục tin tức

Không biết mô tả thế nào. Nhưng demo như đính kèm.

 

 

- Chèn đoạn này vào style.css

 

.title_home {
    height: 35px;
    color: #FFF;
    padding-left: 38px;
    line-height: 35px;
    background: url("../images/icon_label.png") no-repeat scroll 0 center;
    border-bottom: 2px solid #058B3A;
}

Link ảnh: 

 

- Vào themes/ten-theme-ban/modules/news

- Đổi nội dung file viewcat_main_right.tpl thành: 

<!-- BEGIN: main -->
<!-- BEGIN: listcat -->
<div class="news_column">
	<div class="panel panel-default clearfix">
		<div class="title_home">
			<ul class="list-inline" style="margin: 0">
				<li><h2><a title="{CAT.title}" href="{CAT.link}"><span class="gbw">{CAT.title}</span></a></h2></li>
				<li class="subcat">
					<ul class="subtitle">
						<!-- BEGIN: subcatloop -->
						<li class="hidden-xs"><h3><a title="{SUBCAT.title}" href="{SUBCAT.link}"> • {SUBCAT.title}</a></h3></li>
						<!-- END: subcatloop -->
						<!-- BEGIN: subcatmore -->
						<li class="pull-right hidden-xs"><h3><a title="{MORE.title}" href="{MORE.link}"><em class="fa fa-sign-out">&nbsp;</em></a></h3></li>
						<!-- END: subcatmore -->
					</ul>
				</li>
			</ul>
		</div>

		<div class="panel-body">
			<div class="row">
				<div class="{WCT}">
					<!-- BEGIN: image -->
					<a title="{CONTENT.title}" href="{CONTENT.link}"><img src="{HOMEIMG}" alt="{HOMEIMGALT}" width="{IMGWIDTH}" class="img-thumbnail pull-left imghome" /></a>
					<!-- END: image -->
					<h3>
						<a title="{CONTENT.title}" href="{CONTENT.link}">{CONTENT.title}</a>
						<!-- BEGIN: newday -->
						<span class="icon_new">&nbsp;</span>
						<!-- END: newday -->
					</h3>
					<div class="text-muted">
						<ul class="list-unstyled list-inline">
							<li><em class="fa fa-clock-o">&nbsp;</em> {CONTENT.publtime}</li>
													</ul>
					</div>
					<p class="text-justify">{CONTENT.hometext}</p>
				</div>

				<!-- BEGIN: related -->
				<div class="col-md-8">
               <ul class="related">
                  <!-- BEGIN: loop -->                      
                  <li class="s-border clearfix">                       
                        <a href="{OTHER.link}" title="{OTHER.title}"><img src="{OTHER.imghome}" alt="{OTHER.title}" width="{OTHER.blockwidth}" class="s-border pull-left imghome" style="width:50px; height:40px"/></a>               
                        <a class="show" href="{OTHER.link}" data-content="{OTHER.hometext}" data-img="{OTHER.imghome}" data-rel="block">{OTHER.title_cut}</a>
                  </li>                        
                  <!-- END: loop -->
               </ul>
            </div>
				<!-- END: related -->
			</div>
		</div>
	</div>
</div>
<!-- END: listcat -->
<!-- END: main -->

Có gì các bạn tùy biến thêm.

Mình cũng được người khác hướng dẫn và giờ đăng bài đóng góp cho cộng đồng. Mong được góp ý  ạ.

 

Cái này thì OK rồi anh em cho mình hỏi nếu nền bg của subtitle đó có thể rộng theo độ dài của tiêu đề thì sửa thế nào ạ. Cảm ơn

 

Em cảm ơn anh ạ ! 

 

Bạn chia ảnh nền làm 3. Trái, giữa và phải
Phần bên trái và phải bạn để bình thường và chọn để no-repeat
Phần ở giữa bạn làm nền cho title và chọn repeat-x
Để đảm bảo co giãn chuẩn nhất bạn cắt ảnh ở giữa càng nhỏ càng tốt (vì phần ở giữa giống nhau nên ta cho repeat-x thì n ghép lại cũng giống 1 ảnh thôi :D)
Ảnh mình cắt cho bạn bên dưới rồi:

 

Muốn sửa cái tiêu đề mà không được. Với thêm ảnh demo cũng không được :))

 

Báo gấp với BQT nha cưng, hoặc gọi số 114

 

bị lỗi cái này

 

Chắc phải cấp quyền cho mấy thánh được phép sửa trong vòng 1 tuần quá 

 

Cho em sửa đi để em sửa cho chi tiết bác ạ. HD em còn thiếu :))

 

 

mình cũng bị lỗi này, có cách nào làm kiểu như nguoiquangnam.vn không mọi người

 

Cố lấy css của: http://nguoiquangnam.vn/

về mà làm....

 

bác thành chung cho em hỏi tý là làm sao chuyên mục con nó hiển thị đc như demo của bác vậy à, em làm mà nó bị vỡ, không đc như bác

 

cuối cùng cũng mò ra

thêm lớp css ni nữa là ok

.list-inline .subtitle .hidden-xs {
    float: left;
    padding-left: 10px;
    padding-top: 5px;
}

 

 

 

Cụa mình vẫn bị http://dichvu24.net/nukeviet/vi/

 

bạn đọc lại của chủ topic, rồi xem qua phần của mình nữa là ok

 

Rõ là chỉ copy. thêm cái của nạn nữa, vẫn lỗi

 

các bác cho em hỏi, làm thế nào để ảnh nền tiêu đề của mỗi mục tin là khác nhau?

 

 

 

Tiêu đề ở vị trí nào bạn ?

Khi xem bài viết con ?

Khi xem trang chủ hay ở thanh menu hay ở đâu đó ?

 

Em muốn title mỗi chuyên  mục có một hình riêng như thế này.