Styles Style XenPorta 2 - SEOMXH

thuyet951 · 24/04/2016

hardcore nói: ↑

@thuyet951 Bác convert portal trang techrum sang portal 2 được không ạ ?
Click to expand...

Được, sẽ share cái đó cho XenPorta 2 trong thời gian tới, giờ đang bạn làm dự án.

chientc · 30/09/2016

thuyet951 nói: ↑

Mình thấy có nhiều người thích cái Style XenPorta 2 của SEOMXH, vì vậy sau khi rip xong mình đã trích riêng ra cho anh em nào thích thì lấy về sử dụng.

Link tải XenPorta 2 thì anh em xem ở bài viết này: http://vnxf.vn/8wayrun-com-xenporta-2-portal-pro-1-1-7a.t5752.html/page-2#post-37043
Live demo: http://vpet.vn/index.php
Nào!, bây giờ chúng ta bắt đầu thay đổi template nhé.
Trước tiên chúng ta cần sửa lại đôi chút kết cấu của XenForo đã, các bạn mở template "PAGE_CONTAINER"
Tìm đoạn code sau:

Mã:

                        

                        
                        
                            {xen:raw $topctrl}
                            1

Sau đó thay đoạn code phía trên bằng đoạn code dưới đây:

Mã:

                
                
                        

                        
                        
                            {xen:raw $topctrl}
                            1

Phần kết cấu xong rồi, bây giờ chúng ta bắt tay vào áp dụng cho XenPorta 2 thôi nào.
Các bạn tìm và mở Template "EWRporta2_ArticleList" sau đó thay tất cả bằng code dưới đây.

Mã:




    {xen:phrase porta2_author}: {$author.author_name}
    {xen:phrase porta2_author}: {$author.author_name}
    {xen:phrase porta2_viewing_only_articles_authored_by_x, 'author={$author.author_name}'}

    
        
        
    

    
        {xen:phrase porta2_articles}
        {xen:phrase porta2_authors}
    

    {$category.category_name}
    {$category.category_name}
    
        
            {$category.category_desc}
        
            {xen:phrase porta2_viewing_only_articles_categorized_with_x, 'cat={$category.category_name}'}
        
    

    
        
        
    

    
        {xen:phrase porta2_articles}
    

    {$xenOptions.boardTitle}
    {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}

    
        
    

    
        
    



    
        {xen:link 'canonical:articles'}
        {$xenOptions.boardTitle}
        {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}
        website
    


articles







    1
    
    



    1
    



    
        
            featuresGrid
            {$xenOptions.EWRporta2_features_relocate}
        
    



    



    

        {$xenOptions.boardTitle}
        
        {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}
    
    
        
            
        
            
        
    



    
        {xen:phrase porta2_pause_infinite_scrolling}
        
            {xen:phrase porta2_change_article_list_settings}
            {xen:phrase porta2_resume_infinite_scrolling}

- Tiếp theo các bạn tìm tiếp template "EWRporta2_ArticleList_Bit" mở nó lên và thay bằng code dưới đây:

Mã:


                
                    
                    
                     {$article.article_title}
                    
                           
                              {$article.username}
                                
                                 {xen:date $article.article_date, 'd'}/{xen:date $article.article_date, 'm'}/{xen:date $article.article_date, 'y'}
                            
                              {xen:number $article.share_count}  {xen:number $article.reply_count}  {xen:number $article.view_count}
                            
                        
                        
                            
                            
                    
                    
                        
                    
                        
                            
                                
                                    
                                
                                    
                                
                            
                        
                            
                        
                            
                                    
                            
                        
                    
                    

                            
                            
                            

                {xen:raw $article.messageHtml}

                
                    {$article.article_break}...

Vậy là phần trang chủ XenPorta 2 đã được chúng ta định dạng, cuối cùng các bạn mở template "EWRporta2.css" và thêm vào dưới cùng đoạn css dưới đây.

Mã:

.EWRporta2_ArticleList .breadBoxTop, .EWRporta2_ArticleList .breadBoxBottom {
    display: none;
}
.EWRporta2_ArticleList .titleBar {
    display: none;
}
#T-Styles-Porta2 .titleBar {
    display: none
}
.introduce_supplier {
    background: url('@imagePath/img/introduceS.png');
    padding: 12px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    border: 1px solid rgb(226, 226, 226)
}
.introduce_supplier h2 {
    color: #3a5795;
    font-size: 20px;
    padding-bottom: 10px;
    text-align: center;
    font-weight: 700
}
@media (max-width: 480px) {
    .introduce_supplier h2 {
        font-size: 14px
    }
}
.introduce_supplier .desc {
    color: #666;
    font-style: italic;
    line-height: 20px;
    text-align: justify;
    text-align: justify
}
#T-Styles-Porta2 {
    padding-left: 35px;
    padding-bottom: 20px;
    background: url('@imagePath/img/line.gif') repeat-y 10px;
    zoom: 1;
}
#T-Styles-Porta2 .main {
    width: 100%;
    padding-top: 25px
}
#T-Styles-Porta2 .suppliers {
    -webkit-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid rgb(226, 226, 226);
    background: #FFF;
    margin-bottom: 15px;
    position: relative
}
#T-Styles-Porta2 .suppliers .dot {
    background-image: url('@imagePath/img/dot.png');
    background-repeat: no-repeat;
    background-position: 0 0;
    position: absolute;
    width: 20px;
    height: 20px;
    left: -34px;
    top: 82px;
}
#T-Styles-Porta2 .suppliers .dot_icon_2_t {
    background-position: 0 -20px
}
#T-Styles-Porta2 .suppliers .dot_icon_5_t {
    background-position: 0 -40px
}
#T-Styles-Porta2 .suppliers .dot_icon_4_t {
    background-position: 0 -60px
}
#T-Styles-Porta2 .suppliers .dot_icon_213_t {
    background-position: 0 -80px
}
#T-Styles-Porta2 .suppliers .dot_icon_87_t {
    background-position: 0 -100px
}
#T-Styles-Porta2 .suppliers .dot_icon_69_t {
    background-position: 0 -120px
}
#T-Styles-Porta2 .suppliers .dot_icon_67_t {
    background-position: 0 -140px
}
#T-Styles-Porta2 .suppliers .dot_icon_63_t {
    background-position: 0 -160px
}
#T-Styles-Porta2 .suppliers .dot_icon_70_t {
    background-position: 0 -180px
}
#T-Styles-Porta2 .suppliers .dot_icon_71_t {
    background-position: 0 -200px
}
#T-Styles-Porta2 .suppliers .dot_icon_74_t {
    background-position: 0 -220px
}
#T-Styles-Porta2 .suppliers .dot_icon_72_t {
    background-position: 0 -240px
}
#T-Styles-Porta2 .suppliers .dot_icon_84_t {
    background-position: 0 -260px
}
#T-Styles-Porta2 .suppliers .dot_icon_83_t {
    background-position: 0 -280px
}
#T-Styles-Porta2 .suppliers .dot_icon_77_t {
    background-position: 0 -300px
}
#T-Styles-Porta2 .suppliers .dot_icon_220_t {
    background-position: 0 -320px
}
#T-Styles-Porta2 .suppliers .dot_icon_112_t {
    background-position: 0 -340px
}
#T-Styles-Porta2 .suppliers .dot_icon_221_t {
    background-position: 0 -360px
}
#T-Styles-Porta2 .suppliers .dot_icon_115_t {
    background-position: 0 -380px
}
#T-Styles-Porta2 .suppliers .dot_icon_122_t {
    background-position: 0 -400px
}
#T-Styles-Porta2 .suppliers .dot_icon_73_t {
    background-position: 0 -420px
}
#T-Styles-Porta2 .suppliers .dot_icon_110_t {
    background-position: 0 -440px
}
#T-Styles-Porta2 .suppliers .dot_icon_111_t {
    background-position: 0 -460px
}
#T-Styles-Porta2 .suppliers .dot_icon_46_t {
    background-position: 0 -480px
}
#T-Styles-Porta2 .suppliers .dot_icon_96_t {
    background-position: 0 -500px
}
#T-Styles-Porta2 .suppliers .dot_icon_97_t {
    background-position: 0 -520px
}
#T-Styles-Porta2 .suppliers .dot_icon_98_t {
    background-position: 0 -540px
}
#T-Styles-Porta2 .suppliers .dot_icon_99_t {
    background-position: 0 -560px
}
#T-Styles-Porta2 .suppliers .dot_icon_57_t {
    background-position: 0 -580px
}
#T-Styles-Porta2 .suppliers .arrow {
    width: 11px;
    height: 22px;
    background: url('@imagePath/img/arrow.png') no-repeat 0 0;
    position: absolute;
    left: -11px;
    top: 80px
}
#T-Styles-Porta2 .suppliers_area {
    display: table;
    table-layout: fixed;
    width: 100%;
    word-wrap: normal;
    padding: 15px;
    border-top: 1px solid rgb(240, 240, 240);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    text-align: justify;
    text-justify: newspaper
}
#T-Styles-Porta2 .suppliers_area .suppliers_left {
    float: left;
    width: 300px;
    height: 225px;
    margin-right: 15px
}
#T-Styles-Porta2 .suppliers_area .suppliers_author {
    font-size: 11px;
    color: #666;
    line-height: 20px;
    text-decoration: none
}
#T-Styles-Porta2 .suppliers_area .suppliers_author a:hover {
    color: #FF4163;
    text-decoration: none
}
#T-Styles-Porta2 h2.suppliers_promotion a:hover {
    color: #FF4163;
    text-decoration: none
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_img {
    width: 300px;
    height: 225px;
    overflow: hidden;
    position: absolute;
    left: 15px;
    top: 15px
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_img img {
    width: 300px;
    height: auto
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_desc {
    position: absolute;
    left: 330px;
    font-size: 13px;
    padding-right: 15px;
    color: #666;
    font-style: italic;
    line-height: 22px
}
#T-Styles-Porta2 .suppliers_promotion {
    font-size: 20px;
    background: rgb(250, 250, 250);
    padding: 15px;
    font-weight: 700
}
#T-Styles-Porta2 .suppliers_promotion b {
    color: #FF4163
}
#T-Styles-Porta2 .suppliers_promotion a:hover {
    color: #FF4163;
    text-decoration: none
}
.suppliers_ribbon {
    position: absolute;
    right: -6px;
    top: -6px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right
}
.suppliers_ribbon span {
    font-size: 10px;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 100px;
    display: block;
    background: #79A70A;
    background: linear-gradient(#FF728B 0%, #FF4163 100%);
    -webkit-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    -moz-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    -khtml-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    position: absolute;
    top: 19px;
    right: -21px
}
.suppliers_ribbon span::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid #FF4163;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #FF4163
}
.suppliers_ribbon span::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid transparent;
    border-right: 3px solid #FF4163;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #FF4163
}
.PageNavsuppliers {
    background: url('@imagePath/img/introduceS.png');
    padding: 12px;
    -webkit-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    border: 1px solid rgb(226, 226, 226)
}
.PageNavsuppliers .PageNav .itemL {
    float: right
}
.natMenuLevel0 {
    padding-left: 0px
}
.natMenuLevel1 {
    padding-left: 10px
}
.natMenuLevel2 {
    padding-left: 20px
}
.natMenuLevel3 {
    padding-left: 30px
}
.natMenuLevel4 {
    padding-left: 40px
}
.natMenuLevel5 {
    padding-left: 50px
}
.natMenuLevel6 {
    padding-left: 60px
}
.natMenuLevel7 {
    padding-left: 70px
}
.natMenuLevel8 {
    padding-left: 80px
}
.natMenuLevel9 {
    padding-left: 90px
}
.natMenuLevel10 {
    padding-left: 100px
}
.bbCodeImage {
    max-width: 100%
}
.content_threadinfo {
    float: left;
    overflow: hidden;
    position: relative;
    margin-bottom: 10px;
    border-bottom: 1px dashed #d7edfc;
    width: 100%
}
.avatarNews {
    display: block;
    float: left;
    margin: 0 5px 0 0px
}

