Code hoặc hướng dẫn này được sử dụng trên phiên bản Xenforo cũ đã quá hạn sử dụng. Bạn hãy
click để tìm bản mới hơn
Footer giống Vxf
Vào template footer thay thế toàn bộ bằng code sau:
Qua template footer.css thay toàn bộ bằng code sau:
Chúc các bạn thành công.
Vào template footer thay thế toàn bộ bằng code sau:
Mã:
<xen:edithint template="footer.css" />
<xen:hook name="footer">
<div class="footer">
<div class="pageWidth">
<div class="pageContent">
<div class="footercolumns" id="footer">
<div class="blockFooter footer-top-left">
<div class="boxInner">
<div class="block-top"><img width="170" height="35" src="http://vxf.vn/styles/vxf/xenforo/logo-footer.png" alt="VXF Logo" class="footerLogo"></div>
<div class="block-bottom">
<p>Cộng đồng XenForo Việt Nam được thành lập từ 5/2012 với mục đích giao lưu, học hỏi, chia sẻ và thảo luận về mọi vấn đề liên quan đến mã nguồn XenForo. </p>
<p>Chúng tôi sẽ không chịu trách nhiệm với các thông tin do thành viên đưa lên trừ thông tin nội bộ.
</p>
<p>Website đang hoạt động thử nghiệm, chờ giấy phép </p>
</div>
</div>
</div>
<div class="blockFooter fotter-contact">
<div class="boxInner">
<h3>Our Links</h3>
<div class="boxContent">
<ul class="itemsList hasIcon">
<li><a target="_blank" href="http://hkda.vn"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>HKDA Việt Nam</a></li>
<li><a target="_blank" href="http://mga.vn"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Email Google Apps</a></li>
<li><a target="_blank" href="http://mailexpress.vn"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Email Marketing</a></li>
<li><a target="_blank" href="http://cer.vn"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Chứng chỉ SSL</a></li>
<li><a target="_blank" href="http://nhattao.biz"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Nhật Tảo</a></li>
<li><a target="_blank" href="http://emailtenmienrieng.com"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Email tên miền riêng</a></li>
<li><a target="_blank" href="http://dvddohoa.com"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>DVD Đồ họa</a></li>
</ul>
</div>
</div>
</div>
<div class="blockFooter three columns column">
<div class="boxInner">
<h3>Thông tin</h3>
<div class="boxContent">
<ul class="itemsList hasIcon">
<li><a target="_blank" href="/"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Text Link</a></li>
<li><a target="_blank" href="/"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Text Link</a></li>
<li><a target="_blank" href="/"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Text Link</a></li>
<li><a target="_blank" href="/"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Text Link</a></li>
<li><a target="_blank" href="/"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Text Link</a></li>
<li><a target="_blank" href="/"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Text Link</a></li>
<li><a target="_blank" href="/"><i class="fa fa-angle-right"></i><i class="fa fa-angle-right fa-lg"></i>Text Link</a></li>
</ul>
</div>
</div>
</div>
<div class="blockFooter four columns column">
<div class="boxInner">
<h3>From our blog</h3>
<div class="boxContent">
<ul class="itemsList">
<li><span class="green">W4U</span><a href="/">Lorem ipsum dolor sit amet</a></li>
<li><span class="blue">VXF</span><a href="/">Consectetuer adipiscing elit</a></li>
<li><span class="yellow">VJL</span><a href="/">Sed diam nonummy nibh euismod</a></li>
<li><span class="skyblue">VOP</span><a href="/">Tincidunt ut laoreet dolore magna</a></li>
<li><span class="orange">MAG</span><a href="/">Aliquam erat volutpat</a></li>
<li><span class="skyblue">VWP</span><a href="/">Ut wisi enim ad minim veniam</a></li>
<li><span class="green">W4U</span><a href="/">Aliquip ex ea commodo consequat</a></li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="footerLegal">
<div class="pageWidth">
<div class="pageContent">
<div id="copyright"><font color=green>Diễn đàn sử dụng XenForo™ ©2011 XenForo Ltd.</font>
</div>
<ul id="legal">
<li class="choosers">
<xen:if is="{$canChangeLanguage}">
<dd><a href="{xen:link 'misc/language', '', 'redirect={$requestPaths.requestUri}'}" class="OverlayTrigger Tooltip" title="{xen:phrase language_chooser}" rel="nofollow">{$visitorLanguage.title}</a></dd>
</xen:if>
</li>
<li class="choosers">
</li>
<li><a href="help/terms">Quy định và Nội quy</a></li>
<li><a href="{$requestPaths.requestUri}#navigation" class="topLink">{xen:phrase go_to_top}</a></li>
</ul>
<xen:if is="{$debugMode}">
<xen:if hascontent="true">
<dl class="pairsInline debugInfo" title="{$controllerName}->{$controllerAction}{xen:if $viewName, ' ({$viewName})'}">
<xen:contentcheck>
<xen:if is="{$page_time}"><dt>{xen:phrase timing}:</dt> <dd><a href="{$debug_url}" rel="nofollow">{xen:phrase x_seconds, 'time={xen:number $page_time, 4}'}</a></dd></xen:if>
<xen:if is="{$memory_usage}"><dt>{xen:phrase memory}:</dt> <dd>{xen:phrase x_mb, 'size={xen:number {xen:calc "{$memory_usage} / 1024 / 1024"}, 3}'}</dd></xen:if>
<xen:if is="{$db_queries}"><dt>{xen:phrase db_queries}:</dt> <dd>{xen:number {$db_queries}}</dd></xen:if>
</xen:contentcheck>
</dl>
</xen:if>
</xen:if>
<span class="helper"></span>
</div>
</div>
</div>
</xen:hook>Qua template footer.css thay toàn bộ bằng code sau:
Mã:
#footer {
clear: both;
min-height: 100px;
padding: 20px 0 25px;
}
.footer {
background: none repeat scroll 0 0 #090c15;
clear: both;
}
.footercolumns {
display: inline;
margin-left: 0;
margin-right: 0;
}
.footer-top-left .block-top {
margin-bottom: 10px;
}
.footer-top-left .block-bottom {
float: left;
margin-bottom: 5px;
margin-right: 15px;
padding-bottom: 5px;
}
.footer-top-left .block-bottom span {
color: #fff;
display: block;
font-size: 12px;
margin-bottom: 5px;
text-transform: uppercase;
}
.footer-top-left .block-bottom p {
font-size: 12px;
margin-bottom: 0;
padding: 10px 0;
}
.footer-top-left .connect-face {
clear: both;
}
.footer-top-left .connect-face p {
color: #95a1bc;
float: left;
font-size: 14px;
font-style: normal;
font-weight: 400;
text-transform: uppercase;
}
.connect-face ul li {
display: inline;
float: left;
padding-left: 10px;
}
.fotter-contact {
min-height: 174px;
}
.footer h3 {
background: none repeat scroll 0 0 #10131c;
border-bottom: 1px solid #090c15;
border-radius: 3px 3px 0 0;
color: rgb(56, 68, 91);
font-family: "Roboto",sans-serif;
font-size: 14px;
font-weight: 500;
padding: 10px;
text-transform: uppercase;
}
.footer .boxInner {
padding: 0 10px;
}
.footer .four span {
display: inline-block;
margin-right: 10px;
text-align: center;
width: 30px;
}
.footer .four .blue {
color: #1175a7;
}
.footer .four .yellow {
color: #eb8400;
}
.footer .four .skyblue {
color: #0ea7c6;
}
.footer .four .orange {
color: #dd3b0d;
}
.footer .four .green {
color: #5ea618;
}
.footer .boxContent {
background: none repeat scroll 0 0 #0d1019;
border-radius: 0 0 3px 3px;
padding: 0 10px;
}
.footer .boxContent ul.itemsList li {
border-top: 1px solid #10131c;
padding: 5px 0;
position: relative;
}
.footer .boxContent ul.itemsList li:first-child {
border-top: 0 none;
}
.fotter-contact p {
font-size: 12px;
margin-bottom: 0;
padding-bottom: 5px;
}
.fotter-contact a {
display: inline-block;
font-size: 14px;
text-decoration: none;
}
#footer .four.columns.column {
min-height: 174px;
}
#footer .column a {
font-size: 14px;
text-decoration: none;
}
#footer .column a:hover {
color: #bbb;
}
#footer .three.columns.column {
min-height: 174px;
}
.footer .pageContent {
color: rgb(51, 56, 72);
font-size: 14px;
overflow: hidden;
padding: 50px 0 40px;
}
.footer a, .footer a:visited {
color: rgb(51, 56, 72);
}
.footer a:hover, .footer a:active {
color: rgb(200, 200, 200);
text-decoration: none;
}
.footer .choosers {
float: left;
overflow: hidden;
padding-left: 5px;
}
.footer .choosers dt {
display: none;
}
.footer .choosers dd {
float: left;
}
.footerLinks {
float: right;
overflow: hidden;
padding-right: 5px;
}
.footerLinks li {
float: left;
}
.footerLinks a.globalFeed {
background: url("http://vxf.vn/styles/vxf/xenforo/xenforo-ui-sprite.png") no-repeat scroll -112px -16px rgba(0, 0, 0, 0);
display: block;
height: 14px;
margin: 5px;
padding: 0;
text-indent: -9999px;
white-space: nowrap;
width: 14px;
}
.footerLegal {
background: none repeat scroll 0 0 #080a13;
}
.footerLegal .pageContent {
font-size: 14px;
overflow: hidden;
padding: 30px 0;
text-align: center;
}
.footerLegal .pageContent a:link {
color: rgb(56, 68, 91);
}
#copyright {
float: left;
}
#legal {
float: right;
}
#legal li {
display: inline-block;
margin-left: 10px;
}
.tweets .follow {
background: url("http://vxf.vn/styles/vxf/extra/tweets-logo-01.png") no-repeat scroll left center rgba(0, 0, 0, 0);
float: right;
padding-left: 18px;
text-transform: none;
}
.var-narrow .timeline-header {
background: none repeat scroll 0 0 #10131c !important;
border-bottom: 1px solid #090c15 !important;
border-radius: 3px 3px 0 0 !important;
color: #68738c !important;
font-family: "Roboto",sans-serif !important;
font-size: 14px !important;
font-weight: 400 !important;
padding: 10px !important;
text-transform: uppercase !important;
}
.descImage {
float: left;
margin-right: 10px;
}
.boxFooter {
border: 5px solid #10131c;
color: #4f5c77;
padding: 5px 10px 7px;
}
@media (max-width: 800px) {
}
@media (max-width: 610px) {
.pageWidth {
margin: 0 !important;
min-width: 0 !important;
width: auto !important;
}
#copyright, #legal {
float: none;
}
}
@media (max-width: 480px) {
#copyright, #legal {
float: none !important;
}
#termsRule, #toTop {
display: none !important;
}
}
#footer .footerLogo {
height: auto;
max-width: 100%;
width: auto;
}
#footer .boxContent ul.itemsList.hasIcon li a .fa-lg {
margin-right: 5px;
}
.footer .blockFooter {
float: left;
width: 25%;
}
Nguồn: kicode.us
Bài viết liên quan
Bài viết mới
Silzedt
![[VNXF 2x] Best Statistics Pro – Thống kê nâng cao, tối ưu hiệu năng cho XenForo 1.1](https://cdn.vnxf.vn/data/assets/logo_alternate/vnxf-2x-best-statistics-pro-m.webp){kind=logo}
