Hướng dẫn Footer giống VXF.Vn hiện tại cho XenForo

[htnkenji]

Demo online: http://muare5s.com/
Vào template footer thay toàn bộ thành
HTML Code:

<xen:edithint template="footer.css" />
<xen:hook name="footer"><div class="footer">    <div class="pageWidth">        <div class="pageContent">            <div id="footer" class="footercolumns">                  <div id="footer-top">                                        <div class="footer-top-left">                    <div class="block-top"><img alt="Rao vặt miễn phí" src="http://muare5s.com/styles/default/xenforo/muare5s.jpg" height="60px" style="float: left" />                                                               <a href="http://movie.buidoi.vn" title="Xem phim online, phim hd online"><img src="http://img407.imageshack.us/img407/4163/buidoinet15052013.png" alt="xem phim nhanh, xem phim online" style="float: right" width="280px" /></a>                                        </div>
                    <div class="block-bottom"><span>RAO VẶT MIỄN PHÍ</span>
                    <p>Diễn đàn Rao Vặt - Quảng Cáo miễn phí, nơi đăng tin tìm việc, tìm người, rao bán các loại sản phẩm hiệu quả và nhanh chóng.</p>                    </div>
                    <div class="connect-face">                    <p>Follow us</p>
                    <ul>                        <li><a href="http://facebook.com/buidoifc"><img alt="Facebook" src="http://muare5s.com/data/images/face.png" title="FaceBook"></a></li>                        <li><a href="http://youtube.com/user/synam135"><img alt="Social" src="http://muare5s.com/data/images/youtube.png" title="Youtube"></a></li>                        <li><a href="http://twitter.com/buidoinet"><img alt="Twitter" src="http://muare5s.com/data/images/twitter.png" title="Twitter"></a></li>                        <li><a href="https://plus.google.com/103596386203292835277"><img alt="Google" src="http://muare5s.com/data/images/google.png" title="Google"></a></li>                        <li><a href="#"><img alt="Social" src="http://muare5s.com/data/images/pinterest.png" title="Pinterest"></a></li>                        <li><a href="forums/-/index.rss"><img alt="Rss Feed" src="http://muare5s.com/data/images/rss.png" title="Rss Feed"></a></li>                    </ul>                    </div>                    </div>                        <div class="fotter-contact">                    <h3>Our Links</h3>
                    <ul>                        <li><a href="http://buidoi.net/" target="_blank">Wapmaster Việt</a></li>                        <li><a href="http://movie.buidoi.vn/" target="_blank">Xem Phim Online</a></li>                        <li><a href="http://tutviet.com" target="_blank">Thủ Thuật PC</a></li>                        <li><a href="#" target="_blank">Game Online</a></li>                        <li><a href="#" target="_blank">Webmaster Việt</a></li>                        <li><a href="http://hosting.lesynam.info" target="_blank">Host giá rẻ</a></li>                        <li><a href="http://cntt4u.com" target="_blank">Tạp Chí Design</a></li>                    </ul>                    </div>                </div>                                 <div class="four columns column">                    <h3>Thông tin</h3>                    <ul>                        <li><a href="http://muare5s.com/forums/2/">Thông báo chung</a></li>                        <li><a href="http://muare5s.com/forums/3/">Thắc mắc, góp ý</a></li>                        <li><a href="http://muare5s.com/categories/5/">Thị trường mua bán</a></li>                        <li><a href="http://muare5s.com/categories/34/">Việc làm, Tuyển sinh</a></li>                        <li><a href="http://muare5s.com/categories/45/">Giải Trí</a></li>                        <li><a href="help/">Trợ giúp</a></li>                        <li><a href="misc/contact">Liên hệ BQT</a></li>                    </ul>                </div>                <div class="three columns column">                    <h3>Liên kết bạn bè</h3>                    <ul>                      <li><a href="#">Contact Us</a></li>                      <li><a href="#">Contact Us</a></li>                      <li><a href="#">Contact Us</a></li>                      <li><a href="#">Contact Us</a></li>                      <li><a href="#">Contact Us</a></li>                      <li><a href="#">Contact Us</a></li>                      <li><a href="#">Contact Us</a></li>                    </ul>                </div>             </div>            
                            </div>    </div></div>
