Hướng dẫn Portal 2 TenMien.Trade

Nhân dịp em vừa thi học kì xong, lại được nghỉ 30/04 - 01/05 nên em share luôn cái trang chủ của TenMien.Trade. Đây là dạng XenPorta 2, vì vậy các bác lục lọi trong VNXF tìm addon này và cài vào nhé. Vào chủ đề chính luôn

1. Demo
2. Đầu tiên, các bác đảm bảo giúp em là đã cài XenPorta 2 Pro nhé.
3. Tiếp theo, thay các template đây theo code của từng cái:
   1. EWRporta2.css
      
      Mã:

      /* --- EWRporta2.css --- */
      
      .xenForm .textHeading .selectAll {
        float: right;
      }
      
      .xenForm .categoryUnit li {
        display: inline-block;
        width: 185px;
      }
      
      .xenForm .categoryUnit dd {
        padding-right: 0px;
      }
      
      .authorUnit .authorImage {
        float: left;
      }
      
      .authorUnit .authorImage .img {
        display: block;
        width: 150px;
        height: 200px;
      }
      
      .authorUnit .secondaryContent {
        margin-left: 160px;
      }
      
      .authorUnit .secondaryContent .controls {
        float: right;
        margin-right: 10px;
      }
      
      .authorUnit .secondaryContent .avatar {
        float: right;
      }
      
      .authorUnit .secondaryContent .name {
        font-size: 28px;
      }
      
      .authorUnit .secondaryContent .muted {
        margin-bottom: 15px;
      }
      
      /* clearfix */
      
      .authorUnit {
        zoom: 1;
      }
      
      .authorUnit:after {
        content: '.';
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
      }
      
      .iconKey {
        float: left;
        margin: 0 4px 0 0;
        height: 16px;
        width: 16px;
        background: transparent url('styles/default/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365-ui-sprite.png') no-repeat 1000px 0;
      }
      
      .iconKey.category {
        background-position: 0px 1px;
        width: 14px;
      }
      
      .iconKey.sticky {
        background-position: 0px -16px;
      }
      
      .iconKey.redirect {
        background-position: -48px -16px;
      }
      
      .iconKey.redirect {
        background-position: -48px -16px;
      }
      
      .iconKey.comments {
        background-position: -65px -16px;
        width: 14px;
      }
      
      .iconKey.views {
        background-position: -144px -17px;
        width: 18px;
      }
      
      .xenForm .date {
        background-image: url("styles/8wayrun/calendar.png");
        background-position: right center;
        background-repeat: no-repeat;
      }
      
      .copyright {
        text-align: center;
        font-size: 11px;
        margin: 10px;
        clear: both;
      }

   2. EWRporta2_ArticleList.css
      
      Mã:

      /* --- EWRporta2_ArticleList.css --- */
      
      .articleControl {
        display: none;
        position: fixed;
        right: 10px;
        bottom: 0;
        z-index: 1000;
      }
      
      .articleControl .resume {
        display: none;
      }
      
      .articleControl .resume .muted {
        margin-bottom: 5px;
        font-size: 10px;
        text-align: center;
      }
      
      .articleItem .singleLine {
        white-space: nowrap;
        overflow: hidden;
        text-overflow: ellipsis;
      }
      
      .articleItem .sectionMain {
        margin-bottom: 10px;
      }
      
      .articleItem .subHeading {
        font-size: 18px;
      }
      
      .articleItem .sectionFooter .iconKey {
        margin-top: 3px;
      }
      
      .articleItem .sectionFooter .continue {
        float: right;
      }
      
      .articleItem .sectionFooter .categories {
        margin-right: 90px;
        overflow: hidden;
      }
      
      .articleItem .sectionFooter .categories li {
        display: inline-block;
      }
      
      /* clearfix */
      
      .articleItem .primaryContent {
        zoom: 1;
      }
      
      .articleItem .primaryContent:after {
        content: '.';
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
      }
      
      /* clearfix */
      
      .articleItem .sectionFooter {
        zoom: 1;
      }
      
      .articleItem .sectionFooter:after {
        content: '.';
        display: block;
        height: 0;
        clear: both;
        visibility: hidden;
      }
      
      .articleItem .dateBlock {
        float: left;
        margin: 10px 10px 0px -20px;
        text-align: center;
        position: relative;
        z-index: 100;
      }
      
      .articleItem .dateBlock .heading {
        margin: 0;
        padding-bottom: 5px;
        text-transform: uppercase;
      }
      
      .articleItem .dateBlock .secondaryContent {
        padding: 5px;
        font-weight: bold;
        font-size: 24px;
      }
      
      .articleItem .excerptOffset {
        margin-left: 34px;
      }
      
      .articleItem .headerBlock a {
        display: block;
        background-size: 100%;
        line-height: 0;
      }
      
      .articleItem .headerBlock a img {
        max-width: 100%;
      }
      
      .articleItem .messageUserBlock {
        float: right;
        margin-left: 10px;
      }
      
      .articleItem .messageUserBlock a {
        display: block;
        background-size: 100%;
        line-height: 0;
      }
      
      .articleItem .messageUserBlock a img {
        max-width: 200px;
        height: auto;
      }
      
      .articleItem .metaData {
        margin-bottom: 10px;
        padding-bottom: 5px;
        border-bottom: 1px dashed #f9fbfc;
      }
      
      .articleItem .statData {
        float: right;
        margin-left: 10px;
      }
      
      #infscr-loading {
        position: fixed;
        right: 10px;
        bottom: 0;
        z-index: 1001;
        text-align: center;
        background-color: #f9fbfc;
        padding: 20px;
        margin: 40px auto;
        border: 1px solid #f0f0f2;
        border-radius: 1px;
      }
      
      @media (max-width:610px) {
        .Responsive .articlesGrid .articleItem {
          width: 100%;
        }
      }
      
      @media (max-width:480px) {
        .Responsive .articlesGrid .articleItem .messageUserBlock {
          display: inline-block;
          float: none;
          margin-bottom: 10px;
          white-space: nowrap;
        }
      }
      #articlesGrid {
        border-top: 10px solid #e6e6e6;
        background: url('https://tenmien.trade/styles/intrinsic/extra/bg-recent-content.png') 133px 0 repeat-y;
      }
      
      #articlesGrid .articleItem {
        background: url('https://tenmien.trade/styles/intrinsic/extra/bg-hentry.png') no-repeat 0 35px;
        padding-left: 170px;
        border-bottom: 1px solid #e6e6e6;
        position: relative;
        padding-top: 30px;
        padding-bottom: 30px;
      }
      
      #articlesGrid .subItemHeading {
        font-weight: 400;
        margin-bottom: 10px;
        font-size: 26px;
      }
      
      #articlesGrid .primaryContent {
        padding: 0;
        line-height: 1.6;
      }
      
      #articlesGrid ul.categories {
        position: absolute;
        top: 40px;
        left: 5px;
        font-size: 13px;
        display: inline-flex;
      }
      
      #articlesGrid ul.categories li {
        padding-right: 10px;
      }
      

   3. EWRporta2_ArticleList_Bit
      
      Mã:

      
        
      
          
      
            {xen:helper threadPrefix, $article}
            {$article.article_title}
          
      
          
      
            
      
              
      {xen:number $article.reply_count}
              
      {xen:number $article.view_count}
      
              
                          
      
                          {xen:phrase porta2_by_x_on_y_at_z,
                              'user={$article.username}',
                              'date={xen:date $article.article_date}',
                              'time={xen:time $article.article_date}'}
                      
            
      
            
      
              
                
      
                  
                    
                      
                      
                      
                      
                      
                    
                  
              
              
      {xen:raw $article.messageHtml}