Share code RecentNews 3 cột cho Xenporta Xem DEMO Ảnh DEMO Hướng dẫn: Trước hết bạn phải cài Xenporta bạn nào chưa có xem tại đây Bước 1: Bạn download file đính kèm. Bước 2: Upload file RecentNews.php vào thư mục website /library/EWRporta/Block Bước 3: Import file RecentNews.xml tại admin.php -> Home -> XenPorta -> Block -> Install block Bước 4: Kéo RecentNews vào Layout: PORTAL Hướng dẫn sửa code: Appearance -> Styles -> Giao diện sử dụng-> Templates -> EWRblock_RecentNews Nhớ thay đổi link ảnh http://cnttqn.com/ thành link domain website của bạn PHP: <xen:require css="message_user_info.css" /><xen:require css="bb_code.css" /><xen:require css="EWRblock_RecentNews.css" /><div id="Block1"><div class="block-title"><a href="http://cnttqn.com/forums/thu-thuat-tin-hoc/" title="Tin tức"><span>Tin tức - Sự kiện span>a>div><ul class="block1"><xen:foreach loop="$RecentNews" value="$news" i="$i"><xen:if is="{$i}<7"> <li> <div class="block-content" id="{$news.thread_id}"> <div class="img-thumb"> <xen:if is="{$news.promote_icon} != 'disabled'"> <xen:if hascontent="true"> <xen:contentcheck> <xen:if is="{$news.attach}"> <a href="{xen:link threads, $news}" class="pin_pic_img_a"><img src="http://res.cloudinary.com/tint/image/fetch/w_250,h_150,c_thumb/http://cnttqn.com/{$news.attach.thumbnailUrl}" />a> <xen:elseif is="{$news.medio}" /> <div style="background: url('{xen:helper medio, $news.medio}') no-repeat;"> <a href="{xen:link 'full:media/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}" class="pin_pic_img_a"><img src="{$news.image}" alt="{$news.image}" />a> <xen:else /> <a href="{xen:link threads, $news}" class="pin_pic_img_a"><img src="http://cnttqn.com/images/not-img.jpg" />a> xen:if> xen:contentcheck> xen:if> xen:if> div> <div class="thread-info"> <a href="{xen:link threads, $news}" title="{$news.title}" class="title">{$news.title}a> <p class="desc">{xen:helper snippet, $news.message, 100}p> div> div> li>xen:if>xen:foreach>ul>div> EWRblock_RecentNews.css PHP: @media (min-width:128px){#Block1 .block1 li {width:100%;overflow:hidden;float:left;background-color: #FDFDFD;}#Block1 .block1 .block-content {margin:7px;min-height:250px}#Block1 .block1 .img-thumb {height:auto;overflow:hidden}#Block1 .block1 .img-thumb img {width:100%;height:100%}#Block1 .block1 .thread-info {padding:6px}#Block1 .block1 .title {font-size:14px;line-height:18px; color: #0C4C80;font-weight:bold}#Block1 .block-content {-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); -khtml-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 0px 1px 3px #676C6E;background-color: #FFF;-webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; border-radius:3px}#Block1 .block-content .desc {padding-top:10px; color: #2E2E30;}.block-title { background: url(http://cnttqn.com/styles/default/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365/icon_red_top.png) no-repeat left top; background-size: 236px 40px; margin-left: 6px; border-bottom: 2px #0C4C80 solid; background-color: #FDFDFD;}.block-title span {font-family: UTM_Header, arial;text-transform: uppercase;color: #FFF;display: inline-block;line-height: 30px;padding: 0 40px 0 30px;background: url(http://cnttqn.com/styles/default/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365/title-box-top.png) no-repeat right top;background-size: 300px 300px;font-weight: normal;margin-top: 10px;font-size: 14px; font-weight: bold;}#Block1 .block-title span {background-position: 100% -40px;}}@media (min-width:540px){#Block1 .block1 li {width: 265px !important;height: 263px !important;overflow:hidden;float:left;background-color: #FDFDFD;}[/COLOR]#Block1 .block1 .block-content {margin:7px;min-height:250px}#Block1 .block1 .img-thumb {height:auto;overflow:hidden}#Block1 .block1 .img-thumb img {width:100%;height:100%}#Block1 .block1 .thread-info {padding:6px}#Block1 .block1 .title {font-size:14px;line-height:18px; color: #0C4C80;font-weight:bold}#Block1 .block-content {-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); -khtml-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 0px 1px 3px #676C6E;background-color: #FFF;-webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; border-radius:3px}#Block1 .block-content .desc {padding-top:10px; color: #2E2E30;}.block-title { background: url(http://cnttqn.com/styles/default/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365/icon_red_top.png) no-repeat left top; background-size: 236px 40px; margin-left: 6px; border-bottom: 2px #0C4C80 solid; background-color: #FDFDFD;}.block-title span {font-family: UTM_Header, arial;text-transform: uppercase;color: #FFF;display: inline-block;line-height: 30px;padding: 0 40px 0 30px;background: url(http://cnttqn.com/styles/default/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365/title-box-top.png) no-repeat right top;background-size: 300px 300px;font-weight: normal;margin-top: 10px;font-size: 14px; font-weight: bold;}#Block1 .block-title span {background-position: 100% -40px;}}@media (min-width:740px){#Block1 .block1 li {width: 265px !important;height: 263px !important;overflow:hidden;float:left;background-color: #FDFDFD;}#Block1 .block1 .block-content {margin:7px;min-height:250px;}#Block1 .block1 .img-thumb {height:120px;overflow:hidden}#Block1 .block1 .img-thumb img {width:100%;height:100%}#Block1 .block1 .thread-info {padding:6px}#Block1 .block1 .title {font-size:14px;line-height:18px; color: #0C4C80;font-weight:bold}#Block1 .block-content {-webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); -moz-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); -khtml-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.3); box-shadow: 0px 1px 3px #676C6E;background-color: #FFF;-webkit-border-radius:3px; -moz-border-radius:3px; -khtml-border-radius:3px; border-radius:3px}#Block1 .block-content .desc {padding-top:10px; color: #2E2E30; font-family: tahoma; font-size: 14px; line-height: 21px; text-align: justify;}.block-title { background: url(cnttqn.com/styles/default/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365/icon_red_top.png) no-repeat left top; background-size: 264px 40px; margin-left: -26px; border-bottom: 2px #0C4C80 solid; }.block-title span {font-family: UTM_Header, arial;text-transform: uppercase;color: #FFF;display: inline-block;line-height: 30px;padding: 0 40px 0 30px;background: url(http://cnttqn.com/styles/default/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365/title-box-top.png) no-repeat right top;background-size: 300px 300px;font-weight: normal;margin-top: 10px;font-size: 14px; font-weight: bold;}#Block1 .block-title span {background-position: 100% -40px;}.fb2{padding-top:5px;}} CSS có sử dụng Responsive cho mobile. Chúc các bạn thành công. Cập nhật RecentNews đẹp cho Xenporta v2
tks bạn đã chia sẻ , đơn giản nhưng khá đẹp, à mà mình vào trang demo thì khung cuối cùng lỗi hiển thị như sau:
anh ơi, em làm đúng hướng dẫn rồi mà không thấy nó hiện recentnew để kéo vào là sao nhỉ, với cả đúng là trong demo bị lỗi cái recentnew cuối, 2 bài viết bị trôi xuống dưới
Các bác cho em hỏi làm sao tạo được 3 cái blocks : RecentNews -RecentNews1 -RecentNews2 như trên ảnh chủ top vậy ? thanks