.content_threadinfo .meta {
    display: block;
    min-height: 50px;
    float: left
}
.content_threadinfo .user {
    margin: 0px 0px 5px 0px;
    font-size: 12px;
    font-weight: 700;
    line-height: 19px
}
.content_threadinfo .DateTime {
    display: block;
    font-size: 11px
}
.content_threadinfo .like {
    color: #196eee;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
.content_threadinfo .reply {
    color: #da4531;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
.content_threadinfo .view {
    color: #009957;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
#T-Styles-Porta2 .suppliers_area .newsText {
    font-size: 15px;
    line-height: 1.4;
    font-weight: 350;
    text-align: justify;
    text-justify: newspaper
}
@media (max-width: 961px) {}@media (max-width: 641px) {
    .content_threadinfo .like,
    .content_threadinfo .reply,
    .content_threadinfo .view {
        font-size: 11px;
        padding: 2px 0 0 5px
    }
    #T-Styles-Porta2 .suppliers_area .newsText,
    .content_threadinfo .user {
        font-size: 12px
    }
    .content_threadinfo .DateTime {
        font-size: 11px
    }
    #T-Styles-Porta2 .suppliers_area {
        display: none
    }
    #T-Styles-Porta2 .suppliers_promotion {
        font-size: 14px
    }
    #T-Styles-Porta2 .suppliers .dot {
        top: 20px
    }
    #T-Styles-Porta2 .suppliers .arrow {
        top: 18px
    }
}
@media (max-width: 481px) {
    .content_threadinfo .like,
    .content_threadinfo .reply,
    .content_threadinfo .view {
        font-size: 10px;
        padding: 2px 0 0 5px
    }
    #T-Styles-Porta2 .suppliers_area .newsText,
    .content_threadinfo .user {
        font-size: 11px
    }
    .content_threadinfo .DateTime {
        font-size: 10px
    }
    #T-Styles-Porta2 .suppliers_area {
        display: none
    }
    #T-Styles-Porta2 .suppliers_promotion {
        font-size: 13px
    }
    #T-Styles-Porta2 .suppliers .dot {
        top: 20px
    }
    #T-Styles-Porta2 .suppliers .arrow {
        top: 18px
    }
}
.grid {
    position: relative;
    margin: -3.3% -3% 0 -3%;
    _padding: 1em 0 4em;
    _max-width: 1000px;
    list-style: none;
    text-align: center;
}

/* Common style */
.grid .T-Thread-UserInfo {
    position: absolute;
    bottom: 10px;
    left: 10px;
}
.grid .T-Thread-UserInfo a {
    color: #fff;
    }
.grid .T-Thread-UserInfo span {
    font-size: 18px;
    margin-top: -30px;
}
.grid .T-Thread-Avarta {
    float: left;
    margin-right: 15px;
}
.grid figure {
    position: relative;
    _float: left;
    overflow: hidden;
    margin: 10px 1%;
    _min-width: 320px;
    _max-width: 480px;
    _max-height: 360px;
    _width: 48%;
    background: #3085a3;
    text-align: center;
    cursor: pointer;
}

.grid figure img {
    position: relative;
    display: block;
    min-height: 100%;
    max-width: 100%;
    opacity: 0.8;
}

.grid figure figcaption {
    _padding: 10px 20px;
    color: #fff;
    _text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
    pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.grid figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}

.grid figure h2 {
    _word-spacing: -0.15em;
    font-weight: 300;
    font-size: 21px;
}

.grid figure h2 span {
    font-weight: 800;
}

.grid figure h2,
.grid figure p {
    margin: 0;
}

.grid figure p {
    letter-spacing: 1px;
    font-size: 68.5%;
}
figure.effect-sarah {
    background: #42b078;
}

figure.effect-sarah img {
    max-width: none;
    width: -webkit-calc(100% + 20px);
    width: calc(100% + 20px);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

figure.effect-sarah:hover img {
    opacity: 0.4;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

figure.effect-sarah figcaption {
    text-align: left;
}

figure.effect-sarah h2 {
    position: relative;
    overflow: hidden;
    padding: 10px 15px;
    background-color: rgba(0, 0, 0, 0.25);
    text-transform: uppercase;
}

figure.effect-sarah h2::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: #F44336;
    content: '';
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0);
}

