CNTT01
Snow Flower ✔
- Tham gia
- 06/07/2015
- Bài viết
- 803
- Được Like
- 686
Bước 1: Cài block HotNews
- Yêu cầu: Bạn phải cài Add-on XenPorta
- Thực hiện: Nếu đã cài add-on vậy thì bạn hãy giải nén file mình đính kèm phí dưới ra, có một file mang tên làHotNews.xml, bạn import này bằng cách chọn Blocks > Install Block ở mục XenPorta trong Bảng quản trị viên. Đối với những bạn chưa biết cài Xenporta các bạn có thể comment phía dưới mình hướng dàn luôn.
Đầu tiên bạn vào trình chọn giao diện trong bảng quản trị viên, sau đó hãy chọn giao diện mà bạn muốn cho block HotNews này hiện kiểu Metro tiếp đó bạn vào phần Templates giao diện vừa chọn search templates mang tên EWRblock_HotNews thay toàn bộ code trong phần này bằng code sau:
Mã:
<xen:elseif is="{$news.medio}" />
<div style="background: url('{xen:helper medio, $news.medio}') no-repeat;">
<a href="{xen:link 'full:media/popout', $news.medio}" class="OverlayTrigger"><img src="styles/8wayrun/EWRmedio_play.png" width="160" height="90" /></a>
</div>
<xen:elseif is="{$news.image}" />
<a href="{xen:link threads, $news}"><img title="{$news.title}" src="{$news.image}" alt="{$news.title}" /></a>
<xen:else />
<a href="{xen:link threads, $news}"><img title="{$news.title}" src="" alt="{$news.title}" /></a>
</xen:if>
</xen:contentcheck>
</xen:if>
</xen:if>
</div>
<div class="title">
<h3><a href="{xen:link threads, $news}" class="newsTitle">{$news.title}</a></h3>
</div>
</div>
<div class="clearFix"></div>
<xen:else />
<div class="item type2 nofade">
<div class="img">
<xen:if is="{$news.promote_icon} != 'disabled'">
<xen:if hascontent="true">
<xen:contentcheck>
<xen:if is="{$news.attach}">
<a href="{xen:link threads, $news}"><img title="{$news.title}" src="{$news.attach.thumbnailUrl}" alt="{$news.title}" /></a>
<xen:elseif is="{$news.medio}" />
<div style="background: url('{xen:helper medio, $news.medio}') no-repeat;">
<a href="{xen:link 'full:media/popout', $news.medio}" class="OverlayTrigger"><img src="styles/8wayrun/EWRmedio_play.png" width="160" height="90" /></a>
</div>
<xen:elseif is="{$news.image}" />
<a href="{xen:link threads, $news}"><img title="{$news.title}" src="{$news.image}" alt="{$news.title}" /></a>
<xen:else />
<a href="{xen:link threads, $news}"><img title="{$news.title}" src="" alt="{$news.title}" /></a>
</xen:if>
</xen:contentcheck>
</xen:if>
</xen:if>
</div>
<div class="title">
<h3><a href="{xen:link threads, $news}" class="newsTitle">{$news.title}</a></h3>
</div>
</div>
</xen:if>
</xen:foreach>
</div>
</div>
Mã:
[HASHTAG]#hotNews[/HASHTAG]{
float: left;
margin-bottom: 15px;
width: 100%;
height: 100%;
}
.hot_news {
background-color: [HASHTAG]#FFFFFF[/HASHTAG];
float: left;
padding: 1px 1px 1px 1px;
}
.hot_news .item {
float: left;
padding: 0px 1px 1px 1px ;
position: relative;
}
.hot_news .type2 {
padding-left: 0;
}
.hot_news .type2 .title {
width: 194px;
outline: medium none;
}
.hot_news .type2 div.img img {
height: 200px;
width: 240px;
overflow: hidden;
}
.hot_news .type1 .title {
width: 436px;
font-size: 18px;
outline: medium none;
}
.hot_news .type1 div.img img {
height: 200px;
width: 482px;
}
.hot_news .item .title {
height: 71px;
padding: 6px 23px 6px 23px;
text-align: left;
}
.hot_news .fade .title {
background-image: linear-gradient(to bottom right,[HASHTAG]#690[/HASHTAG],rgba(102, 153, 0, 0.5));
bottom: 3px;
position: absolute;
}
.hot_news .nofade .title {
background-image: linear-gradient(to bottom right,[HASHTAG]#690[/HASHTAG],rgba(102, 153, 0, 0.5));
bottom: 3px;
position: absolute;
}
.hot_news .type2 .title h3 {
font-size: 140%;
line-height: inherit;
}
.hot_news .type3 .title h3 {
font-size: 16px;
line-height: inherit;
}
.hot_news .type3 .title h3:hover {
text-decoration: none;
}
.hot_news .fade .title a {
color: [HASHTAG]#ffffff[/HASHTAG];
}
.hot_news .nofade .title a {
color: [HASHTAG]#ffffff[/HASHTAG];
}
Chúc bạn thành công!
Bài viết liên quan
Bài viết mới