Hướng dẫn Slider Block Cho Xenporta Xenforo

CNTT01

Snow Flower ✔
Tham gia
06/07/2015
Bài viết
803
Được Like
686
1.jpg



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.
Bước 2: Chỉnh sửa block HotNews Xenforo cho giống với MetroUI
Đầ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>
Save code này lại và chọn tiếp template EWRblock_HotNews.css rồi thay toàn bộ code trong này bằng code sau:

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];
}
Save code lại. Vậy là bạn đã hoàn thành! Nếu có gì thắc mắc bạn hãy comment phía dưới. Mình sẽ hỗ trợ .
Chúc bạn thành công!
 

dinhnhan

Corporal
Tham gia
10/10/2015
Bài viết
134
Được Like
104
chờ bác hướng dẫn cái xenportal giống muare mà vẫn chưa thấy. vẫn đang lót dép hóng đây bác :=(
 
  • Like
Reactions: THB

CuTeo

Private
Tham gia
30/11/2018
Bài viết
10
Được Like
0
Cho xin lại link download đi theard ơi
 

huynhvantam123

Corporal
Tham gia
28/08/2018
Bài viết
164
Được Like
43
drunk~~ tìm mãi ko ra file đính kèm. hjhj với cái này dùng cho xen mấy thế
 

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mr. Tuấn

Mobile/Zalo: 0988 488 096

Telegram: bluekpro

Email: [email protected]

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Top Bottom