Mình có làm cái trang chủ giống hướng dẫn dưới đây. nhưng cái recent này 2 cột nhưng nó chỉ hiển thị 2 cột với trình duyệt chrome còn firefox thì nó chỉ hiển thị 1 cột, giờ chỉnh sao để cho nó hiển thị 2 cột hết hả các bạn. Cảm ơn các bạn nhiều.
Đầu tiên các bạn vào template EWRblock_RecentNews thay hết bằng code sau
Mã:
<xen:require css="EWRblock_RecentNews.css" />
<div id="recentNews">
<xen:foreach loop="$RecentNews" value="$news" i="$i">
<div class="content-news">
<div class="author">
<div class="author-content">
<span class="avata">
<a href="{xen:link members, $news}"></a><xen:avatar user="$news" size="s" img="true" />
</span>
<span class="name"><a href="{xen:link members, $news}" class="username">{$news.username}</a></span>
</div>
</div>
<div class="thumb">
<span class="rt-image">
<a href="{xen:link threads, $news}"><img src="<xen:if is="{$news.image}">{$news.image}<xen:else />http://mamcongnghe.com/images/news.jpg</xen:if>"
style="max-height: 600px; max-width: 380px;"></a>
</span>
</div>
<div class="metaContent">
<div class="ovf">
<h2><a href="{xen:link threads, $news}" class="newsTitle">{$news.title}</a></h2>
<div class="newsTexts">{xen:helper snippet, $news.message, 300}</div>
</div>
<div class="postedBy">
<span class="views"><a href="{xen:link threads, $news}">{xen:number $news.view_count}</a></span>
<span class="cm"><a href="{xen:link threads/reply, $news}" class="NoPopupGadget OverlayTrigger">{xen:number $news.reply_count}</a></span>
<span class="liked">{xen:number $news.reply_count}</span>
<span class="share"><a href="#" onclick="window.open('https://www.facebook.com/sharer.php?u={xen:link full:threads, $news}','pagename','resizable,height=500,width=600'); return false;"></a></span>
</div>
</div>
</div>
</xen:foreach>
</div>
<div id="Loadpage"></div>
<xen:if hascontent="true">
<div class="section sectionMain">
<xen:contentcheck>
<xen:if is="{$option.pagenav} && {$option.count} > {$option.limit}">
<xen:if is="{$category}">
<xenagenav link="articles" linkdata="{$category}" page="{$page}" perpage="{$option.limit}" total="{$option.count}" />
<xen:else />
<xenagenav link="portal" page="{$page}" perpage="{$option.limit}" total="{$option.count}" />
</xen:if>
</xen:if>
</xen:contentcheck>
</div>
</xen:if>
Sau đó vào EWRblock_RecentNews.css thay hết bằng code sau
Mã:
#recentNews{-webkit-column-count:2;-webkit-column-gap:10px;-webkit-column-fill:auto;-moz-column-count:2;-moz-column-gap:10px;-moz-column-fill:auto;-webkit-column-count:2;-moz-column-count:2;column-count:2;-webkit-column-gap:15px;-moz-column-gap:15px;column-gap:15px;-webkit-column-fill:auto;-moz-column-fill:auto;column-fill:auto;margin-top:10px;}@media (max-width: 600px) {#recentNews{-webkit-column-count:1;-moz-column-count:1;-webkit-column-count:1;-moz-column-count:1;column-count:1;}}@media (max-width: 800px) {.sidebar{width:100%;}}.content-news{display:block;backgroundFEFEFE;-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.2);-moz-box-shadow:0 1px 1px rgba(0,0,0,0.2);-khtml-box-shadow:0 1px 1px rgba(0,0,0,0.2);box-shadow:0 1px 1px rgba(0,0,0,0.2);-webkit-box-shadow:0 1px 1px rgba(0,0,0,0.2);-moz-box-shadow:0 1px 1px rgba(0,0,0,0.2);margin:0 0px 15px;-webkit-column-break-inside:avoid;-moz-column-break-inside:avoid;-webkit-column-break-inside:avoid;-moz-column-break-inside:avoid;column-break-inside:avoid;-webkit-transition:all .2s ease;-moz-transition:all .2s ease;-o-transition:all .2s ease;transition:all .2s ease;-webkit-border-radius:3px;-moz-border-radius:3px;-khtml-border-radius:3px;border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;font-size:14px;font-family:Arial;}.thumb{margin:0 15px;overflow:hidden;}.thumb img{max-width:100%!important;margin:0 auto;display:block;}.content-news .ovf{padding:0 15px 15px;}.content-news .ovf h2 a{font-size:17px;font-weight:bold;text-decoration:none;line-height:18px;padding:5px 0;display:block;}.content-news .ovf h2 a:hover{color:rgb(0,148,131);}.content-news .author{width:100%;height:30px;-webkit-border-radius:3px 3px 0 0;-moz-border-radius:3px 3px 0 0;-khtml-border-radius:3px 3px 0 0;border-radius:3px 3px 0 0;-webkit-border-radius:3px 3px 0 0;-moz-border-radius:3px 3px 0 0;}.author-content .avata{width:16px;height:16px;backgroundddd;display:inline-block;margin:7px;overflow:hidden;-webkit-border-radius:10px;-moz-border-radius:10px;-khtml-border-radius:10px;border-radius:10px;-webkit-border-radius:10px;-moz-border-radius:10px;float:left;}.author-content .avata img{width:16px;height:16px;}.author-content .name{display:inline-block;line-height:30px;float:left;font-size:13px;font-family:Arial;}.author-content .name a{text-decoration:none;colorB2B2B2;}.author-content .name a:hover{color545454;}.postedBy{padding:10px;backgroundf5f5f5;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;-khtml-border-radius:0 0 3px 3px;border-radius:0 0 3px 3px;-webkit-border-radius:0 0 3px 3px;-moz-border-radius:0 0 3px 3px;}.postedBy span{background:url(styles/default/xenforo/like-icon.png) no-repeat;padding-left:16px;margin:0 5px;}.postedBy .views{background-position:0 0;}.postedBy .cm{background-position:0 -16px;}.postedBy .liked{background-position:0 -32px;}.postedBy .share{background:url(http://i.imgur.com/CUvIEx6.png) 0 center no-repeat;padding-left:21px;}.postedBy .share a:after{content:"Chia sẻ lên Facebook";}@media (min-width:800px) and (max-width:910px) {.postedBy .share a:after{content:"Chia sẻ";}}@media (min-width:600px) and (max-width:670px) {.postedBy .share a:after{content:"Chia sẻ";}}@media (max-width:340px) {.postedBy .share a:after{content:"Chia sẻ";}}.button_more{display:block;text-align:center;}.button_more a{padding:9px;display:block;border-top:none;color38AACE;font-size:11pt;}span.avata .img{width:16px!important;height:16px!important;background-size:16px 16px;}a.Loadend{colorC71212;}
#recentNews > div > div > span { display:block!important; }
#recentNews { height: auto!important; }
#recentNews .content-news:nth-child(4) .thumb img, #recentNews .content-news:nth-child(6) .thumb img { display:none; }
Vào AdminCP -> XenPorta -> Layout -> Portal chỉnh cho cái block bạn dùng lên trên cùng bên phải ( bắt buộc ).
Sau đó vào AdminCP -> XenPorta -> Blocks -> Block bạn dùng -> Chỉnh số bài là 10.
Vậy là ok.
Sửa lần cuối:
Bài viết liên quan
Được quan tâm
Bài viết mới