<div class="footerLegal">    <div class="pageWidth">        <div class="pageContent">            <div id="copyright">Diễn đàn sử dụng XenForo™ ©2011 XenForo Ltd.</div>            
            <ul id="legal">

                                    <xen:if is="{$canChangeStyle} OR {$canChangeLanguage}">            <li class="choosers">                <xen:if is="{$canChangeStyle}">                                        <dd><a href="{xen:link 'misc/style', '', 'redirect={$requestPaths.requestUri}'}" class="OverlayTrigger Tooltip" title="{xen:phrase style_chooser}" rel="nofollow">{$visitorStyle.title}</a></dd>                </xen:if>                <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>            </xen:if>            
                            <li><a href="help/terms">Quy định và Nội quy</a></li>                                        </ul>                                                <xen:if is="{$debugMode}">                <xen:if hascontent="true">                    <dl class="pairsInline" title="{$controllerName}-&gt;{$controllerAction}{xen:if $viewName, ' ({$viewName})'}">                    <xen:contentcheck>                        <xen:if is="{$page_time}"><dt>{xen:phrase timing}:</dt> <dd><a href="{$debug_url}">{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>

tiếp tục vào css footer.css thay toàn bộ thành
HTML Code:

#footer { clear: both; min-height: 100px; padding: 20px 0 25px;}
.footer {    background: #1d1e22 url(http://muare5s.com/data/images/footer_bg.png) repeat-x top center;    clear: both;    margin-top: 10px;}
.footercolumns {    display: inline;    margin-left: 0;    margin-right: 0;}
.footer-top-left {    float: left;    width: 440px;    margin-top: 18px;    padding-left: 10px;}
.footer-top-left .block-top {    padding-bottom: 8px;}
.footer-top-left .block-bottom {    float: left;    margin-right: 15px;    border-bottom: 1px dotted #c8c8c8;    padding-bottom: 10px;    margin-bottom: 8px;}
.footer-top-left .block-bottom span {    color: #fff;    display: block;    font-size: 12px;    text-transform: uppercase;    margin-bottom: 9px;}
.footer-top-left .block-bottom p {    color: #646464;    font-size: 12px;    margin-bottom: 0px;}
.footer-top-left .connect-face p {    font-size: 16px;    color: #fff;    text-transform: uppercase;    font-weight: 400;    font-style: normal;    float: left;    margin-top: 9px;}
.connect-face ul li {    float: left;    padding-left: 10px;    display: inline;}
.fotter-contact {    float: left;    width: 140px;    min-height: 174px;    border-left: 1px dotted #c8c8c8;    margin-top: 20px;    padding-left: 21px;    padding-right: 16px;}
#footer h3 {    color: #fff;    font-family: 'MyriadProRegular';    font-size: 16px;    text-transform: uppercase;    font-weight: 400;    padding-bottom: 11px;}
.fotter-contact p {    color: #646464;    font-size: 12px;    padding-bottom: 5px;    margin-bottom: 0px;}
.fotter-contact a {    font-size: 11px;    color: #0daaac;    text-decoration: none;    padding-bottom: 8px;    display: inline-block;}
#footer .four.columns.column {    float: left;    width: 135px;    min-height: 174px;    border-left: 1px dotted #c8c8c8;    margin-top: 20px;    padding-left: 20px;    padding-right: 15px;}
#footer .column ul li {}
#footer .column a {    color: #646464;    font-size: 12px;    text-decoration: none;}
#footer .three.columns.column {    float: left;    width: 165px;    min-height: 174px;    border-left: 1px dotted #c8c8c8;    margin-top: 20px;    margin-bottom: 10px;    padding-left: 20px;    padding-right: 15px;}.footer .pageContent{    font-size: 11px;color: #a5cae4;overflow: hidden;zoom: 1;
}        .footer a,    .footer a:visited    {        color: #a5cae4;padding: 5px;display: block;
    }            .footer a:hover,        .footer a:active        {            color: #d7edfc;
        }
    .footer .choosers    {        padding-left: 5px;float: left;overflow: hidden;zoom: 1;
    }            .footer .choosers dt        {            display: none;        }                .footer .choosers dd        {            float: left;                    }            .footerLinks    {        padding-right: 5px;float: right;overflow: hidden;zoom: 1;  } .footerLinks li { float: left; } .footerLinks a.globalFeed { width: 14px; height: 14px; display: block; text-indent: -9999px; white-space: nowrap; background: url('styles/default/xenforo/xenforo-ui-sprite.png') no-repeat -112px -16px; padding: 0; margin: 5px; }.footerLegal {background: #1d1e22;}.footerLegal .pageContent{ font-size: 12px; overflow: hidden; zoom: 1; padding: 10px 0 10px; text-align: center;}.footerLegal .pageContent a:link {color: #d7edfc;} #copyright {        color: rgb(100,100,100); float: left; } #legal { float: right; } #legal li { float: left; margin-left: 10px; }

save lại, done