figure.effect-sarah:hover h2::after {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

figure.effect-sarah p {
    padding: 5px 15px;
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(100%,0,0);
    -webkit-transform: translate3d(100%,0,0);
    -moz-transform: translate3d(100%,0,0);
    -o-transform: translate3d(100%,0,0);
    -ms-transform: translate3d(100%,0,0);
    transform: translate3d(100%,0,0);
    background-color: rgba(0, 0, 0, 0.25);
}
figure.effect-sarah p a {
    color: #fff;
}
figure.effect-sarah:hover p {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
@media screen and (max-width: 50em) {
    .content {
        padding: 0 10px;
        text-align: center;
    }
    .grid figure {
        display: inline-block;
        float: none;
        margin: 10px auto;
        width: 100%;
    }
}

Ok, bây giờ chúng ta tiếp tục thêm chút "màu mè" cho phần bài viết được Promotion bởi XenPorta 2 nhé.
- Các bạn tìm và mở template "EWRporta2_ArticleView" sau đó thay tất cả bằng code dưới đây.

Mã:



{xen:helper threadPrefix, $thread, escaped}{$thread.title}{xen:helper pagenumber, $page}
{xen:helper threadPrefix, $thread}{$thread.title}


    {xen:phrase discussion_in_x_started_by_y_date_z,
        'forum={$forum.title}',
        'name={xen:helper username, $thread}',
        'date={xen:datetime $thread.post_date, html}'}



    



    
    
    

    
        
    
        
    
        
    

    
        {xen:link 'canonical:threads', $thread}
        {xen:helper threadPrefix, $thread, escaped}{$thread.title}
        {xen:helper snippet, $firstPost.message, 155}
        {xen:helper avatar, $thread, m, 0, 1}
    


{xen:helper nodeClasses, $nodeBreadCrumbs, $forum}{xen:if {$xenOptions.selectQuotable}, ' SelectQuotable'}




    
        {xen:phrase reply_to_thread}
    






                
                    
                            
                    
                    
                        
                    
                        
                            
                                
                                    
                                
                                    
                                
                            
                        
                            
                        
                            
                                    
                            
                        
                    
                    

                            
                        
                            {$thread.title}
                            {$forum.title}, {xen:datetime $thread.post_date, html}. Trả lời: {xen:number $article.reply_count}, lượt xem: {xen:number $article.view_count}.
                        
                        
                        
                        
                        
                        
                        {$article.username}
                        
                        

                    
                

    
        
            {xen:link full:threads, $thread}
        
    
        
            
                
                    1
                    
                
            
            
                
                    
                
            
            
                
                    {xen:phrase tweet}
                
            
        
    




    
        
            
                {xen:phrase porta2_article_tools}
                
                    {xen:phrase porta2_article_tools}
                    
                        
                            
                                {xen:phrase edit_thread}
                            
                                {xen:phrase edit_title}
                            
                            
                                {xen:phrase add_poll}
                            
                            
                                {xen:phrase delete_thread}
                            
                            
                                {xen:phrase move_thread}
                            
                            
                                {xen:phrase manage_reply_bans}
                            
                            
                                {xen:phrase moderator_actions}
                            
                            
                                {xen:phrase show_deleted_posts}
                            
                            
                        
                    
                
            
        
    

    
        
    



    
        
    



    



    
        
            
                
            

            {xen:phrase porta2_subcats}:

            
                
            

            
            
                
                    
                    
                        
                        {xen:phrase porta2_subcat_this_article_hint}
                    
                
                
            
            
        
    



    
        
            
                
            
                
            
        
    







    
        {xen:phrase comments}
        {xen:phrase discussion_in_x_started_by_y_date_z,
            'forum={$forum.title}',
            'name={xen:helper username, $thread}',
            'date={xen:datetime $thread.post_date, html}'}
    

    
        
        
            {xen:phrase porta2_local_comments}
        
        
            {xen:phrase porta2_disqus_comments}
        
        
            {xen:phrase porta2_facebook_comments}
        
        
    

    
        
            
        
        
            
        
        
            
        
    



    {xen:link 'canonical:threads', $thread}

Bây giờ quay lại trang chủ và F5 để xem thay đổi thôi nào.
Chú ý: có thể nhiều style sẽ hiển thị đôi chút sai lệnh, nếu gặp lổi các bạn thảo luận tại chủ đề này luôn nhé.
Quên mất, các bạn tải thư mục "img" dưới đính kèm và upload lên thư mục style các bạn đang sử dụng nhẹ.

Click to expand...

Chay đk 1.5.7 k bác

vuongbkdn · 21/10/2016

mình muốn khi vào cái này http://minhthangvina.com.vn/bet365 có những phương thức nạp tiền nào_link vào bet365_điểm số trực tiếp bet365/index.php thì nó ở ngay chữ trang chủ chứ không phải chữ diễn đàn, nó như https://seomxh.com/ vậy. và trang chủ thì hiển thị nội dung như https://seomxh.com/ vậy. nhờ các bác chỉ giúp.

quanken · 29/10/2016

Làm theo mà không được nhỉ @@

chientc · 12/12/2016

thuyet951 nói: ↑

Mình thấy có nhiều người thích cái Style XenPorta 2 của SEOMXH, vì vậy sau khi rip xong mình đã trích riêng ra cho anh em nào thích thì lấy về sử dụng.

Link tải XenPorta 2 thì anh em xem ở bài viết này: http://vnxf.vn/8wayrun-com-xenporta-2-portal-pro-1-1-7a.t5752.html/page-2#post-37043
Live demo: http://vpet.vn/index.php
Nào!, bây giờ chúng ta bắt đầu thay đổi template nhé.
Trước tiên chúng ta cần sửa lại đôi chút kết cấu của XenForo đã, các bạn mở template "PAGE_CONTAINER"
Tìm đoạn code sau:

Mã:

                        

                        
                        
                            {xen:raw $topctrl}
                            1

Sau đó thay đoạn code phía trên bằng đoạn code dưới đây:

Mã:

                
                
                        

                        
                        
                            {xen:raw $topctrl}
                            1

Phần kết cấu xong rồi, bây giờ chúng ta bắt tay vào áp dụng cho XenPorta 2 thôi nào.
Các bạn tìm và mở Template "EWRporta2_ArticleList" sau đó thay tất cả bằng code dưới đây.

Mã:




    {xen:phrase porta2_author}: {$author.author_name}
    {xen:phrase porta2_author}: {$author.author_name}
    {xen:phrase porta2_viewing_only_articles_authored_by_x, 'author={$author.author_name}'}

    
        
        
    

    
        {xen:phrase porta2_articles}
        {xen:phrase porta2_authors}
    

    {$category.category_name}
    {$category.category_name}
    
        
            {$category.category_desc}
        
            {xen:phrase porta2_viewing_only_articles_categorized_with_x, 'cat={$category.category_name}'}
        
    

    
        
        
    

    
        {xen:phrase porta2_articles}
    

    {$xenOptions.boardTitle}
    {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}

    
        
    

    
        
    



    
        {xen:link 'canonical:articles'}
        {$xenOptions.boardTitle}
        {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}
        website
    


articles







    1
    
    



    1
    



    
        
            featuresGrid
            {$xenOptions.EWRporta2_features_relocate}
        
    



    



    

        {$xenOptions.boardTitle}
        
        {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}
    
    
        
            
        
            
        
    



    
        {xen:phrase porta2_pause_infinite_scrolling}
        
            {xen:phrase porta2_change_article_list_settings}
            {xen:phrase porta2_resume_infinite_scrolling}

- Tiếp theo các bạn tìm tiếp template "EWRporta2_ArticleList_Bit" mở nó lên và thay bằng code dưới đây:

Mã:


                
                    
                    
                     {$article.article_title}
                    
                           
                              {$article.username}
                                
                                 {xen:date $article.article_date, 'd'}/{xen:date $article.article_date, 'm'}/{xen:date $article.article_date, 'y'}
                            
                              {xen:number $article.share_count}  {xen:number $article.reply_count}  {xen:number $article.view_count}
                            
                        
                        
                            
                            
                    
                    
                        
                    
                        
                            
                                
                                    
                                
                                    
                                
                            
                        
                            
                        
                            
                                    
                            
                        
                    
                    

                            
                            
                            

                {xen:raw $article.messageHtml}

                
                    {$article.article_break}...

Vậy là phần trang chủ XenPorta 2 đã được chúng ta định dạng, cuối cùng các bạn mở template "EWRporta2.css" và thêm vào dưới cùng đoạn css dưới đây.

Mã:

.EWRporta2_ArticleList .breadBoxTop, .EWRporta2_ArticleList .breadBoxBottom {
    display: none;
}
.EWRporta2_ArticleList .titleBar {
    display: none;
}
#T-Styles-Porta2 .titleBar {
    display: none
}
.introduce_supplier {
    background: url('@imagePath/img/introduceS.png');
    padding: 12px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    border: 1px solid rgb(226, 226, 226)
}
.introduce_supplier h2 {
    color: #3a5795;
    font-size: 20px;
    padding-bottom: 10px;
    text-align: center;
    font-weight: 700
}
@media (max-width: 480px) {
    .introduce_supplier h2 {
        font-size: 14px
    }
}
.introduce_supplier .desc {
    color: #666;
    font-style: italic;
    line-height: 20px;
    text-align: justify;
    text-align: justify
}
#T-Styles-Porta2 {
    padding-left: 35px;
    padding-bottom: 20px;
    background: url('@imagePath/img/line.gif') repeat-y 10px;
    zoom: 1;
}
#T-Styles-Porta2 .main {
    width: 100%;
    padding-top: 25px
}
#T-Styles-Porta2 .suppliers {
    -webkit-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid rgb(226, 226, 226);
    background: #FFF;
    margin-bottom: 15px;
    position: relative
}
#T-Styles-Porta2 .suppliers .dot {
    background-image: url('@imagePath/img/dot.png');
    background-repeat: no-repeat;
    background-position: 0 0;
    position: absolute;
    width: 20px;
    height: 20px;
    left: -34px;
    top: 82px;
}
#T-Styles-Porta2 .suppliers .dot_icon_2_t {
    background-position: 0 -20px
}
#T-Styles-Porta2 .suppliers .dot_icon_5_t {
    background-position: 0 -40px
}
#T-Styles-Porta2 .suppliers .dot_icon_4_t {
    background-position: 0 -60px
}
#T-Styles-Porta2 .suppliers .dot_icon_213_t {
    background-position: 0 -80px
}
#T-Styles-Porta2 .suppliers .dot_icon_87_t {
    background-position: 0 -100px
}
#T-Styles-Porta2 .suppliers .dot_icon_69_t {
    background-position: 0 -120px
}
#T-Styles-Porta2 .suppliers .dot_icon_67_t {
    background-position: 0 -140px
}
#T-Styles-Porta2 .suppliers .dot_icon_63_t {
    background-position: 0 -160px
}
#T-Styles-Porta2 .suppliers .dot_icon_70_t {
    background-position: 0 -180px
}
#T-Styles-Porta2 .suppliers .dot_icon_71_t {
    background-position: 0 -200px
}
#T-Styles-Porta2 .suppliers .dot_icon_74_t {
    background-position: 0 -220px
}
#T-Styles-Porta2 .suppliers .dot_icon_72_t {
    background-position: 0 -240px
}
#T-Styles-Porta2 .suppliers .dot_icon_84_t {
    background-position: 0 -260px
}
#T-Styles-Porta2 .suppliers .dot_icon_83_t {
    background-position: 0 -280px
}
#T-Styles-Porta2 .suppliers .dot_icon_77_t {
    background-position: 0 -300px
}
#T-Styles-Porta2 .suppliers .dot_icon_220_t {
    background-position: 0 -320px
}
#T-Styles-Porta2 .suppliers .dot_icon_112_t {
    background-position: 0 -340px
}
#T-Styles-Porta2 .suppliers .dot_icon_221_t {
    background-position: 0 -360px
}
#T-Styles-Porta2 .suppliers .dot_icon_115_t {
    background-position: 0 -380px
}
#T-Styles-Porta2 .suppliers .dot_icon_122_t {
    background-position: 0 -400px
}
#T-Styles-Porta2 .suppliers .dot_icon_73_t {
    background-position: 0 -420px
}
#T-Styles-Porta2 .suppliers .dot_icon_110_t {
    background-position: 0 -440px
}
#T-Styles-Porta2 .suppliers .dot_icon_111_t {
    background-position: 0 -460px
}
#T-Styles-Porta2 .suppliers .dot_icon_46_t {
    background-position: 0 -480px
}
#T-Styles-Porta2 .suppliers .dot_icon_96_t {
    background-position: 0 -500px
}
#T-Styles-Porta2 .suppliers .dot_icon_97_t {
    background-position: 0 -520px
}
#T-Styles-Porta2 .suppliers .dot_icon_98_t {
    background-position: 0 -540px
}
#T-Styles-Porta2 .suppliers .dot_icon_99_t {
    background-position: 0 -560px
}
#T-Styles-Porta2 .suppliers .dot_icon_57_t {
    background-position: 0 -580px
}
#T-Styles-Porta2 .suppliers .arrow {
    width: 11px;
    height: 22px;
    background: url('@imagePath/img/arrow.png') no-repeat 0 0;
    position: absolute;
    left: -11px;
    top: 80px
}
#T-Styles-Porta2 .suppliers_area {
    display: table;
    table-layout: fixed;
    width: 100%;
    word-wrap: normal;
    padding: 15px;
    border-top: 1px solid rgb(240, 240, 240);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    text-align: justify;
    text-justify: newspaper
}
#T-Styles-Porta2 .suppliers_area .suppliers_left {
    float: left;
    width: 300px;
    height: 225px;
    margin-right: 15px
}
#T-Styles-Porta2 .suppliers_area .suppliers_author {
    font-size: 11px;
    color: #666;
    line-height: 20px;
    text-decoration: none
}
#T-Styles-Porta2 .suppliers_area .suppliers_author a:hover {
    color: #FF4163;
    text-decoration: none
}
#T-Styles-Porta2 h2.suppliers_promotion a:hover {
    color: #FF4163;
    text-decoration: none
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_img {
    width: 300px;
    height: 225px;
    overflow: hidden;
    position: absolute;
    left: 15px;
    top: 15px
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_img img {
    width: 300px;
    height: auto
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_desc {
    position: absolute;
    left: 330px;
    font-size: 13px;
    padding-right: 15px;
    color: #666;
    font-style: italic;
    line-height: 22px
}
#T-Styles-Porta2 .suppliers_promotion {
    font-size: 20px;
    background: rgb(250, 250, 250);
    padding: 15px;
    font-weight: 700
}
#T-Styles-Porta2 .suppliers_promotion b {
    color: #FF4163
}
#T-Styles-Porta2 .suppliers_promotion a:hover {
    color: #FF4163;
    text-decoration: none
}
.suppliers_ribbon {
    position: absolute;
    right: -6px;
    top: -6px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right
}
.suppliers_ribbon span {
    font-size: 10px;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 100px;
    display: block;
    background: #79A70A;
    background: linear-gradient(#FF728B 0%, #FF4163 100%);
    -webkit-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    -moz-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    -khtml-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    position: absolute;
    top: 19px;
    right: -21px
}
.suppliers_ribbon span::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid #FF4163;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #FF4163
}
.suppliers_ribbon span::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid transparent;
    border-right: 3px solid #FF4163;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #FF4163
}
.PageNavsuppliers {
    background: url('@imagePath/img/introduceS.png');
    padding: 12px;
    -webkit-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    border: 1px solid rgb(226, 226, 226)
}
.PageNavsuppliers .PageNav .itemL {
    float: right
}
.natMenuLevel0 {
    padding-left: 0px
}
.natMenuLevel1 {
    padding-left: 10px
}
.natMenuLevel2 {
    padding-left: 20px
}
.natMenuLevel3 {
    padding-left: 30px
}
.natMenuLevel4 {
    padding-left: 40px
}
.natMenuLevel5 {
    padding-left: 50px
}
.natMenuLevel6 {
    padding-left: 60px
}
.natMenuLevel7 {
    padding-left: 70px
}
.natMenuLevel8 {
    padding-left: 80px
}
.natMenuLevel9 {
    padding-left: 90px
}
.natMenuLevel10 {
    padding-left: 100px
}
.bbCodeImage {
    max-width: 100%
}
.content_threadinfo {
    float: left;
    overflow: hidden;
    position: relative;
    margin-bottom: 10px;
    border-bottom: 1px dashed #d7edfc;
    width: 100%
}
.avatarNews {
    display: block;
    float: left;
    margin: 0 5px 0 0px
}

