[Skin] Chia sẻ skin cover từ Github cho version Punbb.

  • Móm Đặc Biệt
    1. [Skin] Chia sẻ skin cover từ Github cho version Punbb.
    avatar S-MOD
    Skin này mình chôm của Github, vừa rip vừa convert sang dạng diễn đàn, bác nào muốn xài thì lấy xài nhé.
    Mình làm theo kiểu tắt hết CSS mặc định của fm nên bác nào xài cũng phải tắt nhé Very Happy

    Demo ảnh


    Demo online

    Code:
    http://huudang8.forumvi.com/

    Hướng dẫn

    ACP >> Display >> Colors >> CSS
    Thay toàn bộ thành:
    Code:
    /* All */
    *{margin:0;padding:0}
    *,:before,:after{box-sizing:border-box;-o-box-sizing:border-box;-ms-box-sizing:border-box;-moz-box-sizing:border-box;-webkit-box-sizing:border-box}
    .clearfix:after{display:block;visibility:hidden;height:0;clear:both;font-size:0;content:" "}
    body{font-size:14px;font-family:Roboto,arial,sans-serif;background:#eaeaea;color:#333;line-height:1.42857143}
    .pun.limit-width{position:relative;margin-top:-60px}
    li{list-style:none}
    a{color:#6ba65e;text-decoration:none}
    h1,h2,h3,h4,h5,h6{font-size:14px}
    fieldset{border:0}
    fieldset.frm-set dl dt{padding:0 0 5px;font-weight:700}
    fieldset.frm-set dl dd{padding:0 0 10px}
    fieldset.frm-set .frm-buttons dd{padding:10px 0 0}
    .frm_connexion dl:last-child dd{padding:0}
    .frm-buttons{text-align:center}
    .frm-buttons.left{float:none}
    select,input{outline:0}
    select,input[type=password],input[type=search],input[type=text]{border:1px solid #e4e4e4;padding:15px;width:100%;height:50px}
    textarea{border:1px solid #e7e7e7;padding:10px;width:100%;border-radius:3px}
    input[type="submit"]{background:#6ba65e;padding:15px 30px;border:0;color:#fff;height:50px;text-transform:uppercase;line-height:24px}
    input[type="checkbox"],input[type="radio"]{margin:0 0 1px;vertical-align:middle}
    .limit-width{max-width:1160px;margin:0 auto;padding:0 20px}
    .left{float:left}
    .right{float:right}
    .center{text-align:center}
    .side-col{padding-left:340px;width:100%;background:#f0f0f0;box-shadow:rgba(0,0,0,.098) 0 1px 1px 0;-o-box-shadow:rgba(0,0,0,.098) 0 1px 1px 0;-ms-box-shadow:rgba(0,0,0,.098) 0 1px 1px 0;-moz-box-shadow:rgba(0,0,0,.098) 0 1px 1px 0;-webkit-box-shadow:rgba(0,0,0,.098) 0 1px 1px 0}
    .col-right{background:#fff;width:100%}
    .col-left{width:340px;position:relative;margin-left:-340px}
    .main{padding:30px;border-bottom:1px solid #eee}
    .main-head{padding:0 0 15px;text-transform:uppercase}
    .main-head h2{font-size:16px;font-weight:400}
    .tips-yellow,.frm-info{color:#888;padding:10px;border:1px solid #f2c779;background:#fffce2;margin:0 0 10px}
    .tips-yellow .fa:before{color:#f2c779;content:"\f071";padding-right:10px}
    .tips-green{color:#8fad3d;padding:10px;border:1px solid #8fad3d;background:#eef4d4;margin:0 0 10px}
    .tips-green .fa:before{content:"\f00c";padding-right:10px}
    .tips-red{color:#bf1515;padding:10px;border:1px solid #bf1515;background:#fdb7b7;margin:0 0 10px}
    .tips-red .fa:before{content:"\f05e";padding-right:10px}
    .ads728 img,.ads250 img,.ads1000 img{width:100%;margin:0 0 10px}
    .ads250 a:last-child img{margin:0}
    /* Hide */
    #content>#main>#main-content>div:first-child{display:none!important}
    #pun-visit,.pun-crumbs,div[style="height:3px"],div[style="overflow:visible"],.admin-link strong br,.box-user br,.paging a[href="javascript:Pagination();"],.acp-list a[href="faq.php"],.frm-buttons dt,.frm_connexion dl:last-child dt,#cont_pwd{display:none}
    /* Transition */
    a,.nav-sub > ul{transition:all 225ms ease;-o-transition:all 225ms ease;-ms-transition:all 225ms ease;-moz-transition:all 225ms ease;-webkit-transition:all 225ms ease}
    /* Header */
    #header{background:#26272b;position:relative;padding:0 0 60px}
    .header-top{padding:30px;text-align:center}
    .nav-top{padding:0 15px;background:#33363b;box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 -1px 0 rgba(0,0,0,.2),inset 1px 0 0 rgba(0,0,0,.2),inset -1px 0 0 rgba(0,0,0,.2);-o-box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 -1px 0 rgba(0,0,0,.2),inset 1px 0 0 rgba(0,0,0,.2),inset -1px 0 0 rgba(0,0,0,.2);-ms-box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 -1px 0 rgba(0,0,0,.2),inset 1px 0 0 rgba(0,0,0,.2),inset -1px 0 0 rgba(0,0,0,.2);-moz-box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 -1px 0 rgba(0,0,0,.2),inset 1px 0 0 rgba(0,0,0,.2),inset -1px 0 0 rgba(0,0,0,.2);-webkit-box-shadow:inset 0 1px 0 rgba(255,255,255,.05),0 -1px 0 rgba(0,0,0,.2),inset 1px 0 0 rgba(0,0,0,.2),inset -1px 0 0 rgba(0,0,0,.2)}
    .nav-top ul li{position:relative;float:left}
    .nav-top ul li a{line-height:20px;padding:15px;font-size:16px;display:block;text-shadow:0 1px rgba(0,0,0,.2);color:rgba(255,255,255,.7)}
    .nav-top ul li a:hover,.nav-top ul li a:focus{color:#fff;background:rgba(0,0,0,.1)}
    .search-form{position:relative;margin:5px 0}
    .search-form .search-input{height:40px;padding:10px 53px 10px 15px;border:0}
    .search-form .search-btn{position:absolute;right:2px;height:36px;line-height:6px;width:36px;padding:10px;top:2px}
    /* Side bar */
    .user-menu{background:#6ba65e;padding:15px 30px;font-size:16px;text-transform:uppercase;line-height:30px;color:rgba(255,255,255,.8);font-weight:700}
    .user-menu a{color:rgba(255,255,255,.8)}
    .user-menu i{font-size:28px;padding-left:15px}
    .side-content{position:relative;border-bottom:1px solid #e4e4e4;padding:30px}
    .side-title{padding:0 0 15px;text-transform:uppercase;font-size:16px}
    .avtuser{width:104px;height:104px;float:left;margin-right:15px;padding:3px;border:1px solid #e7e7e7;background:#fff}
    .avtuser img{max-width:100%;max-height:100%}
    .stats a.tenthanhvien{font-size:18px;font-weight:700;display:block}
    .user-type{overflow:hidden;color:#888}
    .user-type dt{float:left}
    .user-type dd{float:right;font-weight:700}
    .user-option,.stats{line-height:26px}
    .user-option li .fa{margin-right:15px}
    /* Đăng nhập */
    .log-item{margin:0 0 15px}
    .log-item.input input,.log-item.input{display:table;width:100%}
    .log-item span.input-icon{width:50px;white-space:nowrap;vertical-align:middle;display:table-cell;padding:15px;text-align:center;background:#f4f4f4;border:1px solid #e4e4e4;border-width:1px 0 1px 1px;font-size:18px}
    .log-item input[type="submit"]{width:100%}
    /* Box */
    .main.index-box{padding-bottom:0}
    .table-box{margin-left:-30px}
    .box-content{width:50%;padding-left:30px;float:left;margin:0 0 30px}
    .box-all{background:#f4f4f4;color:#888}
    .icon-box{position:absolute;text-align:center;width:52px;left:15px;height:52px;background:#6ba65e;border-radius:50%}
    .icon-box .fa:before{color:#fff;content:"\f086";font-size:25px;line-height:52px}
    .box-info{padding:15px 15px 15px 82px;border-bottom:1px solid #e7e7e7;line-height:26px;position:relative}
    .box-name h3{font-size:18px}
    .count-itemt{margin-right:15px}
    .box-last{padding:15px;line-height:26px}
    .box-avatar{float:left;width:52px;height:52px;margin-right:15px;padding:2px;background:#fff;border:1px solid #e7e7e7}
    .box-avatar img{max-width:100%;max-height:100%}
    .box-user strong{margin-right:3px;max-width:115px;overflow:hidden;text-overflow:ellipsis;float:left}
    /* Điều hướng */
    .crumbs{border-bottom:1px solid #eee;height:60px;color:#666;font-size:0;line-height:30px;font-weight:700;text-transform:uppercase}
    .crumbs a{display:inline-block;padding:15px 30px;color:#aaa;font-size:16px;position:relative}
    .crumbs a:before,.crumbs a:after{content:" ";border:30px solid transparent;border-left-width:15px;border-right:0;border-left-color:#fff;position:absolute;right:-6px;top:0;z-index:10}
    .crumbs a:after{border-left-color:#e7e7e7;right:-7px;z-index:5}
    /* Footer */
    #pun-foot{background:#33363b;margin-top:60px;color:#aaa;line-height:1.6em;text-align:center}
    #footer{padding:30px}
    #footer a{color:#fff}
    .footer-logo{margin-bottom:15px}
    #pun-foot #back-to-top{background:#eaeaea;color:#777;overflow:hidden;text-align:center;width:60px;height:30px;display:block;margin:0 auto -30px;border-radius:0 0 3px 3px;box-shadow:0 1px 1px rgba(0,0,0,.1);-o-box-shadow:0 1px 1px rgba(0,0,0,.1);-ms-box-shadow:0 1px 1px rgba(0,0,0,.1);-moz-box-shadow:0 1px 1px rgba(0,0,0,.1);-webkit-box-shadow:0 1px 1px rgba(0,0,0,.1)}
    #pun-foot #back-to-top i{font-size:38px;line-height:22px}
    #pun-foot #back-to-top:hover{color:#444}

    CSS options:
    Deactivate the basic CSS: Chọn

    ACP >> Display >> Template >> QLTT
    Thay toàn bộ từng template tương ứng

    Index_Body:
    Code:
    {JAVASCRIPT}

    <!-- BEGIN message_admin_index -->
    <div class="main">
       <!-- BEGIN message_admin_titre -->
       <div class="main-head">
          <h1 class="page-title">{message_admin_index.message_admin_titre.MES_TITRE}</h1>
       </div>
       <!-- END message_admin_titre -->

       <!-- BEGIN message_admin_txt -->
       <div id="pun-announcement">
          <p>{message_admin_index.message_admin_txt.MES_TXT}</p>
       </div>
       <!-- END message_admin_txt -->
    </div>
    <!-- END message_admin_index -->

    <!-- BEGIN switch_user_login_form_header -->
    <div class="main">
    <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
       <div class="user_login_form main-box center">
          <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username" /></label> &nbsp;
          <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password" /></label> &nbsp;
          <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label> &nbsp;
          {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />

            <!-- BEGIN switch_social_login -->
            <div class="mt10">
                <div class="social_btn">
                    <!-- BEGIN fb_connect -->
                    <div class="fb-login-button"></div>
                    <!-- END fb_connect -->
                    &nbsp;
                    <!-- BEGIN topicit_connect -->
                    <div class="ti-connect"></div>
                    <!-- END topicit_connect -->
                </div>
            </div>
            <!-- END switch_social_login -->
       </div>
    </form>
    </div>
    <!-- END switch_user_login_form_header -->

    {CHATBOX_TOP}
    {BOARD_INDEX}

    <!-- BEGIN disable_viewonline -->
    <div id="pun-info" class="main">
      <div class="main-head">Thống kê diễn đàn</div>
       <div class="main-content">
          <div id="stats">
             <p class="right">{TOTAL_POSTS}</p>
             <p>{TOTAL_USERS}</p>
             <p>{NEWEST_USER}</p>
          </div>
          <div id="onlinelist">
             <img src="{L_ONLINE_IMG}" alt="{L_WHO_IS_ONLINE}" />
             <p class="right">
                <!-- BEGIN switch_viewonline_link -->
                <a href="{U_VIEWONLINE}" rel="nofollow">{L_WHO_IS_ONLINE}</a>
                <!-- END switch_viewonline_link -->
                <!-- BEGIN switch_viewonline_nolink -->
                {L_WHO_IS_ONLINE}
                <!-- END switch_viewonline_nolink -->
             </p>
             <p>{TOTAL_USERS_ONLINE}<br />
             {RECORD_USERS}

             <br />
             {LOGGED_IN_USER_LIST}

             {L_ONLINE_USERS}
             {L_CONNECTED_MEMBERS}<br />
             {L_WHOSBIRTHDAY_TODAY}{L_WHOSBIRTHDAY_WEEK}</p>
             <div class="clear"></div>

             <p>{LEGEND}&nbsp;:&nbsp;{GROUP_LEGEND}</p>

          </div>
          <!-- BEGIN switch_chatbox_activate -->
          <div id="onlinechat">
             <p class="page-bottom">
             {TOTAL_CHATTERS_ONLINE}&nbsp;:&nbsp;
             {CHATTERS_LIST}<br />
             <!-- BEGIN switch_chatbox_popup -->
                <div id="chatbox_popup"></div>
                <script type="text/javascript">
                   insertChatBoxPopup('{disable_viewonline.switch_chatbox_activate.switch_chatbox_popup.U_FRAME_CHATBOX}', '{L_CLICK_TO_JOIN_CHAT}');
                </script>
             <!-- END switch_chatbox_popup -->
             </p>
          </div>
          <!-- END switch_chatbox_activate -->
       </div>
    </div>
    <!-- END disable_viewonline -->

    <!-- BEGIN switch_user_login_form_footer -->
    <form action="{S_LOGIN_ACTION}" method="post" name="form_login">
       <div class="user_login_form main-box center">
          <label><span class="genmed">{L_USERNAME} :</span> <input class="post" type="text" size="10" name="username"/></label> &nbsp;
          <label><span class="genmed">{L_PASSWORD} :</span> <input class="post" type="password" size="10" name="password"/></label> &nbsp;
          <label><span class="gensmall">{L_AUTO_LOGIN}</span> <input class="radio" type="checkbox" name="autologin" {AUTOLOGIN_CHECKED} /></label> &nbsp;
          {S_HIDDEN_FIELDS}<input class="mainoption" type="submit" name="login" value="{L_LOGIN}" />

            <!-- BEGIN switch_social_login -->
            <div class="mt10">
                <div class="social_btn">
                    <!-- BEGIN fb_connect -->
                    <div class="fb-login-button"></div>
                    <!-- END fb_connect -->
                    &nbsp;
                    <!-- BEGIN topicit_connect -->
                    <div class="ti-connect"></div>
                    <!-- END topicit_connect -->
                </div>
            </div>
            <!-- END switch_social_login -->
       </div>
    </form>
    <!-- END switch_user_login_form_footer -->

    {CHATBOX_BOTTOM}


    {AUTO_DST}

    Index_box:
    Code:
    <!-- BEGIN catrow -->
       <!-- BEGIN tablehead -->
    <div class="main index-box {catrow.tablehead.ID}">
          <div class="main-head">
             <div class="page-title">{catrow.tablehead.L_FORUM}</div>
          </div>
          <div class="main-content">
             <ul class="table-box clearfix">
       <!-- END tablehead -->

       <!-- BEGIN forumrow -->
                   <li class="box-content clearfix">
                                              <div class="box-all">
                                              <div class="box-info">
                                              <div class="icon-box">
                                                <i class="fa"></i>
                                              </div>
                                                <div class="box-name"><h3><a href="{catrow.forumrow.U_VIEWFORUM}}">{catrow.forumrow.FORUM_NAME}</a></h3></div>
                                                <div class="box-count"><span class="count-itemt">Chủ đề: {catrow.forumrow.TOPICS}</span><span class="count-itemt">Bài viết: {catrow.forumrow.POSTS}</span></div>
                                              </div>
                                              <div class="box-last">
                                <!-- BEGIN avatar -->
                                <div class="box-avatar">{catrow.forumrow.avatar.LAST_POST_AVATAR}</div>
                                <!-- END avatar -->
                                                <div class="box-lasttit">
                                                  <!-- BEGIN switch_topic_title -->
                      <a href="{catrow.forumrow.U_LATEST_TOPIC}" title="{catrow.forumrow.LATEST_TOPIC_TITLE}">{catrow.forumrow.LATEST_TOPIC_NAME}</a><br />
                                                  <!-- END switch_topic_title -->
                                                </div>
                                                <div class="box-user">{catrow.forumrow.USER_LAST_POST}</div>
                                              </div>
                                              </div>
                   </li>
       <!-- END forumrow -->

       <!-- BEGIN tablefoot -->
             </ul>
          </div>
    </div>
       <!-- END tablefoot -->
    <!-- END catrow -->

    Overall_footer_begin:
    Code:
    <!-- BEGIN html_validation -->
    <div>
       <div>
          <div>
             <div><div><div>
                <div>
                   <div>
                      <div>
                         <div>
    <!-- END html_validation -->
                         </div>
                      </div>
                   </div>
                </div>
             </div></div></div>
                     
                     
                     
    <div class="col-left left">
    <!-- BEGIN switch_user_logged_out -->
        <div class="user-menu" style="text-align:center">
            <a href="/register">Đăng ký tài khoản</a>
        </div>
        <div class="side-content">
            <div class="side-title">Đăng nhập</div>
            <form action="/login" method="post" name="form_login" class="logpop">
                <div class="login-form">
                    <div class="login-body">
                        <div class="log-item input">
                            <span class="input-icon"><i class="fa fa-user"></i></span>
                            <input name="username" tabindex="1" value="" placeholder="Tên tài khoản" type="text" required="" />
                        </div>
                        <div class="log-item input">
                            <span class="input-icon"><i class="fa fa-lock"></i></span>
                            <input name="password" tabindex="2" value="" maxlength="25" placeholder="Mật khẩu" type="password" required="" />
                        </div>
                        <div class="log-item clearfix">
                            <p class="left">
                                <input type="checkbox" name="autologin" tabindex="3" class="checkbox" checked="checked" /> Ghi nhớ
                            </p>
                            <p class="right"><a href="/profile?mode=sendpassword">Quên mật khẩu?</a></p>
                        </div>
                        <div class="log-item">
                            <input type="submit" name="login" tabindex="4" value="Đăng nhập" />
                            <script type="text/javascript">
                                document.write('<input type="hidden" name="redirect" value="' + location.href + '" />')
                            </script>
                        </div>
                        <p style="text-align:center">Chưa có tài khoản. <a href="/register">Đăng ký ngay!</a></p>
                    </div>
                </div>
            </form>
        </div>
    <!-- END switch_user_logged_out -->
    <!-- BEGIN switch_user_logged_in -->
        <div class="user-menu">
            <span class="tenthanhvien"></span>
            <a href="{U_LOGIN_LOGOUT}" class="right"><i class="fa fa-power-off"></i></a>
            <a href="/privmsg?folder=inbox" class="right"><i class="fa fa-envelope"></i></a>
        </div>
        <div class="side-content">
            <div class="side-title">Thông tin cá nhân</div>
            <div class="userinfo">
                <span class="hienthianh"></span>
                <div class="stats">
                    <span class="tenthanhvien"></span>
                    <dl class="user-type">
                        <dt>Bài viết:</dt>
                        <dd><span class="baiviet"></span> </dd>
                    </dl>
                    <dl class="user-type">
                        <dt>Được thích:</dt>
                        <dd><span class="duoclike"></span> </dd>
                    </dl>
                    <dl class="user-type">
                        <dt>Tiền xu:</dt>
                        <dd><span class="sopoint"></span> </dd>
                    </dl>
                </div>
            </div>
        </div>
        <script type="text/javascript">
            //<![CDATA[
            $(".hienthianh").replaceWith('<a class="avtuser" href="/profile?mode=editprofile&page_profil=avatars" rel="nofollow">' + _userdata.avatar + '</a>');
            $(".tenthanhvien").replaceWith('<a class="tenthanhvien" href="/u' + _userdata.user_id + '" rel="nofollow">' + _userdata.username + '</a>');
            $(".baiviet").replaceWith('' + _userdata.user_posts + '');
            $(".duoclike").replaceWith('' + _userdata.point_reputation + '');
            $('.sopoint').load('/u' + _userdata["user_id"] + ' #field_id-13 .field_uneditable');
            //]]>
        </script>
        <div class="side-content">
            <div class="side-title">Tùy chọn</div>
            <ul class="user-option">
              <li><i class="fa fa-caret-right"></i><a href="/profile?mode=editprofile">Thông tin cá nhân</a></li>
              <li><i class="fa fa-caret-right"></i><a href="/profile?mode=editprofile&page_profil=avatars">Ảnh đại diện</a></li>
              <li><i class="fa fa-caret-right"></i><a href="/profile?mode=editprofile&page_profil=signature">Chỉnh sửa chữ ký</a></li>
              <li><i class="fa fa-caret-right"></i><a href="/profile?change_password=Change+your+password&mode=editprofile&page_profil=informations">Đổi mật khẩu</a></li>
              <li><i class="fa fa-caret-right"></i><a href="/profile?mode=editprofile&page_profil=preferences">Tùy chọn riêng tư</a></li>
              <li><i class="fa fa-caret-right"></i><a href="/search?search_id=watchsearch">Bài viết đang theo dõi</a></li>
              <li><i class="fa fa-caret-right"></i><a href="/search?search_id=favouritesearch">Bài viết yêu thích</a></li>
              <li><i class="fa fa-caret-right"></i><a href="/search?search_id=egosearch">Bài viết của bạn</a></li>
            </ul>
        </div>
    <!-- END switch_user_logged_in -->
    </div>
                     
                     
                     
                     
                     
          </div>
       </div>
    </div>
    <div id="pun-foot">
    <a id="back-to-top" href="#top"><i class="fa fa-angle-up"></i></a>
    <div id="footer" class="limit-width clearfix">
       <div class="footer-logo">
          <a href="/"><img src="https://i62.servimg.com/u/f62/19/03/14/16/mdb110.png" title="Móm Đặc Biệt" alt="Logo footer" /></a>
       </div>
       <div class="footer-text">
          <p>©️ 2018 MĐB - Theme rip by <a target="_blank" href="https://www.facebook.com/momdacbiet">Móm Đặc Biệt</a></p>
       </div>
       <div id="pun-about">
          <ul>
             <li>
    <!-- BEGIN html_validation -->
             </li>
          </ul>
       </div>
    </div>
    </div>
    <!-- END html_validation -->

    Overall_footer_end:
    Code:
    <!-- BEGIN html_validation -->
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <body>
    <div>
       <div>
          <div>
             <div>
                <div>
                   <div>
                      <ul>
                         <li>
    <!-- END html_validation -->
                         </li>
                      </ul>
                      <!-- BEGIN switch_footer_links -->
                      <ul>
                         <li>
                            <!-- BEGIN footer_link -->
                               <!-- BEGIN switch_separator -->&nbsp;|&nbsp;<!-- END switch_separator -->
                               {switch_footer_links.footer_link.FOOTER_LINK_SEPARATOR}<a name="bottom" class="copyright" href="{switch_footer_links.footer_link.U_FOOTER_LINK_HREF}" rel="{switch_footer_links.footer_link.FOOTER_LINK_REL}" target="{switch_footer_links.footer_link.FOOTER_LINK_TARGET}" title="{switch_footer_links.footer_link.L_FOOTER_LINK_TITLE}">{switch_footer_links.footer_link.L_FOOTER_LINK_TEXT}</a>
                            <!-- END footer_link -->
                         </li>
                      </ul>
                      <!-- END switch_footer_links -->
                   <p class="admin-link">
                      <strong>{ADMIN_LINK}</strong>
                   </p>
                   </div>
                </div>
                {PROTECT_FOOTER}
             </div>
          </div>
       </div>
    </div>

    <!-- BEGIN switch_facebook_login -->
    <div id="fb-root"></div>
    <script type="text/javascript">
        $(document).ready( function() {
            $('div.fb-login-button, span.fb-login-button').attr({
                "data-scope": "{switch_facebook_login.FB_SCOPE}",
                "data-max-rows": "{switch_facebook_login.FB_MAX_ROWS}",
                "data-size": "{switch_facebook_login.FB_BUTTON_SIZE}",
                "data-show-faces": "{switch_facebook_login.FB_SHOW_FACES}",
                "data-auto-logout-link": "{switch_facebook_login.FB_AUTO_LOGOUT}"
            });
            $('div.fb-login-button, span.fb-login-button').each(function() {
                if(typeof $(this).attr('onlogin') == typeof undefined || $(this).attr('onlogin') === false) {
                    $(this).attr('onlogin', '{switch_facebook_login.FB_ONLOGIN}');
                }
                if($(this).html() == '') {
                    $(this).html('{switch_facebook_login.FB_LABEL}');
                }
            });
           
            FB.init({
                appId  : "{switch_facebook_login.FB_APP_ID}",
                cookie  : {switch_facebook_login.FB_COOKIE},
                xfbml  : {switch_facebook_login.FB_XFBML},
                oauth  : {switch_facebook_login.FB_OAUTH},
                version : '{switch_facebook_login.FB_VERSION}'
            });
           
            (function(d, s, id){
                var js, fjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) {return;}
                    js = d.createElement(s); js.id = id;
                js.src = "//connect.facebook.net/{switch_facebook_login.FB_LOCAL}/sdk.js";
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'facebook-jssdk'));
        });
        function onLoginFB() {
            window.location.replace('{switch_facebook_login.FB_ONLOGIN_URL}')
        }
    </script>
    <!-- END switch_facebook_login -->
    <!-- BEGIN switch_topicit_connect -->
    <script>
        $(document).ready( function() {
            $('div.ti-connect').attr({
                'data-loc' : '{switch_topicit_connect.TOPICIT_URL}',
                'data-login' : '{switch_topicit_connect.BOARD_LOGIN}',
                'data-version' : '{switch_topicit_connect.TOPICIT_VERSION}',
                'data-lang' : '{switch_topicit_connect.BOARD_LANG}'
            });

            (function(d, s, id) {
                var js, fjs = d.getElementsByTagName(s)[0];
                if (d.getElementById(id)) return;
                js = d.createElement(s); js.id = id;
                js.src = "{switch_topicit_connect.TOPICIT_ENDPOINT}";
                fjs.parentNode.insertBefore(js, fjs);
            }(document, 'script', 'topicit-connect'));
        });
    </script>
    <!-- END switch_topicit_connect -->
    <script type="text/javascript">
    //<![CDATA[
       fa_endpage();
    //]]>
    </script>
    </body>
    </html>

    Overall_header:
    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml" dir="{S_CONTENT_DIRECTION}" id="min-width" lang="{L_LANG_HTML}" xml:lang="{L_LANG_HTML}" {NAMESPACE_FB_LIKE} {NAMESPACE_FB} {NAMESPACE_BBCODE}>
    <head>
       <title>{SITENAME_TITLE}{PAGE_TITLE}</title>
       <meta http-equiv="content-type" content="text/html; charset={S_CONTENT_ENCODING}" />
       <meta http-equiv="content-script-type" content="text/javascript" />
       <meta http-equiv="content-style-type" content="text/css" />
       <meta name="viewport" content="width=device-width, initial-scale=1" />
       <!-- BEGIN switch_compat_meta -->
       <meta http-equiv="X-UA-Compatible" content="IE={switch_compat_meta.VERSION}" />
       <!-- END switch_compat_meta -->
       <!-- BEGIN switch_canonical_url -->
       <link rel="canonical" href="{switch_canonical_url.CANONICAL_URL}" />
       <!-- END switch_canonical_url -->
       {META_FAVICO}
       {META}
       {META_FB_LIKE}
       <meta name="title" content="{SITENAME_TITLE}{PAGE_TITLE}" />
       {T_HEAD_STYLESHEET}
       {CSS}
       <link rel="stylesheet" type="text/css" href="//maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css" />
       <link rel="search" type="application/opensearchdescription+xml" href="/improvedsearch.xml" title="{SITENAME}" />
       <link rel="search" type="application/opensearchdescription+xml" href="{URL_BOARD_DIRECTORY}/search/improvedsearch.xml" title="{SEARCH_FORUMS}" />
       <script src="{JQUERY_PATH}" type="text/javascript"></script>
        <!-- BEGIN switch_recent_jquery -->
        <script src="{JS_DIR}jquery1.9/jquery-migrate-1.4.1.js" type="text/javascript"></script>
        <script src="{JQUERY_DIR}browser/v1.0/jquery.browser.min.js" type="text/javascript"></script>
        <script src="{JQUERY_DIR}support/jquery.support.js" type="text/javascript"></script>
        <!-- END switch_recent_jquery -->
       <script src="{JS_DIR}{L_LANG}.js" type="text/javascript"></script>
        {RICH_SNIPPET_GOOGLE}

       <!-- BEGIN switch_fb_login -->
       <script src="https://connect.facebook.net/{switch_fb_login.FB_LOCAL}/all.js" type="text/javascript"></script>
       <script src="{switch_fb_login.JS_FB_LOGIN}" type="text/javascript"></script>
       <!-- END switch_fb_login -->

       <!-- BEGIN switch_ticker -->
       <link type="text/css" rel="stylesheet" href="{JQUERY_DIR}ticker/ticker.css" />   
       <script src="{JQUERY_DIR}ticker/ticker.js" type="text/javascript"></script>
       <!-- END switch_ticker -->

       <!-- BEGIN switch_ticker_new -->
       <script src="{JQUERY_DIR}jcarousel/jquery.jcarousel.js" type="text/javascript"></script>
       <script type="text/javascript">//<![CDATA[
          /* Definir le sens de direction en fonction du panneau admin */
          var tickerDirParam = "{switch_ticker.DIRECTION}";
          var slid_vert = false;
          var auto_dir = 'next';
          var h_perso = parseInt({switch_ticker.HEIGHT});

          switch( tickerDirParam )
          {
             case 'top' :
                slid_vert = true;
                break;

             case 'left':
                break;

             case 'bottom':
                slid_vert = true;
                auto_dir = 'prev';
                break;

             case 'right':
                auto_dir = 'prev';
                break;

             default:
                slid_vert = true;
          }

          $(document).ready(function() {

             var width_max = $('ul#fa_ticker_content').width();
             var width_item = Math.floor(width_max / {switch_ticker.SIZE});

             if (width_max > 0)
             {
                $('#fa_ticker_content').css('display','block');

                $('ul#fa_ticker_content li').css('float','left').css('list-style','none').width(width_item).find('img').each(function () {
                   if ($(this).width() > width_item)
                   {
                   var ratio      = $(this).width() / width_item;
                   var new_height = Math.round($(this).height() / ratio);
                   $(this).height(new_height).width(width_item);
                   }
                });

                if (slid_vert)
                {
                   var height_max = h_perso;

                   $('ul#fa_ticker_content li').each( function () {
                      if ($(this).height() > height_max)
                      {
                         height_max = $(this).height();
                      }
                   } );

                   $('ul#fa_ticker_content').width(width_item).height(height_max).css('marginLeft','auto').css('marginRight','auto');
                   $('ul#fa_ticker_content li').height(height_max);
                }

                $('#fa_ticker_content').jcarousel({
                      vertical: slid_vert,
                   wrap: 'circular',
                   auto: {switch_ticker.STOP_TIME},
                   auto_direction: auto_dir,
                scroll: 1,
                size: {switch_ticker.SIZE},
                height_max: height_max,
                animation: {switch_ticker.SPEED}
                });
             }
             else
             {
                $('ul#fa_ticker_content li:not(:first)').css('display','none');
                $('ul#fa_ticker_content li:first').css('list-style','none').css('text-align','center');
             }
          });
       //]]>
       </script>
       <!-- END switch_ticker_new -->

       <script type="text/javascript">
       //<![CDATA[
       jQuery().ready(function(){
          <!-- BEGIN switch_enable_pm_popup -->
             pm = window.open('{U_PRIVATEMSGS_POPUP}', '_faprivmsg', 'HEIGHT=225,resizable=yes,WIDTH=400');
             if(pm != null) { pm.focus(); }
          <!-- END switch_enable_pm_popup -->
          <!-- BEGIN switch_report_popup -->
             report = window.open('{switch_report_popup.U_REPORT_POPUP}', '_phpbbreport', 'HEIGHT={switch_report_popup.S_HEIGHT},resizable=yes,scrollbars=no,WIDTH={switch_report_popup.S_WIDTH}');
             if(report != null) { report.focus(); }
          <!-- END switch_report_popup -->
          <!-- BEGIN switch_ticker -->
             $(window).load(function() {            
                Ticker.start({
                   height : {switch_ticker.HEIGHT},
                   spacing : {switch_ticker.SPACING},
                   speed : {switch_ticker.SPEED},
                   direction : '{switch_ticker.DIRECTION}',
                   pause : {switch_ticker.STOP_TIME}
                });
             });
          <!-- END switch_ticker -->
       });

       <!-- BEGIN switch_login_popup -->
          var logInPopUpLeft, logInPopUpTop, logInPopUpWidth = {LOGIN_POPUP_WIDTH}, logInPopUpHeight = {LOGIN_POPUP_HEIGHT}, logInBackgroundResize = false, logInBackgroundClass = false;
       <!-- END switch_login_popup -->

       <!-- BEGIN switch_login_popup -->
       $(document).ready( function() {
          $(window).resize(function() {
             var windowWidth = document.documentElement.clientWidth;
             var popupWidth = $("#login_popup").width();
             var mypopup = $("#login_popup");

             $("#login_popup").css({
             "left": windowWidth/2 - popupWidth/2
                });
          });
       });
       <!-- END switch_login_popup -->
       //]]>
       </script>
       {GREETING_POPUP}
       <!-- BEGIN switch_ticker_new -->
       <style>
       .jcarousel-skin-tango .jcarousel-item {
          text-align:center;
          width: 10px;
       }

       .jcarousel-skin-tango .jcarousel-item-horizontal {
          margin-right: {switch_ticker.SPACING}px;
       }

       .jcarousel-skin-tango .jcarousel-item-vertical {
          margin-bottom: {switch_ticker.SPACING}px;
       }
       </style>
       <!-- END switch_ticker_new -->
       {HOSTING_JS}
        <!-- BEGIN google_analytics_code -->
        <script type="text/javascript">
            //<![CDATA[
            var _gaq = _gaq || [];
            _gaq.push(["_setAccount", "{G_ANALYTICS_ID}"]);
            _gaq.push(["_trackPageview"]);
            _gaq.push(['_trackPageLoadTime']);

            <!-- BEGIN google_analytics_code_bis -->
            _gaq.push(['b._setAccount', '{G_ANALYTICS_ID_BIS}']);
            _gaq.push(['b._trackPageview']);
            <!-- END google_analytics_code_bis -->

            (function() {
                var ga = document.createElement("script"); ga.type = "text/javascript"; ga.async = true;
                ga.src = ("https:" == document.location.protocol ? "https://ssl" : "http://www") + ".google-analytics.com/ga.js";
                var s = document.getElementsByTagName("script")[0]; s.parentNode.insertBefore(ga, s);
            })();
            //]]>
        </script>
        <!-- END google_analytics_code -->
    </head>

    <body>
       <!-- BEGIN hitskin_preview -->
       <div id="hitskin_preview" style="display: block;">
          <h1><img src="https://illiweb.com/fa/hitskin/hitskin_logo.png" alt="" /> <em>Hit</em>skin.com</h1>
          <div class="content">
             <p>
                {hitskin_preview.L_THEME_SITE_PREVIEW}
                <br />
                <span>{hitskin_preview.U_INSTALL_THEME}<a href="https://{hitskin_preview.U_RETURN_THEME}">{hitskin_preview.L_RETURN_THEME}</a></span>
             </p>
          </div>
       </div>
       <!-- END hitskin_preview -->

       <!-- BEGIN switch_login_popup -->
       <div id="login_popup" class="module main" style="z-index: 10000 !important;">
          <div id="login_popup_title" class="main-head">
             <div class="h3">{SITENAME}</div>
          </div>
          <div class="main-content">
             {LOGIN_POPUP_MSG}
             <div id="login_popup_buttons">
                <form action="{S_LOGIN_ACTION}" method="get">
                   <input type="submit" class="button2" value="{L_LOGIN}" />
                   <input type="button" class="button2" value="{L_REGISTER}" onclick="parent.location='{U_REGISTER}';" />
                   <input id="login_popup_close" type="button" class="button2" value="{L_DONT_DISPLAY_AGAIN}" />
                </form>
             </div>
          </div>
       </div>
       <!-- END switch_login_popup -->

       <a id="top" name="top" accesskey="t"></a>

       <div class="minwidth_IE">
          <div class="layout_IE">
             <div class="container_IE">
                             
                             
    <div id="header">
        <div class="limit-width">
          <div class="header-top">
            <div class="logo">
                <img src="https://i62.servimg.com/u/f62/19/03/14/16/mdb110.png" />
            </div>
          </div>
          <div class="nav-top clearfix">
            <ul class="main-menu left">
              <li class="active"><a href="#">Trang chủ</a></li>
              <li><a href="#">Thành viên</a></li>
              <li><a href="#">Trợ giúp</a></li>
            </ul>
            <form method="get" class="search-form right" action="/search">
              <input class="search-input" id="keywords" name="search_keywords" placeholder="Nhập từ khóa tìm kiếm" type="search" required="" />
              <input class="search-btn fa" type="submit" value="" />
            </form>
          </div>
        </div>
    </div>
                             
                             
                <div class="pun limit-width">

                   <!-- BEGIN switch_ticker_new -->
                   <div id="fa_ticker_block" style="padding-top:4px;">
                      <div class="module main">
                         <div class="main-content clearfix">
                            <div id="fa_ticker_container">
                               <ul id="fa_ticker_content" class="jcarousel-skin-tango" style="display: none;width: 100%;">
                                  <!-- BEGIN ticker_row -->
                                  <li>{switch_ticker.ticker_row.ELEMENT}</li>
                                  <!-- END ticker_row -->
                               </ul>
                            </div>
                         </div>
                      </div>
                   </div>
                   <!-- END switch_ticker_new -->

                   <!-- BEGIN switch_ticker -->
                   <div id="fa_ticker_block" style="padding-top:4px;">
                      <div class="module main">
                         <div class="main-content clearfix">
                            <div id="fa_ticker_container">
                               <div id="fa_ticker" style="height:{switch_ticker.HEIGHT}px;">
                                  <div class="fa_ticker_content">
                                     <!-- BEGIN ticker_row -->
                                     <div>{switch_ticker.ticker_row.ELEMENT}</div>
                                     <!-- END ticker_row -->
                                  </div>
                               </div>
                            </div>
                         </div>
                      </div>
                   </div>
                   <!-- END switch_ticker -->

                                     
                   <div id="page-body" class="side-col clearfix">
                      <div id="{ID_CONTENT_CONTAINER}" class="col-right right">
    <div class="crumbs"><a class="crumbs-index" href="{U_INDEX}"><span>Trang chủ</span></a><strong>{NAV_CAT_DESC}</strong></div>
                         <div id="outer-wrapper">
                            <div id="wrapper">
                               <div id="container">
                                  <div id="content">
                                     <div id="main">
                                        <div id="main-content">

    <!-- BEGIN html_validation -->
                                        </div>
                                     </div>
                                  </div>
                               </div>
                            </div>
                         </div>
                      </div>
                   </div>
                </div>
             </div>
          </div>
       </div>
    </body>
    </html>
    <!-- END html_validation -->

    Vậy là xong, chúc các bạn vui vẻ!

  • FolkBirds
    Thank you for sharing.
    please give "viewtopic_body" code.

  • eby

    Thank you for sharing. @Karbyz49
    Beautiful skin

  • ZzThuyNg0czZ
    skin very nice , thanks for share @Karbyz49 :)

  • service
    thanks for share,is very nice skin

  • Sponsored content

Thông tin tác giả
avatar
S-MOD
Bài viết :
287
Points :
594
Like :
157
Punbb
An toàn
Status :
Đành vậy thế thôi
Xem lý lịch thành viên http://vnraovat.forumvi.com/
Thông tin tác giả
avatar
MEM
Bài viết :
9
Points :
12
Like :
3
Punbb
Xem lý lịch thành viên
Thông tin tác giả
avatar
MEM
Bài viết :
1
Points :
1
Like :
0
Punbb
Xem lý lịch thành viên
Thông tin tác giả
avatar
MEM LV1
Bài viết :
10
Points :
11
Like :
1
Punbb
Cẩn thận
Xem lý lịch thành viên
Thông tin tác giả
avatar
MEM
Bài viết :
5
Points :
5
Like :
0
Punbb
Xem lý lịch thành viên
Thông tin tác giả
Sponsored content
Bài viết liên quan
    Đang tải dữ liệu

Permissions in this forum:
Bạn không có quyền trả lời bài viết

<