Chào Alucar , Huynh cho đệ xin cái footer của vxf được không

Thảo luận trong 'Style & Template Questions' bắt đầu bởi okok, 25/9/14.

1votes
5/5, 1 vote

  1. okok

    okok Member

    Bài viết:
    120
    Likes :
    19
    Như tiêu đề mình cũng đã nói rõ rồi .
    Hay bạn nào có xin chia sẻ inbox mình với nhé.
    Thân !

    Làm site chơi bời thôi, không cạnh tranh với anh em đâu, kkkk
    footer
     
    okok, 25/9/14
    #1
    nhouong9x thích bài này.
    Bài viết cũ hơn
    Bài viết mới hơn
    Đang tải...
    Recommended:X
  2. blaysku

    blaysku Member

    Bài viết:
    230
    Likes :
    95
    cái footer toàn html dễ lấy mà bạn, cần gì xin ai
     
    blaysku, 25/9/14
    #2
  3. okok

    okok Member

    Bài viết:
    120
    Likes :
    19
    Mình bị kẹt css, hix help me
     
    okok, 25/9/14
    #3
  4. okok

    okok Member

    Bài viết:
    120
    Likes :
    19
    Vxf thấy nhiều anh chị em pro nhiệt tình lắm mà, Giúp đỡ tý nhé, hhiihi
     
    okok, 25/9/14
    #4
  5. bibiduy

    bibiduy Member

    Bài viết:
    511
    Likes :
    59
    up cho thớt $-)
     
    bibiduy, 25/9/14
    #5
    okok thích bài này.
  6. okok

    okok Member

    Bài viết:
    120
    Likes :
    19
    Hình như Admin và các mod không có hứng thú nhỉ
     
    okok, 25/9/14
    #6
  7. bibiduy

    bibiduy Member

    Bài viết:
    511
    Likes :
    59
    bibiduy, 25/9/14
    #7
    okok thích bài này.
  8. okok

    okok Member

    Bài viết:
    120
    Likes :
    19
    Bạn nào có hứng không, giup mình với, mình gửi phí tiền máy lạnh nhá, kkk
     
    okok, 25/9/14
    #8
  9. okok

    okok Member

    Bài viết:
    120
    Likes :
    19
    okok, 25/9/14
    #9
  10. piggy001

    piggy001 Member

    Bài viết:
    129
    Likes :
    44
    Đây bạn nhé

    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">Diễn đàn sử dụng XenForo&trade; &copy;2011 XenForo Ltd.

            </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}-&gt;{$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>
    CSS nhé:
    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%;
}
     
    piggy001, 25/9/14
    #10
    okok thích bài này.
  11. bibiduy

    bibiduy Member

    Bài viết:
    511
    Likes :
    59
    đây bác code của bác vbt.dongnguyen
    footer
    Mã:
    <xen:edithint template="footer.css" />

<footer class="websiteFooter">
<div id="ribbon"></div>
    <section class="footerContent">
      <div class="shortInfo border-2">
      <h4><i class="icon icon-search"></i> Từ khóa</h4>
          <li><a href="tags/miễn+phí/">Miễn phí</a></li>
          <li><a href="tags/phần+mềm/">Phần mềm</a></li>
         <li><a href="tags/facebook/">Facebook</a></li>
         <li><a href="tags/thủ+thuật/">Thủ thuật</a></li>
         <li><a href="tags/windows/">Windows</a></li>
      </div>
      <div class="shortInfo">
      <h4><i class="icon icon-link"></i> Liên kết</h4>
      <li><a href="http://blendviet.net" title="Diễn đàn Blend" target="_blank">Diễn đàn Blend</a></li>
      <li><a href="members/bibiduy/">Liên hệ</a></li>
      </div>
      <ul class="socialIcons">
         <li><a href="https://www.youtube.com/channel/UCgK1C1Rd4BGStiDMJr8cBng/videos"><i class="icon icon-youtube-sign"></i></a></li>
        <li><a href="https://google.com.vn"><i class="icon icon-google-plus-sign"></i></a></li>
        <li><a href="https://www.facebook.com/diendandesignwedding"><i class="icon icon-facebook-sign"></i></a></li>
        <li><a href="https://twitter.com/"><i class="icon icon-twitter-sign"></i></a></li>
        <li><a href="members/bibiduy/"><i class="icon icon-phone-sign"></i></a></li>
      </ul>
      <div class="footer-row2 clearfix">
                <p class="disclaimer">
                    © 2014 design-wedding.com.<br>
                    Diễn đàn được xây dựng dựa trên mã nguồn Xenforo.<br>
                    Website đang hoạt động thử nghiệm. Chờ giấy phép MXH/TTDT của bộ TT&TT.
                  
                </p>
                  
            </div>
    </section>

  </footer>
  <a href="/#" title="Back to top" class="back-to-top">↑ Back to Top</a>
        <script>          
            jQuery(document).ready(function() {
                var offset = 220;
                var duration = 500;
                jQuery(window).scroll(function() {
                    if (jQuery(this).scrollTop() > offset) {
                        jQuery('.back-to-top').fadeIn(duration);
                    } else {
                        jQuery('.back-to-top').fadeOut(duration);
                    }
                });
              
                jQuery('.back-to-top').click(function(event) {
                    event.preventDefault();
                    jQuery('html, body').animate({scrollTop: 0}, duration);
                    return false;
                })
            });
        </script>

    footer.css
    Mã:
    .back-to-top {
    position: fixed;
    bottom: 2em;
    right: 0px;
    text-decoration: none;
    color: #fff;
    background-color: #90001B;
    font-size: 12px;
    padding: 1em;
    display: none;
    transition: all 0.5s ease 0s;
        }