.content_threadinfo .meta {
    display: block;
    min-height: 50px;
    float: left
}
.content_threadinfo .user {
    margin: 0px 0px 5px 0px;
    font-size: 12px;
    font-weight: 700;
    line-height: 19px
}
.content_threadinfo .DateTime {
    display: block;
    font-size: 11px
}
.content_threadinfo .like {
    color: #196eee;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
.content_threadinfo .reply {
    color: #da4531;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
.content_threadinfo .view {
    color: #009957;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
#T-Styles-Porta2 .suppliers_area .newsText {
    font-size: 15px;
    line-height: 1.4;
    font-weight: 350;
    text-align: justify;
    text-justify: newspaper
}
@media (max-width: 961px) {}@media (max-width: 641px) {
    .content_threadinfo .like,
    .content_threadinfo .reply,
    .content_threadinfo .view {
        font-size: 11px;
        padding: 2px 0 0 5px
    }
    #T-Styles-Porta2 .suppliers_area .newsText,
    .content_threadinfo .user {
        font-size: 12px
    }
    .content_threadinfo .DateTime {
        font-size: 11px
    }
    #T-Styles-Porta2 .suppliers_area {
        display: none
    }
    #T-Styles-Porta2 .suppliers_promotion {
        font-size: 14px
    }
    #T-Styles-Porta2 .suppliers .dot {
        top: 20px
    }
    #T-Styles-Porta2 .suppliers .arrow {
        top: 18px
    }
}
@media (max-width: 481px) {
    .content_threadinfo .like,
    .content_threadinfo .reply,
    .content_threadinfo .view {
        font-size: 10px;
        padding: 2px 0 0 5px
    }
    #T-Styles-Porta2 .suppliers_area .newsText,
    .content_threadinfo .user {
        font-size: 11px
    }
    .content_threadinfo .DateTime {
        font-size: 10px
    }
    #T-Styles-Porta2 .suppliers_area {
        display: none
    }
    #T-Styles-Porta2 .suppliers_promotion {
        font-size: 13px
    }
    #T-Styles-Porta2 .suppliers .dot {
        top: 20px
    }
    #T-Styles-Porta2 .suppliers .arrow {
        top: 18px
    }
}
.grid {
    position: relative;
    margin: -3.3% -3% 0 -3%;
    _padding: 1em 0 4em;
    _max-width: 1000px;
    list-style: none;
    text-align: center;
}

