Other Share footer FIFAVN.ORG Full Responsive

[hardcore]

Xin phép bác @Cyentruk em share footer của site bác . Hôm nay, em xin share cho mọi người footer của site FiFaVN.ORG của bác @Cyentruk.
Demo : FiFaVN.ORG
Vào vấn đề luôn. Đầu tiên các bạn thay toàn bộ template footer bằng toàn bộ code sau đây :

<xen:edithint template="footer.css" />

<xen:hook name="footer">

<div class="footer">
<div class="pageContent">
<span class="fifavn-footer-arrow"></span>
<div class="fifavn-footer">
<p class="slogan">WE ARE FIFAVN!</p>
<p class="description">"Vietnamese FIFA Community - Sweet home of FIFA fan in Vietnam"</p>
<div class="box">
<h2 class="title">FIFAVN</h2>
<div class="content">
<li><a href="http://fifavn.org/forum/articles/">Home</a></li>
<li><a href="">Forum</a></li>
<li><a href="http://fifavn.org/forum/resources/">Resources</a></li>
<li><a href="http://fifavn.org/forum/media/">Media</a></li>
</div>
</div>
<div class="box">
<h2 class="title">Official Links</h2>
<div class="content">
<li><a href="http://www.easports.com/uk/fifa" target="_blank">EA Sports FIFA</a></li>
<li><a href="https://www.easports.com/fifa/pro-clubs" target="_blank">Pro Clubs</a></li>
<li><a href="https://www.easports.com/fifa/ultimate-team/web-app" target="_blank">FUT Web App</a></li>
<li><a href="http://help.ea.com/en/" target="_blank">EA Help</a></li>
</div>
</div>
<div class="box">
<h2 class="title">Follow Us</h2>
<div class="content">
<li><a href="https://www.facebook.com/fifavnorg" target="_blank">Facebook</a></li>
<li><a href="https://twitter.com/fifavn" target="_blank">Twitter</a></li>
<li><a href="https://plus.google.com/101966557404186061596/posts" target="_blank">Google Plus</a></li>
<li><a href="http://www.youtube.com/fifavntv" target="_blank">Youtube</a></li>
</div>
</div>
</div>
<div class="footerLegal">
<div class="fifavn-footer-inner">

<xen:if is="{$canChangeStyle} OR {$canChangeLanguage}">
<dl class="choosers">
<xen:if is="{$canChangeStyle}">
<dt>{xen:phrase style}</dt>
<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}">
<dt>{xen:phrase language}</dt>
<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>
</dl>
</xen:if>

<div id="copyright">{xen:helper copyright} {xen:phrase extra_copyright}</div>
<ul class="footerLinks">
<xen:hook name="footer_links">
<xen:if is="{$xenOptions.contactUrl.type} === 'default'">
<li><a href="{xen:link 'misc/contact'}" class="OverlayTrigger" data-overlayOptions="{&quot;fixed&quot;:false}">{xen:phrase contact_us}</a></li>
<xen:elseif is="{$xenOptions.contactUrl.type} === 'custom'" />
<li><a href="{$xenOptions.contactUrl.custom}" {xen:if {$xenOptions.contactUrl.overlay}, 'class="OverlayTrigger" data-overlayOptions="{&quot;fixed&quot;:false}"'}>{xen:phrase contact_us}</a></li>
</xen:if>
<li><a href="{xen:link help}">{xen:phrase help}</a></li>
<xen:if is="{$homeLink}"><li><a href="{$homeLink}" class="homeLink">{xen:phrase home}</a></li></xen:if>
<li><a href="{$requestPaths.requestUri}#navigation" class="topLink">{xen:phrase go_to_top}</a></li>
<li><a href="{xen:link forums/-/index.rss}" rel="alternate" class="globalFeed" target="_blank"
title="{xen:phrase rss_feed_for_x, 'title={$xenOptions.boardTitle}'}">{xen:phrase rss}</a></li>
</xen:hook>
</ul>
<span class="helper"></span>
</div>
</div>
</div>
</div>
</xen:hook>

Thay toàn bộ template footer.css bằng code sau đây :

.footer {
margin: 0 auto;
background: rgb(33, 33, 33);
border-top: 10px solid rgb(7, 91, 127)
}

.footer .pageContent {
background: none!important;
font-size: 1em;
padding: 10px 0
}

.fifavn-footer-arrow {
border-color: rgb(250, 250, 250) transparent transparent;
border-style: solid;
border-width: 30px 30px 0;
display: block;
height: 0;
left: 0;
right: 0;
margin: -20px auto;
position: absolute;
width: 0
}