a.back-to-top {

    text-decoration: none;
    color: #fff;


        }
a.back-to-top:hover {   
    background-color: rgba(135, 135, 135, 0.50);
    text-decoration: none;
        }   
.websiteFooter:hover #ribbon {
    transition: #000 5s ease 0s;
    background-position: 615px bottom;
    height: 3px;
}
#ribbon {
    height: 0px;
    background-color: rgba(221, 60, 77, 0.95);
    background-image: -moz-linear-gradient(left center , #E75239 0%, #E75239 12.5%, #FF961C 12.5%, #FF961C 25%, #FFCC27 25%, #FFCC27 37.5%, #FCE62F 37.5%, #FCE62F 50%, #CDE35B 50%, #CDE35B 62.5%, #82CC33 62.5%, #82CC33 75%, #41BECE 75%, rgb(65, 190, 206) 87.5%, rgb(4, 156, 219) 87.5%, rgb(4, 156, 219) 100%);
    background-position: 50% 0px;
    box-shadow: 0px 1px 2px rgba(0, 0, 0, 0.063) inset;
    z-index: 99999;
    width: 100%;
    -bottom: 0px;
    left: 0px;
    position: absolute;
    transition: #000 0.5s ease 0s;
}
.websiteFooter {
    width: 100%;
    -float: left;
    clear: both;
    background: none repeat scroll 0% 0% #384452;
    transition: all 0.5s ease 0s;
    -border-top: 4px solid #03AAAA;
}
.websiteFooter .footerContent:after {
    clear: both;
}
.websiteFooter .footerContent:before, .websiteFooter .footerContent:after {
    content: " ";
    display: table;
}
.websiteFooter .footerContent {
    margin: 0px auto;
    width: 100%;
    max-width: 980px;
    padding: 40px 0px 10px 0px;
}
.websiteFooter .footerContent .shortInfo {
    float: left;
    width: 180px;
    -font-family: "museo-sans",sans-serif;
    color: #687788;
    line-height: 1.35em;
}
.shortInfo h4 {
    -font-family: "Droid Sans",Arial,"Times New Roman",Times,serif;
    font-weight: 700;
    text-transform: capitalize;
    text-shadow: -1px -1px #050D16;
    color: #ECECEC;
    font-size: 1.45em;
    margin: 0px 0px 5px 0px;
}
.websiteFooter .footerContent a:hover {
    color: #fff;
    -font-weight: 700;
    text-decoration: none;
}
.websiteFooter .footerContent a {
    color: #999;
    font-size: 11px;
    -font-weight: 700;
    text-decoration: none;
    -padding-left: 4px;
    transition: all 0.25s ease 0s;
}
.websiteFooter .footerContent .socialIcons {
    float: right;
    -width: 50%;
}
ol, ul {
    list-style: none outside none;
}
.websiteFooter .footerContent .socialIcons li {
    float: right;
    margin: 0px 0px 0px 10px;
}
.websiteFooter .footerContent .socialIcons li a {
    float: left;
    display: block;
    height: 100%;
}
.websiteFooter .footerContent .socialIcons li a .icon {
    -border-radius: 80px;
    font-size: 30px;
    border: 2px solid #272F38;
    text-align: center;
    padding: 18px;
    float: left;
    display: block;
    color: #FFF;
    background: none repeat scroll 0% 0% #272F38;
    transition: all 0.25s ease 0s;
    text-decoration: none;
}
.websiteFooter .footerContent .socialIcons li:hover .icon {
    border: 2px solid #FFF;
}
.footer-row2 {
    border-top: 1px solid #1F1F1F;
    padding: 10px 0px;
    width: 980px;
    margin: 10px auto;
    float: left;
}
.footer-row2 p.disclaimer {
    display: block;
    font-size: 0.9em;
    -width: 450px;
    line-height: 1.25em;
    color: #999;
    float: left;
    padding-bottom: 20px;
}
.footer-row2 p.disclaimer:hover {
color: #fff;
}
.footer-row2 p.endofpage-btt {
    display: block;
    float: right;
}
.border-2 {
    border-right: 1px solid #d1d1d1;
    margin-right: 10px;
    }
     
    bibiduy, 25/9/14
    #11
  12. okok

    okok Member

    Bài viết:
    120
    Likes :
    19


    Cám ơn bạn nhé
     
    okok, 25/9/14
    #12
comments powered by Disqus
: xin footer

Chia sẻ trang này

Đang tải...