/* Common style */
.grid .T-Thread-UserInfo {
    position: absolute;
    bottom: 10px;
    left: 10px;
}
.grid .T-Thread-UserInfo a {
    color: #fff;
    }
.grid .T-Thread-UserInfo span {
    font-size: 18px;
    margin-top: -30px;
}
.grid .T-Thread-Avarta {
    float: left;
    margin-right: 15px;
}
.grid figure {
    position: relative;
    _float: left;
    overflow: hidden;
    margin: 10px 1%;
    _min-width: 320px;
    _max-width: 480px;
    _max-height: 360px;
    _width: 48%;
    background: #3085a3;
    text-align: center;
    cursor: pointer;
}

.grid figure img {
    position: relative;
    display: block;
    min-height: 100%;
    max-width: 100%;
    opacity: 0.8;
}

.grid figure figcaption {
    _padding: 10px 20px;
    color: #fff;
    _text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
    pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.grid figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}

.grid figure h2 {
    _word-spacing: -0.15em;
    font-weight: 300;
    font-size: 21px;
}

.grid figure h2 span {
    font-weight: 800;
}

.grid figure h2,
.grid figure p {
    margin: 0;
}

.grid figure p {
    letter-spacing: 1px;
    font-size: 68.5%;
}
figure.effect-sarah {
    background: #42b078;
}

figure.effect-sarah img {
    max-width: none;
    width: -webkit-calc(100% + 20px);
    width: calc(100% + 20px);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

figure.effect-sarah:hover img {
    opacity: 0.4;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

figure.effect-sarah figcaption {
    text-align: left;
}

figure.effect-sarah h2 {
    position: relative;
    overflow: hidden;
    padding: 10px 15px;
    background-color: rgba(0, 0, 0, 0.25);
    text-transform: uppercase;
}

figure.effect-sarah h2::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: #F44336;
    content: '';
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0);
}

