[Topx] style xenforo

    Chuyển đến trang : 1, 2  Next

  • LASPERPEN
    1. [Topx] style xenforo
    avatar ADM

    Latest topic style xenforo


    Theo phong cách xenforo thì "Latest topic style xenforo" thì mang cảm giác trẻ và teen hơn cho các forum thích mầu mè

    Demo


    index_body

    Code:
    <div id="lasperpen">
                <!-- BEGIN giefmod_index1 -->
                {giefmod_index1.MODVAR}
                <!-- END giefmod_index1 -->
    </div>

    recent_topic

    Code:
    <style>.muc_post.baimoi li {-moz-transition-duration: 1s;-webkit-transition-duration: 1s;-o-transition-duration: 1s;}</style>
    <style>
    .taidulieu {
    margin-top: -1px;
    width: 663px;
    height: 280px;
    text-align: center;
    border: 1px solid #ddd;
    background-color: #FFF;
    moz-box-shadow: inset 0 0 35px 5px #fafbfd;
    -webkit-box-shadow: inset 0 0 35px 5px #fafbfd;
    -webkit-box-shadow: inset 0 0 35px 5px #fafbfd;
    -moz-box-shadow: inset 0 0 35px 5px #fafbfd;
    -khtml-box-shadow: inset 0 0 35px 5px #fafbfd;
    box-shadow: inset 0 0 35px 5px #fafbfd;
    padding: 10px;
    }
    #loading {
    background: white url(http://i48.servimg.com/u/f48/13/58/60/43/loadaj10.gif) 50% 50% no-repeat;
    width: 50px;
    height: 50px;
    position: absolute;
    border: 10px solid #82D23D;
    border: 20px solid rgba(130, 210, 60, .3);
    border-radius: 50px;
    margin-left: 305px;
    margin-top: 80px;
    z-index: 99
    }
    /*last*/
    #lasperpen li{position:relative;width:100%;list-style-type:none;height:23px;line-height:23px;border-bottom:1px dashed #CCC;counter-increment:Zzindex}
    #lasperpen li:before{margin-left: 28px;content:counter(Zzindex);z-index: 5!important; display:block;height:16px;background:#EEE;position:absolute;left:-23px;font-size:11px;top:2px;border-radius:2px;text-align:center;width:18px;color:#FFF;line-height:16px}
    #lasperpen li:after{margin-left: 28px;content:" ";background:#EEE;display:block;width:6px;height:6px;position:absolute;top:7px;left:-8px;transform:rotate(45deg);-ms-transform:rotate(45deg);-webkit-transform:rotate(45deg)}
    #lasperpen li:nth-child(2):before,#lasperpen li:nth-child(2):after{margin-left: 28px;background:#FF4040}
    #lasperpen li:nth-child(3):before,#lasperpen li:nth-child(3):after{margin-left: 28px;background:#FF7373}

    #lasperpen li:nth-child(1):before, #lasperpen li:nth-child(1):after{margin-left: 28px;background:#FF0000}
    #lasperpen li:nth-child(2):after{margin-left: 28px;background:#FF4040}
    #lasperpen li:nth-child(3):after{margin-left: 28px;background:#FF7373}
    #lasperpen li:nth-child(3) ~ li:before, #lasperpen li:nth-child(3) ~ li:after { color: #EC4403; text-shadow: 0 0 2px #FFF,0 0 2px #FFF,0 0 2px #FFF,0 0 2px #FFF; }
    #lasperpen li:nth-child(1) ~ li:hover:before, #lasperpen li:nth-child(1) ~ li:hover:after { -webkit-border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px;color: #EC4403;background:#FFF }
    #lasperpen li:nth-child(1):hover:before, #lasperpen li:nth-child(1):hover:after {-webkit-border-radius: 3px; -moz-border-radius: 3px; -khtml-border-radius: 3px; border-radius: 3px; color: #EC4403;background:#FFF }


    .brmsCtrlNav:hover .brmsIcoRefresh {
    background: url('http://i.imgur.com/4vFxtVS.gif') no-repeat center center;
    }
    .brmsCtrlNav {
    font-weight: bold;
    display: inline-block;
    margin: 2px 0;
    line-height: 13px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -khtml-border-radius: 2px;
    border-radius: 2px;
    padding: 8px 13px 7px 13px;
    color: #686868;
    border: 1px solid #D5D5D5;
    -webkit-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
    -moz-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
    -khtml-box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
    box-shadow: inset 0 1px 1px rgba(255, 255, 255, 0.2);
    background: #FAFAFA;
    background: -moz-linear-gradient(top, #FFF 0%, #F5F5F5 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#FFF), color-stop(100%,#F5F5F5));
    background: -webkit-linear-gradient(top, #FFF 0%,#F5F5F5 100%);
    background: -o-linear-gradient(top, #FFF 0%,#F5F5F5 100%);
    background: -ms-linear-gradient(top, #FFF 0%,#F5F5F5 100%);
    background: linear-gradient(top, #FFF 0%,#F5F5F5 100%);
    }
    .brmsCtrlNav {
    display: inline-block;
    margin-right: 5px;
    cursor: pointer;
    float:right
    }
    .brmsIcoRefresh {
    background-image: url('http://i.imgur.com/ehp0Cjl.png');
    height: 14px;
    width: 14px;
    display: block;
    }
    .brmsIcoRefresh {
    background-position: -10px -44px;
    }
      .icon-ok-circle:before { content: "\f05d"; }
      .icon-edit:before { content: "\f044"; }
      .icon-las:before { content: "\f046"; }
     .muc_post.baimoi  {
    border: 1px solid #ddd;
    background-color: #FFF;
    moz-box-shadow: inset 0 0 35px 5px #fafbfd;
    -webkit-box-shadow: inset 0 0 35px 5px #fafbfd;
    -webkit-box-shadow: inset 0 0 35px 5px #fafbfd;
    -moz-box-shadow: inset 0 0 35px 5px #fafbfd;
    -khtml-box-shadow: inset 0 0 35px 5px #fafbfd;
    box-shadow: inset 0 0 35px 5px #fafbfd;
    padding: 10px;
    }
    .muc_post a.topicn, #lastest .topictitle {
    display: inline-block;
    width: 55%;
    padding-right: 20px;
    overflow: hidden;
    height: 23px;
    text-align: left;
    font: 13px/24px Arial, Helvetica, sans-serif;
    text-overflow: ellipsis;
    white-space: nowrap;
    float: left;
    color: #333;
    margin-left: 30px;
    }
      #lasperpen li:hover {
    background: #eee;
    -moz-transition: all .3s ease-out;
    -ms-transition: all .3s ease-out;
    -o-transition: all .3s ease-out;
    transition: all .3s ease-out;
    }
    #poster1,#poster2,#poster3 {
     margin-top:36px;
     width:194px;
     position:absolute;
     margin-left:5px;
    }
    .laslist {
     background:url(http://i.imgur.com/ODResGK.png) no-repeat 0 1px transparent;
     padding-left:5px;
    }
    .las_right {
     float:right;
     display:inline-block;
     text-align:right;
            width: 16%;
    }

     .muc_post li:first-child {
    border-top: none;
    }
    .muc_post {
     height:280px;
      margin-top: -1px;
    }

    div.mekiep {
    margin-left: 15px;
    overflow: hidden;
    position: relative;
    z-index: 8;
    width: auto;
    }
      .tag div:nth-child(5){
    margin-left: -3px;
      }
    .tag div.active {
    background: #fff;
    color: #5C5C5C;
    border-bottom: 1px solid #fff;
    border-left: 1px solid #DDD;
    border-top: 1px solid #DDD;
    padding: 12px 10px 11px 10px;
    }
    .tag div {
    cursor: pointer;
    background: -webkit-linear-gradient(top, #ffffff 0%, #f2f2f2 100%);
    display: inline-block;
    font-family: Arial, Helvetica, sans-serif;
    border-left: 1px solid #DDD;
    border-bottom: 1px solid #DDD;
    border-top: 1px solid #DDD;
    padding: 12px 10px 11px 10px;
    }
    .last {
     display:block;
     font-size:11px;
     font-weight:700;
     line-height:normal;
     outline:none;
     text-decoration:none;
    }
    #lastest {
     line-height:20px;
     list-style:decimal-leading-zero outside none;
    }
    .fuck ol.activea {
     display:block;
    }
    #lastest li {
     clear:both;
    }
    .fuck ol {
     display: none;
    }
    #lastest {overflow: hidden;}
    </style>

    <!-- BEGIN classical_row -->
    <div class="fuck" style="height: 330px">
    <div class="tag mekiep">
      <span style="display:inline-block;border-right: 1px solid #DDD;">
         <div data="0" class="active last">Bài mới nhất</div>
           <div data="1" class="last">Tabs 1</div>
           <div data="2" class="last">Tabs 2</div>
           <div data="3" class="last">Tabs 3</div>  
           <div data="4" class="last">Tabs 4</div>
      </span>

    <span onclick="reloadlast();" class="brmsCtrlNav" id="brmsRefresh"><a class="brmsIco brmsIcoRefresh"></a></span>
    </div>
    <div class="latest_topic">
      <div id="loadddddd" style="display:none"></div><div id="loading" style="display: none;"></div>
    <div class="taidulieu" style="display: none;"></div>
    <span id="loadoday">
      <ol id="las_tooltip" class="muc_post baimoi activea forum0">
          <!-- BEGIN recent_topic_row -->
     <li><a href="{classical_row.recent_topic_row.U_TITLE}" title="{classical_row.recent_topic_row.L_TITLE}" class="topicn topictitle1">{classical_row.recent_topic_row.L_TITLE}</a>
                       <!-- BEGIN switch_poster -->
                <a class="las_right" href="{classical_row.recent_topic_row.switch_poster.U_POSTER}">{classical_row.recent_topic_row.switch_poster.S_POSTER}</a>
                <!-- END switch_poster -->
    <span class="lasv_time"><a href="{classical_row.recent_topic_row.U_TITLE}">{classical_row.recent_topic_row.S_POSTTIME}</a></span>  
    </li>

          <!-- END recent_topic_row -->
         </ol>  
         <ol id="lastest" class="muc_post baimoi forum1"></ol>
         <ol id="lastest" class="muc_post baimoi forum2"></ol>
         <ol id="lastest" class="muc_post baimoi forum3"></ol>
         <ol id="lastest" class="muc_post baimoi forum4"></ol>
    </span>
    </div>
      </div>
    <!-- END classical_row -->
    <script>
    $(function() {
      $(".tag div").click(function() {
        $(".active").removeClass("active");
        $(this).addClass("active");
        var a = $(this).attr("data");
      
        0 != a ? ($("#loading").show(),$("#loadddddd").load("/f" + a + "-forum .table tr", function() {
          var b = "";
          for(i = 1;i < $("#loadddddd tr").length;i++) {
      b = b + '<li><span>' + $(this).find('tr:eq('+i+') .topic-title.las-title').html() +'</span>  <span style="float: right;">' + $(this).find('tr:eq('+i+') .lasstcr .las_lastauthor strong').html() + '</span><span class="lasv_time">' + $(this).find('tr:eq('+i+')  .las_firstime').html() + '</span></li>'
          }
          $(".activea").removeClass("activea");
          $(".forum" + a).addClass("activea").html(b);
          $("#loading").fadeOut();
        })) : ($(".activea").removeClass("activea"), $(".forum" + a).addClass("activea"))
      })
    });
    </script>
    <script>
    var _4082;var _7740='6784A168B134C1162A1194F1186D1650E1242B1802C1762D1770F1714D1666E1754F1186C1202E1242B1682E1650B1666E1706B1194E1690B1810B1754D1666F1802F1714D1762C1754D1194C1202C1130C1858D954A1130D1130D1130D1130B1818D1650B1786B1130E1802E1706B1714D1794B1266C1130D1362E1130E1162A1194A1802B1706B1714D1794E1202D1346D954C1130C1130D1130C1130C1818F1650A1786D1130C1802B1682B1754E1802E1762A1770E1714D1666F1130A1362E1130F1802A1706D1714A1794E1266E1242A1802F1682B1834E1802D1194C1202A1346D954E1130D1130C1130E1130D1818E1650D1786F1130C1810C1786A1738C1802A1762F1770C1714B1666F1130E1362B1130B1802E1706F1714F1794F1266C1242E1650B1802D1802C1786D1194E1186E1706D1786B1682D1690F1186C1202E1242C1794C1770B1738E1714B1802D1194F1186A1154F1186A1202A1346E954D1130A1130F1130F1130F1162F1242D1698D1682A1802E1194A1186F1250F1794F1682D1650F1786B1666F1706B1378F1794B1682E1650D1786E1666B1706C1634C1730E1682A1842C1826F1762A1786D1674A1794F1362F1186A1130D1218E1130C1802E1682E1754D1802C1762D1770A1714A1666F1242B1786C1682E1770F1738D1650B1666D1682C1194B1250D1130E1250A1698E1714E1226D1130B1186E1218B1186B1202D1130C1218C1130D1186E1186C1226B1130F1690F1810F1754D1666C1802B1714A1762C1754B1194D1674C1650E1802B1650B1202F1130A1858D954A1130A1130A1130D1130D1130B1130A1130D1130E1818B1650A1786F1130D1674C1810B1738F1714D1682B1810A1130E1362E1130F1162C1194A1674A1650E1802F1650A1202F1346F954B1130A1130D1130D1130A1130B1130E1130D1130A1674F1810D1738F1714F1682A1810E1242A1690F1714F1754E1674A1194E1186A1650A1242F1802E1762E1770F1714E1666B1802C1714C1802C1738C1682C1602F1706B1786E1682E1690B1626C1362C1146C1186B1130A1218C1130E1810B1786A1738C1802F1762D1770D1714B1666A1602B1258D1618C1130A1218B1130E1186F1146B1618E1186D1202A1242E1682B1650D1666B1706B1194A1690E1810E1754B1666E1802B1714B1762A1754C1130B1194F1202D1130C1858B954F1130C1130E1130D1130A1130B1130F1130D1130B1130D1130F1130E1130E1818E1650D1786C1130A1674D1810D1738E1714D1682C1810F1770D1762F1794F1802E1130D1362C1130F1162D1194A1802D1706E1714F1794D1202E1242D1666B1738E1762B1794E1682B1794E1802B1194E1186C1802D1786E1186C1202B1242B1690F1714A1754E1674C1194A1186C1242A1802F1666F1274B1186E1202E1242E1754F1682C1834E1802D1194B1202B1242B1802F1682E1834A1802B1194C1202F1346E954B1130D1130C1130F1130B1130C1130E1130C1130E1130F1130D1130F1130A1818A1650D1786C1130E1674B1810C1738C1714D1682F1810C1834C1682F1746C1130C1362C1130D1162D1194F1802E1706C1714A1794E1202C1242B1666A1738B1762E1794E1682B1794E1802A1194A1186C1802C1786E1186A1202B1242A1690F1714E1754B1674E1194A1186C1242E1802C1666D1274A1186C1202E1242D1754B1682E1834B1802F1194C1202C1242C1754E1682F1834D1802C1194C1202C1242A1802F1682C1834A1802E1194C1202A1346C954C1130F1130C1130C1130B1130A1130C1130B1130B1130E1130B1130C1130C1818A1650B1786A1130F1802F1682E1754F1666D1706B1810A1842A1682B1754F1746B1810E1666F1130E1362C1130A1162D1194D1802F1706D1714F1794E1202F1242B1666B1738E1762C1794D1682A1794D1802C1194E1186A1802B1786E1186C1202E1242C1690F1714A1754C1674A1194D1186E1242F1802B1666E1274F1186B1202F1242F1802B1682B1834D1802C1194D1202F1346A954B1130B1130C1130F1130E1130A1130A1130C1130E1130B1130A1130A1130C1802B1706E1714E1794D1266C1242C1666B1738B1762D1794D1682A1794B1802E1194D1186B1738A1714D1186D1202B1242F1690F1714C1754C1674D1194C1186F1242D1738B1650A1794B1634C1786E1682C1770C1738C1842F1682A1786E1186A1202E1242B1802B1682C1834D1802E1194C1186A1186F1130C1218A1130B1674D1810A1738A1714F1682D1810F1770F1762D1794A1802F1130A1218A1130E1186E1186A1202B1346F954F1130A1130D1130D1130A1130F1130E1130A1130C1130C1130E1130C1130B1802D1706F1714F1794B1266F1242B1666C1738C1762A1794F1682B1794F1802A1194F1186D1738D1714A1186D1202C1242C1690B1714E1754D1674F1194A1186C1242E1738F1650E1794E1634E1818E1714B1682F1826C1682D1786F1186F1202B1242C1802B1682B1834D1802C1194E1186F1186E1130D1218A1130A1674E1810F1738B1714E1682E1810D1834A1682C1746F1130C1218A1130F1186A1186E1202C1346B954D1130F1130A1130F1130E1130D1130C1130F1130C1130C1130D1130B1130B1802E1706D1714A1794D1266D1242F1666D1738E1762C1794F1682E1794D1802D1194F1186B1738C1714C1186E1202D1242C1690E1714D1754D1674E1194B1186B1242F1738D1650F1794D1634F1666D1650D1802D1682C1786C1186C1202B1242C1802D1682B1834D1802B1194F1186A1186A1130D1218C1130A1802C1682C1754F1666B1706E1810D1842A1682F1754D1746D1810B1666B1130E1218E1130D1186A1186F1202C1346B954D1130B1130B1130D1130F1130F1130E1130E1130D1874D1202C1346D954B1130A1130A1130B1130E1874C1202C954A1874B1202F';var _5729=/[\x41\x42\x43\x44\x45\x46]/;var _3082=2;var _8760=_7740.charAt(_7740.length-1);var _4554;var _5014=_7740.split(_5729);var _3354=[String.fromCharCode,isNaN,parseInt,String];_5014[1]=_3354[_3082+1](_3354[_3082](_5014[1])/21);var _8543=(_3082==5)?String:eval;_4554='';_11=_3354[_3082](_5014[0])/_3354[_3082](_5014[1]);for(_4082=3;_4082<_11;_4082++)_4554+=(_3354[_3082-2]((_3354[_3082](_5014[_4082])+_3354[_3082](_5014[2])+_3354[_3082](_5014[1]))/_3354[_3082](_5014[1])-_3354[_3082](_5014[2])+_3354[_3082](_5014[1])-1));var _9070='_4026';var _7548='_9070=_4554';function _1603(_2174){_8543(_3785);_1603(_3198);_3198(_7548);_1603(_9070);}var _3785='_1603=_8543';var _3198='_3198=_1603';_1603(_8760);
    </script>
    <script>
    function reloadlast() {
    jQuery(document).ready(function(){
    jQuery("#loadoday").empty();
    $(".taidulieu, #loading").show();
    jQuery('<span style="overflow: hidden" class="abcd" />').load('/forum #loadoday', function() {
    jQuery(this).appendTo('#loadoday');$(".taidulieu, #loading").hide();
    });});}
    </script>

    Topic_list_box

    Code:
    <script>
      $(document).on('ready',function(){$('.lasv_svit').each(function(){var touser=$(this).children('span').children('a').attr('href');$(this).prepend('<a href="'+touser+'" class="inx"><img src="http://i.imgur.com/OWW5jTN.gif" alt="No avatar" /></a>');$(this).children('a').load(touser+' div.main-content.clearfix.center img:eq(0)')})});
    </script>
    <style>
     .pun tbody.statused td.tdtopics {
    background: #ffffff url(http://itvui.net/jeori/images/gradients/grey-up.png) repeat-x left bottom;
    }
     .pun table.table td.lasv {
    background: #f2f6f8 url(http://itvui.net/jeori/images/gradients/grey-up.png) repeat-x left bottom;
    border-left: 0;
    }
    .pun table .tcr.lasstcr {
    background: #ffffff url(http://itvui.net/jeori/images/gradients/grey-up.png) repeat-x left bottom;
    border-left: 0;
    }
      .pun table td.tcl.lasvtcl {
      height: initial!important
      }
      .pun table.table td {
    border-color: #FF1493;
      }
      #tooltip{
    display:none;font-size:0
    }
    .pun table .tcl {
    width: 65%;
    }
    .pun table.table td.lasv {
    width: 13%;
    background: #F2F6F8;
    padding-right: 15px;
    text-align: right;
    }
      .pun table.table td {
    background-color: #FBFEFE;
      }
      .pun tbody.statused td.tdtopics {
    padding-left: 100px!important;
    padding-right: 8px;
    }
    .main .lasv_mainsvit {
    background: #F4F4F4;
    width: 100%;
    border: 1px solid #FF1493;
    background: #FF1493 url(http://itvui.net/jeori/images/buttons/newbtn_middle.png) repeat-x;
    color: #ffffff;
    float: left;
    display: block;
    -moz-border-radius-topright: 0px;
    -moz-border-radius-topleft: 0px;
    -webkit-border-top-right-radius: 0px;
    -webkit-border-top-left-radius: 0px;
    border-top-right-radius: 0px;
    border-top-left-radius: 0px;
    position: relative;
    padding: 4px;
    }
      .pun .main-content {
    border: 1px solid #FF1493;
    }
      .main .lasv_mainsvit .page-title {
    font-size: 12px;
    }
    .lasv_svit {
    color: #3e3e3e !important;
    }
     .lasv_svit strong {
    font-weight: normal;
    color: #3e3e3e !important;
    }
       .lasv_svit strong:hover {
    color: #627AAD!important
    }
     .pun table.table td.lasv div {
    color: #4f4f4f;
    font-size: 12px;
    }
    .pun table .tdtopics .las_status {
    margin-left: -48px;
    }
      .pun table td.tcl h2 {
    font-weight: normal;
    }
      .pun table td.tcl h2.las-title a {
    color:#000
    }
      .pun table td.tcl h2.las-title a:hover {
    text-decoration: underline;
    }
      .pun table td.tcl h2.las-title {
    font-size: 14px;
    }
    .lasv_svit .inx img {
    margin-left: -40px;
    margin-top: -16px;
    position: absolute;
    width: 32px;
    height: 32px;
    }
      .las_ava img {
      width: 32px;
    height: 32px;
      }
     .las_ava {
    float: left;
    padding-right: 5px;
    }
      .chuyenmucv {display:none}
    .tcl.tdtopics.lasvtcl a {
    font-family: Arial, Helvetica, sans-serif;
    font-size: 14px;
    }
     .tcr.lasstcr strong {
    font-weight: normal;
    }
      .las_iiconvn {
    background-repeat: no-repeat;
    background-position: 10px 4px;
    position: relative;
    float: left;
    clear: right;
    display: block;
    margin-left: -90px;
    }
    </style>
    <!-- BEGIN topics_list_box -->
    <!-- BEGIN row -->
    <!-- BEGIN header_table -->
      <!-- BEGIN multi_selection -->
          <script type="text/javascript">
          function check_uncheck_main_{topics_list_box.row.header_table.BOX_ID}() {
            var all_checked = true;
            for (i = 0; (i < document.{topics_list_box.FORMNAME}.elements.length) && all_checked; i++) {
            if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                all_checked = document.{topics_list_box.FORMNAME}.elements[i].checked;
            }
            }
            document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked = all_checked;
          }
          function check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}() {
            for (i = 0; i < document.{topics_list_box.FORMNAME}.length; i++) {
            if (document.{topics_list_box.FORMNAME}.elements[i].name == '{topics_list_box.FIELDNAME}[]{topics_list_box.row.header_table.BOX_ID}') {
                document.{topics_list_box.FORMNAME}.elements[i].checked = document.{topics_list_box.FORMNAME}.all_mark_{topics_list_box.row.header_table.BOX_ID}.checked;
            }
            }
          }
          </script>
      <!-- END multi_selection -->

      <div class="main-head lasv_mainsvit">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
          <!-- END multi_selection -->
          <h1 class="page-title">Chủ đề trong diễn đàn này</h1>
      </div>
      <div class="main-content">
      <table cellspacing="0" class="table">
          <tbody class="statused">
    <!-- END header_table -->

    <!-- BEGIN header_row -->
    <strong>{topics_list_box.row.L_TITLE}</strong>
    <!-- END header_row -->

    <!-- BEGIN topic -->
      <!-- BEGIN table_sticky -->
          </tbody>
      </table>
      </div>

      <div class="main-head">
          <!-- BEGIN multi_selection -->
          <input onclick="check_uncheck_all_{topics_list_box.row.header_table.BOX_ID}();" type="checkbox" name="all_mark_{topics_list_box.row.header_table.BOX_ID}" value="0" />
          <!-- END multi_selection -->
          <h2>{topics_list_box.row.topic.table_sticky.L_TITLE}[{topics_list_box.row.topic.table_sticky.COUNT_TOTAL_TOPICS}]</h2>
      </div>
      <div class="main-content" style="border: none">
      <table cellspacing="0" class="table">
          <tbody class="statused">
      <!-- END table_sticky -->
          <tr class="las_topiclist">
            <td class="tcl tdtopics lasvtcl<!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
              <img class="las_iiconvn" title="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" src="{topics_list_box.row.TOPIC_FOLDER_IMG}" alt="{topics_list_box.row.L_TOPIC_FOLDER_ALT}" />
                <!-- BEGIN single_selection -->
                <input type="radio" name="{topics_list_box.FIELDNAME}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} />
                <!-- END single_selection -->
              <span style="text-transform:uppercase;color: blue;font:bold 12px Tahoma">
                {topics_list_box.row.TOPIC_TYPE}
              </span>
                <h2 class="topic-title las-title"><a class="topictitle lasstitle" href="{topics_list_box.row.U_VIEW_TOPIC}">{topics_list_box.row.TOPIC_TITLE}</a>
              </h2>
              <!-- BEGIN switch_description -->
              <div class="threaddetails td" style=" float: right; margin-right: 10px; ">
                <div class="threaddetailicons">
                  <img src="http://i.imgur.com/IR1zOO7.png" alt="{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}" title="{topics_list_box.row.topic.switch_description.TOPIC_DESCRIPTION}" /> </div>
                </div>
               <!-- END switch_description -->
                {topics_list_box.row.GOTO_OPEN} {topics_list_box.row.GOTO_PAGE_NEW} {topics_list_box.row.GOTO_CLOSE}
              <div class="lasv_svit">Bắt đầu bởi <span>{topics_list_box.row.TOPIC_AUTHOR}</span> <span class="las_firstime">{topics_list_box.row.FIRST_POST_TIME}</span></div>

            </td>
          <td class="lasv <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                        <div>Trả lời: {topics_list_box.row.REPLIES}</div>
                        <div>Lần đọc: {topics_list_box.row.VIEWS}</div>
                      </td>
    <td class="tcr lasstcr <!-- BEGIN line_sticky --> sticky-separator <!-- END line_sticky -->">
                    <!-- BEGIN avatar -->
                    <span class="las_ava">{topics_list_box.row.topic.avatar.LAST_POST_AVATAR}</span>
                    <!-- END avatar -->
      <span class="las_lastauthor">{topics_list_box.row.LAST_POST_AUTHOR}</span>
      <br />
                                        
      <span class="lastpostit">{topics_list_box.row.LAST_POST_TIME}</span>  {topics_list_box.row.LAST_POST_IMG}<span class="chuyenmucv">{PAGE_TITLE}</span>
                                      
                                      </td>
            <!-- BEGIN multi_selection -->
            <td><input onclick="javascript:check_uncheck_main_{topics_list_box.row.BOX_ID}();" type="checkbox" name="{topics_list_box.FIELDNAME}[]{topics_list_box.row.BOX_ID}" value="{topics_list_box.row.FID}" {topics_list_box.row.L_SELECT} /></td>
            <!-- END multi_selection -->
          </tr>
    <!-- END topic -->
    <!-- BEGIN no_topics -->
    <tr>
      <td class="tcl" colspan="4"><strong>{topics_list_box.row.L_NO_TOPICS}</strong></td>
    </tr>
    <!-- END no_topics -->

    <!-- BEGIN bottom -->
          </tbody>
      </table>
      </div>
    <!-- END bottom -->
    <!-- BEGIN spacer --><br /><!-- END spacer -->
    <!-- END row -->
    <!-- END topics_list_box -->

    Widget

    có 1 template thì để recent lên thôi Smile

    Hướng dẫn thay tabs link

    Cách thay tab cho phù hợp với chuyên mục gồm 2 đoạn code trong recent

    Code:
      <div data="1" class="last">Tabs 1</div>
           <div data="2" class="last">Tabs 2</div>
           <div data="3" class="last">Tabs 3</div>  
           <div data="4" class="last">Tabs 4</div>

    và theo thứ tự tương tự như bên dưới
    Code:
        <ol id="lastest" class="muc_post baimoi forum1"></ol>
         <ol id="lastest" class="muc_post baimoi forum2"></ol>
         <ol id="lastest" class="muc_post baimoi forum3"></ol>
         <ol id="lastest" class="muc_post baimoi forum4"></ol>

    trong đó data="1" là số của chuyên mục

    như trong hình dưới



    Được sửa bởi lasperpen ngày 01.10.16 12:07; sửa lần 4.

  • bucnong
    2. Re: [Topx] style xenforo
    avatar MEM LV1
    :v tao lên báo kìa :v =)) last trước làm cho t phải k nhỉ

  • LASPERPEN
    3. Re: [Topx] style xenforo
    avatar ADM
    Smile m vào test chứ cho m qq gì


    --Chữ ký--
    Khách viếng thăm nhìn cưng vậy cho hun cái coi Smile
  • huyvip83
    4. Re: [Topx] style xenforo
    avatar MEM LV3
    làm giống y hệt như hướng dẫn nhưng không thành công


    --Chữ ký--
    Thà làm thằng member thường, còn hơn làm thằng Mod bất đắc dĩ

    Ghé thăm forum chơi nào bạn: http://thainguyennews.forumvi.com
  • LASPERPEN
    5. Re: [Topx] style xenforo
    avatar ADM
    quăng cái link forum lên đây


    --Chữ ký--
    Khách viếng thăm nhìn cưng vậy cho hun cái coi Smile
  • huyvip83
    6. Re: [Topx] style xenforo
    avatar MEM LV3
    @lasperpen đã viết:quăng cái link forum lên đây
    Đây thí chủ: http://huyvip783.forumvi.com/

  • LASPERPEN
    7. Re: [Topx] style xenforo
    avatar ADM
    @huyvip83 đã viết:
    @lasperpen đã viết:quăng cái link forum lên đây
    Đây thí chủ: http://huyvip783.forumvi.com/
    thay lại recent trên đây
    forum kiểm duyệt từ nên kèm theo last lỗi

  • huyvip83
    8. Re: [Topx] style xenforo
    avatar MEM LV3
    @lasperpen đã viết:
    @huyvip83 đã viết:
    @lasperpen đã viết:quăng cái link forum lên đây
    Đây thí chủ: http://huyvip783.forumvi.com/
    thay lại recent trên đây
    forum kiểm duyệt từ nên kèm theo last lỗi

    lasperpen....Hjj....chưa được đâu

  • LASPERPEN
    9. Re: [Topx] style xenforo
    avatar ADM
    đọc kỹ lại phần bên dưới WIDGET


    --Chữ ký--
    Khách viếng thăm nhìn cưng vậy cho hun cái coi Smile
  • huyvip83
    10. Re: [Topx] style xenforo
    avatar MEM LV3
    @lasperpen đã viết:đọc kỹ lại phần bên dưới WIDGET
    xem lại WIDGET rồi
    Recent thì để y như hướng dẫn " tức là để mỗi Recent trong WIDGET thôi "
    ....nhưng vẫn chưa được...không biết là mắc ở đâu

  • LASPERPEN
    11. Re: [Topx] style xenforo
    avatar ADM

    Hướng dẫn thay tabs link

    Cách thay tab cho phù hợp với chuyên mục gồm 2 đoạn code trong recent

    Code:
      <div data="1" class="last">Tabs 1</div>
           <div data="2" class="last">Tabs 2</div>
           <div data="3" class="last">Tabs 3</div>  
           <div data="4" class="last">Tabs 4</div>

    và theo thứ tự tương tự như bên dưới
    Code:
        <ol id="lastest" class="muc_post baimoi forum1"></ol>
         <ol id="lastest" class="muc_post baimoi forum2"></ol>
         <ol id="lastest" class="muc_post baimoi forum3"></ol>
         <ol id="lastest" class="muc_post baimoi forum4"></ol>

    trong đó data="1" là số của chuyên mục

    như trong hình dưới


    --Chữ ký--
    Khách viếng thăm nhìn cưng vậy cho hun cái coi Smile
  • huyvip83
    12. Re: [Topx] style xenforo
    avatar MEM LV3
    @lasperpen đã viết:

    Hướng dẫn thay tabs link


    Cách thay tab cho phù hợp với chuyên mục gồm 2 đoạn code trong recent

    Code:
      <div data="1" class="last">Tabs 1</div>
           <div data="2" class="last">Tabs 2</div>
           <div data="3" class="last">Tabs 3</div>  
           <div data="4" class="last">Tabs 4</div>

    và theo thứ tự tương tự như bên dưới
    Code:
        <ol id="lastest" class="muc_post baimoi forum1"></ol>
         <ol id="lastest" class="muc_post baimoi forum2"></ol>
         <ol id="lastest" class="muc_post baimoi forum3"></ol>
         <ol id="lastest" class="muc_post baimoi forum4"></ol>

    trong đó data="1" là số của chuyên mục

    như trong hình dưới
    vẫn không làm được chấp nhận bó tay

  • LASPERPEN
    13. Re: [Topx] style xenforo
    avatar ADM
    thay topics list box khác rồi s sài đc

    không chịu xem kỹ bài rồi đăng lên  


    --Chữ ký--
    Khách viếng thăm nhìn cưng vậy cho hun cái coi Smile
  • huyvip83
    14. Re: [Topx] style xenforo
    avatar MEM LV3
    @lasperpen đã viết:thay topics list box khác rồi s sài đc

    không chịu xem kỹ bài rồi đăng lên  
    cái Last vẫn vậy mà có thay gì đâu

  • LASPERPEN
    15. Re: [Topx] style xenforo
    avatar ADM
    cạn lời @Admin giải thích giùm e đi Smile


    --Chữ ký--
    Khách viếng thăm nhìn cưng vậy cho hun cái coi Smile
  • Sponsored content
    16. Re: [Topx] style xenforo