.fifavn-footer {
margin: 0 auto;
max-width: 1202px
}

.fifavn-footer .box {
float: left;
margin: 0 0 15px;
padding: 4%;
width: 25%
}

.fifavn-footer .slogan {
color: rgb(255, 255, 255);
font-size: 3em;
font-weight: 700;
margin-top: 50px;
text-align: center
}

.fifavn-footer .description {
color: #aaa;
font-size: 1.15em;
margin-top: 20px;
text-align: center
}

.fifavn-footer .title {
color: rgb(7, 91, 127);
font-size: 1.3em;
font-weight: 700;
margin-bottom: 20px
}

.fifavn-footer li {
border-top: 1px dotted rgb(128, 128, 128);
list-style-type: none;
margin: 15px 0 0;
padding: 15px 0 0
}

.fifavn-footer a {
color: #aaa !important;
padding: 0
}

.fifavn-footer-inner {
margin: 0 auto;
padding: 10px 0;
width: 1002px
}

.footer .footerLegal {
border-top: 1px solid rgb(128, 128, 128);
clear: both
}

.footerLegal .pageContent {
padding: 0
}

.footer a:hover {
color: rgb(7, 91, 127)!important
}
.footer .pageContent {
font-size: 11px;
color: rgb(128, 128, 128);
background-color: rgb(7, 91, 127);
overflow: hidden;
zoom: 1
}

.footer a,
.footer a:visited {
color: rgb(128, 128, 128);
padding: 5px;
display: block
}

.footer a:hover,
.footer a:active {
color: rgb(214, 214, 214)
}

.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 .pageContent {
font-size: 11px;
overflow: hidden;
zoom: 1;
padding: 5px 5px 15px;
text-align: center
}

#copyright {
display: none
}

#legal {
float: right
}

#legal li {
float: left;
margin-left: 10px
}

@media (max-width:610px) {
.Responsive .footerLinks a.globalFeed,
.Responsive .footerLinks a.topLink,
.Responsive .footerLinks a.homeLink {
display: none
}
.Responsive .footerLegal .debugInfo {
clear: both
}
}

@media (max-width:480px) {
.Responsive #copyright span {
display: none
}
.Responsive .fifavn-footer .box {
width: 92%
}
}

Do là code mình rip nên có thể còn có lỗi.

Mong các bạn giúp mình hoàn thiện code nếu có thể !​

 

[Cyentruk]

Hay!!! Mai mình rảnh sẽ chia sẻ với ae 1 vài tip trong lúc mình làm cái footer này.

Tip sẽ nói về việc sử dụng phrase thay cho 1 cụm từ cố định để nó có thể chuyển đổi theo ngôn ngữ mà người dùng lựa chọn sử dụng trên diễn đàn. Về cách sử dụng color template để khi chuyển màu tổng thể forum chỉ với 1 vài click chuột mà ko phải sửa lại các custom template. Và về cách làm responsive nữa. Mình biết gì chia sẻ nấy nha. :v

 

[dcstylexf]

Hay!!! Mai mình rảnh sẽ chia sẻ với ae 1 vài tip trong lúc mình làm cái footer này.

Tip sẽ nói về việc sử dụng phrase thay cho 1 cụm từ cố định để nó có thể chuyển đổi theo ngôn ngữ mà người dùng lựa chọn sử dụng trên diễn đàn. Về cách sử dụng color template để khi chuyển màu tổng thể forum chỉ với 1 vài click chuột mà ko phải sửa lại các custom template. Và về cách làm responsive nữa. Mình biết gì chia sẻ nấy nha. :v

ngon ạ :3

 

[namhbnam]

không hiểu sao web em thay footer nó không hiện mà mất luôn, buồn quá.
http://hnvautopro.com/

 

[Win]

Hi ....

please help this error? line NO. 44 sytex error ?

thks

 

[hardcore]

Chiều nay mình sẽ teamviewer giúp các bạn @Win @namhbnam. Các bạn inb mình id+pass team nhé

 

[namhbnam]

Chiều nay mình sẽ teamviewer giúp các bạn @Win @namhbnam. Các bạn inb mình id+pass team nhé

ok anh, cám ơn anh trước. tí về e ib.

 

[namhbnam]

hix giờ mới được về nhà, bác lúc nào onl pm lại e nhé (

 

[hardcore]

@namhbnam I'm here

 

[namhbnam]

e đã gửi team rồi đó, a check ib

 

[hardcore]

Code mình mới cập nhật lại mọi người check giúp mình nhé