figure.effect-sarah:hover h2::after {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

figure.effect-sarah p {
    padding: 5px 15px;
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(100%,0,0);
    -webkit-transform: translate3d(100%,0,0);
    -moz-transform: translate3d(100%,0,0);
    -o-transform: translate3d(100%,0,0);
    -ms-transform: translate3d(100%,0,0);
    transform: translate3d(100%,0,0);
    background-color: rgba(0, 0, 0, 0.25);
}
figure.effect-sarah p a {
    color: #fff;
}
figure.effect-sarah:hover p {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
@media screen and (max-width: 50em) {
    .content {
        padding: 0 10px;
        text-align: center;
    }
    .grid figure {
        display: inline-block;
        float: none;
        margin: 10px auto;
        width: 100%;
    }
}

Ok, bây giờ chúng ta tiếp tục thêm chút "màu mè" cho phần bài viết được Promotion bởi XenPorta 2 nhé.
- Các bạn tìm và mở template "EWRporta2_ArticleView" sau đó thay tất cả bằng code dưới đây.

Mã:



{xen:helper threadPrefix, $thread, escaped}{$thread.title}{xen:helper pagenumber, $page}
{xen:helper threadPrefix, $thread}{$thread.title}


    {xen:phrase discussion_in_x_started_by_y_date_z,
        'forum={$forum.title}',
        'name={xen:helper username, $thread}',
        'date={xen:datetime $thread.post_date, html}'}



    



    
    
    

    
        
    
        
    
        
    

    
        {xen:link 'canonical:threads', $thread}
        {xen:helper threadPrefix, $thread, escaped}{$thread.title}
        {xen:helper snippet, $firstPost.message, 155}
        {xen:helper avatar, $thread, m, 0, 1}
    


{xen:helper nodeClasses, $nodeBreadCrumbs, $forum}{xen:if {$xenOptions.selectQuotable}, ' SelectQuotable'}




    
        {xen:phrase reply_to_thread}
    






                
                    
                            
                    
                    
                        
                    
                        
                            
                                
                                    
                                
                                    
                                
                            
                        
                            
                        
                            
                                    
                            
                        
                    
                    

                            
                        
                            {$thread.title}
                            {$forum.title}, {xen:datetime $thread.post_date, html}. Trả lời: {xen:number $article.reply_count}, lượt xem: {xen:number $article.view_count}.
                        
                        
                        
                        
                        
                        
                        {$article.username}
                        
                        

                    
                

    
        
            {xen:link full:threads, $thread}
        
    
        
            
                
                    1
                    
                
            
            
                
                    
                
            
            
                
                    {xen:phrase tweet}
                
            
        
    




    
        
            
                {xen:phrase porta2_article_tools}
                
                    {xen:phrase porta2_article_tools}
                    
                        
                            
                                {xen:phrase edit_thread}
                            
                                {xen:phrase edit_title}
                            
                            
                                {xen:phrase add_poll}
                            
                            
                                {xen:phrase delete_thread}
                            
                            
                                {xen:phrase move_thread}
                            
                            
                                {xen:phrase manage_reply_bans}
                            
                            
                                {xen:phrase moderator_actions}
                            
                            
                                {xen:phrase show_deleted_posts}
                            
                            
                        
                    
                
            
        
    

    
        
    



    
        
    



    



    
        
            
                
            

            {xen:phrase porta2_subcats}:

            
                
            

            
            
                
                    
                    
                        
                        {xen:phrase porta2_subcat_this_article_hint}
                    
                
                
            
            
        
    



    
        
            
                
            
                
            
        
    







    
        {xen:phrase comments}
        {xen:phrase discussion_in_x_started_by_y_date_z,
            'forum={$forum.title}',
            'name={xen:helper username, $thread}',
            'date={xen:datetime $thread.post_date, html}'}
    

    
        
        
            {xen:phrase porta2_local_comments}
        
        
            {xen:phrase porta2_disqus_comments}
        
        
            {xen:phrase porta2_facebook_comments}
        
        
    

    
        
            
        
        
            
        
        
            
        
    



    {xen:link 'canonical:threads', $thread}

Bây giờ quay lại trang chủ và F5 để xem thay đổi thôi nào.
Chú ý: có thể nhiều style sẽ hiển thị đôi chút sai lệnh, nếu gặp lổi các bạn thảo luận tại chủ đề này luôn nhé.
Quên mất, các bạn tải thư mục "img" dưới đính kèm và upload lên thư mục style các bạn đang sử dụng nhé.

Click to expand...

mình up vào xen 1511 bị lỗi ạ

EWRporta2_ArticleView
nó báo bị lỗi dòng 9 ạ

singh · 30/06/2017

làm theo mà sao nó không hiển thị gì vậy thớt???
https://webanchoi.com/

logliu21 · 30/06/2017

a/e cho em xin code hiện categories diễn đàn ra ngoài trang chủ xenporta đi

conkhidannb · 31/08/2017

bác nào test giúp được không, mình cũng làm 1 như bài viết mà không thấy thay đổi gì cả
Mình đang dùng xenporta 2 pro 1.2.2b bản mới nhất, xf 1.5.14

quick87 · 29/11/2017

thuyet951 nói: ↑

Mình thấy có nhiều người thích cái Style XenPorta 2 của SEOMXH, vì vậy sau khi rip xong mình đã trích riêng ra cho anh em nào thích thì lấy về sử dụng.

Link tải XenPorta 2 thì anh em xem ở bài viết này: http://vnxf.vn/8wayrun-com-xenporta-2-portal-pro-1-1-7a.t5752.html/page-2#post-37043
Live demo: http://vpet.vn/index.php
Nào!, bây giờ chúng ta bắt đầu thay đổi template nhé.
Trước tiên chúng ta cần sửa lại đôi chút kết cấu của XenForo đã, các bạn mở template "PAGE_CONTAINER"
Tìm đoạn code sau:

Mã:

                        

                        
                        
                            {xen:raw $topctrl}
                            1

Sau đó thay đoạn code phía trên bằng đoạn code dưới đây:

Mã:

                
                
                        

                        
                        
                            {xen:raw $topctrl}
                            1

Phần kết cấu xong rồi, bây giờ chúng ta bắt tay vào áp dụng cho XenPorta 2 thôi nào.
Các bạn tìm và mở Template "EWRporta2_ArticleList" sau đó thay tất cả bằng code dưới đây.

Mã:




    {xen:phrase porta2_author}: {$author.author_name}
    {xen:phrase porta2_author}: {$author.author_name}
    {xen:phrase porta2_viewing_only_articles_authored_by_x, 'author={$author.author_name}'}

    
        
        
    

    
        {xen:phrase porta2_articles}
        {xen:phrase porta2_authors}
    

    {$category.category_name}
    {$category.category_name}
    
        
            {$category.category_desc}
        
            {xen:phrase porta2_viewing_only_articles_categorized_with_x, 'cat={$category.category_name}'}
        
    

    
        
        
    

    
        {xen:phrase porta2_articles}
    

    {$xenOptions.boardTitle}
    {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}

    
        
    

    
        
    



    
        {xen:link 'canonical:articles'}
        {$xenOptions.boardTitle}
        {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}
        website
    


articles







    1
    
    



    1
    



    
        
            featuresGrid
            {$xenOptions.EWRporta2_features_relocate}
        
    



    



    

        {$xenOptions.boardTitle}
        
        {$xenOptions.EWRporta2_metadesc}{$xenOptions.boardDescription}
    
    
        
            
        
            
        
    



    
        {xen:phrase porta2_pause_infinite_scrolling}
        
            {xen:phrase porta2_change_article_list_settings}
            {xen:phrase porta2_resume_infinite_scrolling}

- Tiếp theo các bạn tìm tiếp template "EWRporta2_ArticleList_Bit" mở nó lên và thay bằng code dưới đây:

Mã:


                
                    
                    
                     {$article.article_title}
                    
                           
                              {$article.username}
                                
                                 {xen:date $article.article_date, 'd'}/{xen:date $article.article_date, 'm'}/{xen:date $article.article_date, 'y'}
                            
                              {xen:number $article.share_count}  {xen:number $article.reply_count}  {xen:number $article.view_count}
                            
                        
                        
                            
                            
                    
                    
                        
                    
                        
                            
                                
                                    
                                
                                    
                                
                            
                        
                            
                        
                            
                                    
                            
                        
                    
                    

                            
                            
                            

                {xen:raw $article.messageHtml}

                
                    {$article.article_break}...

Vậy là phần trang chủ XenPorta 2 đã được chúng ta định dạng, cuối cùng các bạn mở template "EWRporta2.css" và thêm vào dưới cùng đoạn css dưới đây.

Mã:

.EWRporta2_ArticleList .breadBoxTop, .EWRporta2_ArticleList .breadBoxBottom {
    display: none;
}
.EWRporta2_ArticleList .titleBar {
    display: none;
}
#T-Styles-Porta2 .titleBar {
    display: none
}
.introduce_supplier {
    background: url('@imagePath/img/introduceS.png');
    padding: 12px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    -webkit-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    border: 1px solid rgb(226, 226, 226)
}
.introduce_supplier h2 {
    color: #3a5795;
    font-size: 20px;
    padding-bottom: 10px;
    text-align: center;
    font-weight: 700
}
@media (max-width: 480px) {
    .introduce_supplier h2 {
        font-size: 14px
    }
}
.introduce_supplier .desc {
    color: #666;
    font-style: italic;
    line-height: 20px;
    text-align: justify;
    text-align: justify
}
#T-Styles-Porta2 {
    padding-left: 35px;
    padding-bottom: 20px;
    background: url('@imagePath/img/line.gif') repeat-y 10px;
    zoom: 1;
}
#T-Styles-Porta2 .main {
    width: 100%;
    padding-top: 25px
}
#T-Styles-Porta2 .suppliers {
    -webkit-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 2px 0px 0px rgb(226, 226, 226);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -khtml-border-radius: 5px;
    border-radius: 5px;
    border: 1px solid rgb(226, 226, 226);
    background: #FFF;
    margin-bottom: 15px;
    position: relative
}
#T-Styles-Porta2 .suppliers .dot {
    background-image: url('@imagePath/img/dot.png');
    background-repeat: no-repeat;
    background-position: 0 0;
    position: absolute;
    width: 20px;
    height: 20px;
    left: -34px;
    top: 82px;
}
#T-Styles-Porta2 .suppliers .dot_icon_2_t {
    background-position: 0 -20px
}
#T-Styles-Porta2 .suppliers .dot_icon_5_t {
    background-position: 0 -40px
}
#T-Styles-Porta2 .suppliers .dot_icon_4_t {
    background-position: 0 -60px
}
#T-Styles-Porta2 .suppliers .dot_icon_213_t {
    background-position: 0 -80px
}
#T-Styles-Porta2 .suppliers .dot_icon_87_t {
    background-position: 0 -100px
}
#T-Styles-Porta2 .suppliers .dot_icon_69_t {
    background-position: 0 -120px
}
#T-Styles-Porta2 .suppliers .dot_icon_67_t {
    background-position: 0 -140px
}
#T-Styles-Porta2 .suppliers .dot_icon_63_t {
    background-position: 0 -160px
}
#T-Styles-Porta2 .suppliers .dot_icon_70_t {
    background-position: 0 -180px
}
#T-Styles-Porta2 .suppliers .dot_icon_71_t {
    background-position: 0 -200px
}
#T-Styles-Porta2 .suppliers .dot_icon_74_t {
    background-position: 0 -220px
}
#T-Styles-Porta2 .suppliers .dot_icon_72_t {
    background-position: 0 -240px
}
#T-Styles-Porta2 .suppliers .dot_icon_84_t {
    background-position: 0 -260px
}
#T-Styles-Porta2 .suppliers .dot_icon_83_t {
    background-position: 0 -280px
}
#T-Styles-Porta2 .suppliers .dot_icon_77_t {
    background-position: 0 -300px
}
#T-Styles-Porta2 .suppliers .dot_icon_220_t {
    background-position: 0 -320px
}
#T-Styles-Porta2 .suppliers .dot_icon_112_t {
    background-position: 0 -340px
}
#T-Styles-Porta2 .suppliers .dot_icon_221_t {
    background-position: 0 -360px
}
#T-Styles-Porta2 .suppliers .dot_icon_115_t {
    background-position: 0 -380px
}
#T-Styles-Porta2 .suppliers .dot_icon_122_t {
    background-position: 0 -400px
}
#T-Styles-Porta2 .suppliers .dot_icon_73_t {
    background-position: 0 -420px
}
#T-Styles-Porta2 .suppliers .dot_icon_110_t {
    background-position: 0 -440px
}
#T-Styles-Porta2 .suppliers .dot_icon_111_t {
    background-position: 0 -460px
}
#T-Styles-Porta2 .suppliers .dot_icon_46_t {
    background-position: 0 -480px
}
#T-Styles-Porta2 .suppliers .dot_icon_96_t {
    background-position: 0 -500px
}
#T-Styles-Porta2 .suppliers .dot_icon_97_t {
    background-position: 0 -520px
}
#T-Styles-Porta2 .suppliers .dot_icon_98_t {
    background-position: 0 -540px
}
#T-Styles-Porta2 .suppliers .dot_icon_99_t {
    background-position: 0 -560px
}
#T-Styles-Porta2 .suppliers .dot_icon_57_t {
    background-position: 0 -580px
}
#T-Styles-Porta2 .suppliers .arrow {
    width: 11px;
    height: 22px;
    background: url('@imagePath/img/arrow.png') no-repeat 0 0;
    position: absolute;
    left: -11px;
    top: 80px
}
#T-Styles-Porta2 .suppliers_area {
    display: table;
    table-layout: fixed;
    width: 100%;
    word-wrap: normal;
    padding: 15px;
    border-top: 1px solid rgb(240, 240, 240);
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
    text-align: justify;
    text-justify: newspaper
}
#T-Styles-Porta2 .suppliers_area .suppliers_left {
    float: left;
    width: 300px;
    height: 225px;
    margin-right: 15px
}
#T-Styles-Porta2 .suppliers_area .suppliers_author {
    font-size: 11px;
    color: #666;
    line-height: 20px;
    text-decoration: none
}
#T-Styles-Porta2 .suppliers_area .suppliers_author a:hover {
    color: #FF4163;
    text-decoration: none
}
#T-Styles-Porta2 h2.suppliers_promotion a:hover {
    color: #FF4163;
    text-decoration: none
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_img {
    width: 300px;
    height: 225px;
    overflow: hidden;
    position: absolute;
    left: 15px;
    top: 15px
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_img img {
    width: 300px;
    height: auto
}
#T-Styles-Porta2 .suppliers_area .suppliers_more .suppliers_desc {
    position: absolute;
    left: 330px;
    font-size: 13px;
    padding-right: 15px;
    color: #666;
    font-style: italic;
    line-height: 22px
}
#T-Styles-Porta2 .suppliers_promotion {
    font-size: 20px;
    background: rgb(250, 250, 250);
    padding: 15px;
    font-weight: 700
}
#T-Styles-Porta2 .suppliers_promotion b {
    color: #FF4163
}
#T-Styles-Porta2 .suppliers_promotion a:hover {
    color: #FF4163;
    text-decoration: none
}
.suppliers_ribbon {
    position: absolute;
    right: -6px;
    top: -6px;
    z-index: 1;
    overflow: hidden;
    width: 75px;
    height: 75px;
    text-align: right
}
.suppliers_ribbon span {
    font-size: 10px;
    font-weight: bold;
    color: #FFF;
    text-transform: uppercase;
    text-align: center;
    line-height: 20px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -o-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    width: 100px;
    display: block;
    background: #79A70A;
    background: linear-gradient(#FF728B 0%, #FF4163 100%);
    -webkit-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    -moz-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    -khtml-box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    box-shadow: 0 3px 10px -5px rgba(0, 0, 0, 1);
    position: absolute;
    top: 19px;
    right: -21px
}
.suppliers_ribbon span::before {
    content: "";
    position: absolute;
    left: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid #FF4163;
    border-right: 3px solid transparent;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #FF4163
}
.suppliers_ribbon span::after {
    content: "";
    position: absolute;
    right: 0px;
    top: 100%;
    z-index: -1;
    border-left: 3px solid transparent;
    border-right: 3px solid #FF4163;
    border-bottom: 3px solid transparent;
    border-top: 3px solid #FF4163
}
.PageNavsuppliers {
    background: url('@imagePath/img/introduceS.png');
    padding: 12px;
    -webkit-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    -moz-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    -khtml-box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    box-shadow: 0 -2px 0px 0px rgb(226, 226, 226);
    border: 1px solid rgb(226, 226, 226)
}
.PageNavsuppliers .PageNav .itemL {
    float: right
}
.natMenuLevel0 {
    padding-left: 0px
}
.natMenuLevel1 {
    padding-left: 10px
}
.natMenuLevel2 {
    padding-left: 20px
}
.natMenuLevel3 {
    padding-left: 30px
}
.natMenuLevel4 {
    padding-left: 40px
}
.natMenuLevel5 {
    padding-left: 50px
}
.natMenuLevel6 {
    padding-left: 60px
}
.natMenuLevel7 {
    padding-left: 70px
}
.natMenuLevel8 {
    padding-left: 80px
}
.natMenuLevel9 {
    padding-left: 90px
}
.natMenuLevel10 {
    padding-left: 100px
}
.bbCodeImage {
    max-width: 100%
}
.content_threadinfo {
    float: left;
    overflow: hidden;
    position: relative;
    margin-bottom: 10px;
    border-bottom: 1px dashed #d7edfc;
    width: 100%
}
.avatarNews {
    display: block;
    float: left;
    margin: 0 5px 0 0px
}

.content_threadinfo .meta {
    display: block;
    min-height: 50px;
    float: left
}
.content_threadinfo .user {
    margin: 0px 0px 5px 0px;
    font-size: 12px;
    font-weight: 700;
    line-height: 19px
}
.content_threadinfo .DateTime {
    display: block;
    font-size: 11px
}
.content_threadinfo .like {
    color: #196eee;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
.content_threadinfo .reply {
    color: #da4531;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
.content_threadinfo .view {
    color: #009957;
    display: block;
    float: right;
    font-size: 15px;
    font-weight: bold;
    margin: 0 10px 0 0;
    padding: 2px 0 0 22px
}
#T-Styles-Porta2 .suppliers_area .newsText {
    font-size: 15px;
    line-height: 1.4;
    font-weight: 350;
    text-align: justify;
    text-justify: newspaper
}
@media (max-width: 961px) {}@media (max-width: 641px) {
    .content_threadinfo .like,
    .content_threadinfo .reply,
    .content_threadinfo .view {
        font-size: 11px;
        padding: 2px 0 0 5px
    }
    #T-Styles-Porta2 .suppliers_area .newsText,
    .content_threadinfo .user {
        font-size: 12px
    }
    .content_threadinfo .DateTime {
        font-size: 11px
    }
    #T-Styles-Porta2 .suppliers_area {
        display: none
    }
    #T-Styles-Porta2 .suppliers_promotion {
        font-size: 14px
    }
    #T-Styles-Porta2 .suppliers .dot {
        top: 20px
    }
    #T-Styles-Porta2 .suppliers .arrow {
        top: 18px
    }
}
@media (max-width: 481px) {
    .content_threadinfo .like,
    .content_threadinfo .reply,
    .content_threadinfo .view {
        font-size: 10px;
        padding: 2px 0 0 5px
    }
    #T-Styles-Porta2 .suppliers_area .newsText,
    .content_threadinfo .user {
        font-size: 11px
    }
    .content_threadinfo .DateTime {
        font-size: 10px
    }
    #T-Styles-Porta2 .suppliers_area {
        display: none
    }
    #T-Styles-Porta2 .suppliers_promotion {
        font-size: 13px
    }
    #T-Styles-Porta2 .suppliers .dot {
        top: 20px
    }
    #T-Styles-Porta2 .suppliers .arrow {
        top: 18px
    }
}
.grid {
    position: relative;
    margin: -3.3% -3% 0 -3%;
    _padding: 1em 0 4em;
    _max-width: 1000px;
    list-style: none;
    text-align: center;
}