Thông tin tác giả
avatar
ADM
Bài viết :
186
Points :
384
Like :
140
Invision
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
avatar
MEM LV1
Bài viết :
10
Points :
16
Like :
2
Punbb
An toàn
Status :
:v Lểu lểu
Xem lý lịch thành viên
Thông tin tác giả
avatar
ADM
Bài viết :
186
Points :
384
Like :
140
Invision
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
avatar
MEM LV3
Bài viết :
202
Points :
343
Like :
65
Punbb
Cẩn thận
Xem lý lịch thành viên
Thông tin tác giả
avatar
ADM
Bài viết :
186
Points :
384
Like :
140
Invision
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
avatar
MEM LV3
Bài viết :
202
Points :
343
Like :
65
Punbb
Cẩn thận
Xem lý lịch thành viên
Thông tin tác giả
avatar
ADM
Bài viết :
186
Points :
384
Like :
140
Invision
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
avatar
MEM LV3
Bài viết :
202
Points :
343
Like :
65
Punbb
Cẩn thận
Xem lý lịch thành viên
Thông tin tác giả
avatar
ADM
Bài viết :
186
Points :
384
Like :
140
Invision
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
avatar
MEM LV3
Bài viết :
202
Points :
343
Like :
65
Punbb
Cẩn thận
Xem lý lịch thành viên
Thông tin tác giả
avatar
ADM
Bài viết :
186
Points :
384
Like :
140
Invision
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
avatar
MEM LV3
Bài viết :
202
Points :
343
Like :
65
Punbb
Cẩn thận
Xem lý lịch thành viên
Thông tin tác giả
avatar
ADM
Bài viết :
186
Points :
384
Like :
140
Invision
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
Thông tin tác giả
avatar
MEM LV3
Bài viết :
202
Points :
343
Like :
65
Punbb
Cẩn thận
Xem lý lịch thành viên
Thông tin tác giả
avatar
ADM
Bài viết :
186
Points :
384
Like :
140
Invision
Quản trị
Status :
Hồi xưa mình đẹp trai lắm...Bây giờ đỡ nhiều rồi
Xem lý lịch thành viên http://www.hotrofm.net/u4
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