/* Common style */
.grid .T-Thread-UserInfo {
    position: absolute;
    bottom: 10px;
    left: 10px;
}
.grid .T-Thread-UserInfo a {
    color: #fff;
    }
.grid .T-Thread-UserInfo span {
    font-size: 18px;
    margin-top: -30px;
}
.grid .T-Thread-Avarta {
    float: left;
    margin-right: 15px;
}
.grid figure {
    position: relative;
    _float: left;
    overflow: hidden;
    margin: 10px 1%;
    _min-width: 320px;
    _max-width: 480px;
    _max-height: 360px;
    _width: 48%;
    background: #3085a3;
    text-align: center;
    cursor: pointer;
}

.grid figure img {
    position: relative;
    display: block;
    min-height: 100%;
    max-width: 100%;
    opacity: 0.8;
}

.grid figure figcaption {
    _padding: 10px 20px;
    color: #fff;
    _text-transform: uppercase;
    font-size: 1.25em;
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

.grid figure figcaption::before,
.grid figure figcaption::after {
    pointer-events: none;
}

.grid figure figcaption,
.grid figure figcaption > a {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}
.grid figure figcaption > a {
    z-index: 1000;
    text-indent: 200%;
    white-space: nowrap;
    font-size: 0;
    opacity: 0;
}

.grid figure h2 {
    _word-spacing: -0.15em;
    font-weight: 300;
    font-size: 21px;
}

.grid figure h2 span {
    font-weight: 800;
}

.grid figure h2,
.grid figure p {
    margin: 0;
}

.grid figure p {
    letter-spacing: 1px;
    font-size: 68.5%;
}
figure.effect-sarah {
    background: #42b078;
}

figure.effect-sarah img {
    max-width: none;
    width: -webkit-calc(100% + 20px);
    width: calc(100% + 20px);
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(-10px,0,0);
    transform: translate3d(-10px,0,0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
}

figure.effect-sarah:hover img {
    opacity: 0.4;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

figure.effect-sarah figcaption {
    text-align: left;
}

figure.effect-sarah h2 {
    position: relative;
    overflow: hidden;
    padding: 10px 15px;
    background-color: rgba(0, 0, 0, 0.25);
    text-transform: uppercase;
}

figure.effect-sarah h2::after {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 3px;
    background: #F44336;
    content: '';
    -webkit-transition: -webkit-transform 0.35s;
    transition: transform 0.35s;
    -webkit-transform: translate3d(-100%,0,0);
    transform: translate3d(-100%,0,0);
}

figure.effect-sarah:hover h2::after {
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}

figure.effect-sarah p {
    padding: 5px 15px;
    opacity: 0;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: translate3d(100%,0,0);
    -webkit-transform: translate3d(100%,0,0);
    -moz-transform: translate3d(100%,0,0);
    -o-transform: translate3d(100%,0,0);
    -ms-transform: translate3d(100%,0,0);
    transform: translate3d(100%,0,0);
    background-color: rgba(0, 0, 0, 0.25);
}
figure.effect-sarah p a {
    color: #fff;
}
figure.effect-sarah:hover p {
    opacity: 1;
    -webkit-transform: translate3d(0,0,0);
    transform: translate3d(0,0,0);
}
@media screen and (max-width: 50em) {
    .content {
        padding: 0 10px;
        text-align: center;
    }
    .grid figure {
        display: inline-block;
        float: none;
        margin: 10px auto;
        width: 100%;
    }
}

Ok, bây giờ chúng ta tiếp tục thêm chút "màu mè" cho phần bài viết được Promotion bởi XenPorta 2 nhé.
- Các bạn tìm và mở template "EWRporta2_ArticleView" sau đó thay tất cả bằng code dưới đây.

Mã:



{xen:helper threadPrefix, $thread, escaped}{$thread.title}{xen:helper pagenumber, $page}
{xen:helper threadPrefix, $thread}{$thread.title}


    {xen:phrase discussion_in_x_started_by_y_date_z,
        'forum={$forum.title}',
        'name={xen:helper username, $thread}',
        'date={xen:datetime $thread.post_date, html}'}



    



    
    
    

    
        
    
        
    
        
    

    
        {xen:link 'canonical:threads', $thread}
        {xen:helper threadPrefix, $thread, escaped}{$thread.title}
        {xen:helper snippet, $firstPost.message, 155}
        {xen:helper avatar, $thread, m, 0, 1}
    


{xen:helper nodeClasses, $nodeBreadCrumbs, $forum}{xen:if {$xenOptions.selectQuotable}, ' SelectQuotable'}




    
        {xen:phrase reply_to_thread}
    






                
                    
                            
                    
                    
                        
                    
                        
                            
                                
                                    
                                
                                    
                                
                            
                        
                            
                        
                            
                                    
                            
                        
                    
                    

                            
                        
                            {$thread.title}
                            {$forum.title}, {xen:datetime $thread.post_date, html}. Trả lời: {xen:number $article.reply_count}, lượt xem: {xen:number $article.view_count}.
                        
                        
                        
                        
                        
                        
                        {$article.username}
                        
                        

                    
                

    
        
            {xen:link full:threads, $thread}
        
    
        
            
                
                    1
                    
                
            
            
                
                    
                
            
            
                
                    {xen:phrase tweet}
                
            
        
    




    
        
            
                {xen:phrase porta2_article_tools}
                
                    {xen:phrase porta2_article_tools}
                    
                        
                            
                                {xen:phrase edit_thread}
                            
                                {xen:phrase edit_title}
                            
                            
                                {xen:phrase add_poll}
                            
                            
                                {xen:phrase delete_thread}
                            
                            
                                {xen:phrase move_thread}
                            
                            
                                {xen:phrase manage_reply_bans}
                            
                            
                                {xen:phrase moderator_actions}
                            
                            
                                {xen:phrase show_deleted_posts}
                            
                            
                        
                    
                
            
        
    

    
        
    



    
        
    



    



    
        
            
                
            

            {xen:phrase porta2_subcats}:

            
                
            

            
            
                
                    
                    
                        
                        {xen:phrase porta2_subcat_this_article_hint}
                    
                
                
            
            
        
    



    
        
            
                
            
                
            
        
    







    
        {xen:phrase comments}
        {xen:phrase discussion_in_x_started_by_y_date_z,
            'forum={$forum.title}',
            'name={xen:helper username, $thread}',
            'date={xen:datetime $thread.post_date, html}'}
    

    
        
        
            {xen:phrase porta2_local_comments}
        
        
            {xen:phrase porta2_disqus_comments}
        
        
            {xen:phrase porta2_facebook_comments}
        
        
    

    
        
            
        
        
            
        
        
            
        
    



    {xen:link 'canonical:threads', $thread}

Bây giờ quay lại trang chủ và F5 để xem thay đổi thôi nào.
Chú ý: có thể nhiều style sẽ hiển thị đôi chút sai lệnh, nếu gặp lổi các bạn thảo luận tại chủ đề này luôn nhé.
Quên mất, các bạn tải thư mục "img" dưới đính kèm và upload lên thư mục style các bạn đang sử dụng nhé.

Click to expand...

Cho mình hỏi chỉnh cao độ rộng của cái bbCode Block như thế nào nhỉ?

Mình cảm ơn và mong hồi âm của anh em !

quick87 · 29/11/2017

quick87 nói: ↑

Cho mình hỏi chỉnh cao độ rộng của cái bbCode Block như thế nào nhỉ?

View attachment 23312

Mình cảm ơn và mong hồi âm của anh em !
Click to expand...

untick tùy chọn này là ok,

tks bạn @2L.Ohayo

daiquang · 27/07/2018

thanks bác

Support	Quảng cáo
Mr. San (PVS)	Mr. Bình (THB)
Mr. Tuấn 0988 488 096	Mr. Bình 0981 06 08 08
kinhdoanh@vnxf.vn

Đăng nhập

Styles Style XenPorta 2 - SEOMXH

thuyet951 Thượng Đế

chientc Thượng Đế

{$article.article_title}

{$thread.title}

{xen:phrase comments}

vuongbkdn Thượng Đế

quanken Thượng Đế

chientc Thượng Đế

{$article.article_title}

{$thread.title}

{xen:phrase comments}

singh Thượng Đế

logliu21 Thượng Đế

conkhidannb Thượng Đế

quick87 Thượng Đế

{$article.article_title}

{$thread.title}

{xen:phrase comments}

quick87 Thượng Đế

daiquang Thượng Đế

Chia sẻ trang này

Thông tin chung

VNXF OPEN

LIÊN KẾT

LIÊN KẾT

XenForo 1	XenForo 2
Translate by PVS

Đăng nhập

Styles Style XenPorta 2 - SEOMXH

thuyet951 Thượng Đế

chientc Thượng Đế

{xen:phrase porta2_article_tools}

vuongbkdn Thượng Đế

quanken Thượng Đế

chientc Thượng Đế

{xen:phrase porta2_article_tools}

singh Thượng Đế

logliu21 Thượng Đế

conkhidannb Thượng Đế

quick87 Thượng Đế

{xen:phrase porta2_article_tools}

quick87 Thượng Đế

daiquang Thượng Đế

Chia sẻ trang này

Tìm kiếm hữu ích