1. Chào mừng Khách tham gia cộng đồng Android Việt Nam

topbigslide

Hướng dẫn hiện thị bài đăng đầu tiên trên Xenforo nằm ngang

Cách đây vài ngày có bạn hỏi mình cách hiển thị bài đăng đầu tiên trên Xenforo mà avatar của người đ

  1. King
    Cách đây vài ngày có bạn hỏi mình cách hiển thị bài đăng đầu tiên trên Xenforo mà avatar của người đăng chủ đề thu gọn lại và nằm ngang trên cùng, để giúp cho không gian của bài đăng được rộng ra.

    Mặc định thì nó như thế này đây:

    [​IMG]



    Lưu ý là cái này chỉ áp dụng cho #1, còn các bình luận tiếp theo thì vẫn là mặc định như thế này nhé:

    [​IMG]

    OKAY! Ta bắt đầu tiến hành bài hướng dẫn luôn nhé :)

    1. Đầu tiên, các bạn add đoạn code sau đây vào template EXTRA.css nhé
    /*Display Postbit in first post*/
    .firstPost .messageUserInfo {
    floatnone;
    }
    .
    firstPost .messageUserInfo .messageUserBlock .arrow {
    displaynone;
    }
    .
    firstPost .messageInfo {
    margin-left5px !important;
    margin-top10px;
    }
    .
    newIndicator {
    displaynone !important;
    }
    .
    firstPost .messageUserInfo {
    width100% !important;
    }
    .
    firstPost .messageUserInfo .messageUserBlock .arrow {
    displaynone;
    }
    .
    firstPost .messageUserBlock {
    -
    moz-border-bottom-colorsnone !important;
    -
    moz-border-imagenone !important;
    -
    moz-border-left-colorsnone !important;
    -
    moz-border-right-colorsnone !important;
    -
    moz-border-top-colorsnone !important;
    backgroundnone repeat scroll 0 0 transparent !important;
    border-color: -moz-use-text-color -moz-use-text-color #CDE5F0 !important;
    border-stylenone none dashed !important;
    border-width0 0 1px !important;
    height64px;
    }
    .
    firstPost .avatar .img {
    margin-left!important;
    }
    .
    firstPost .avatarHolder {
    padding!important;
    positionabsolute !important;
    }
    .
    firstPost .userText {
    margin-left58px;
    positionabsolute !important;
    top18px;
    }
    .
    firstPost .tt_share_page {
    margin-left220px;
    positionabsolute;
    top34px;
    width420px;
    }
    .
    firstPost .shareControl {
    floatright;
    }
    .
    firstPost .addthis {
    padding-left20px;
    }
    .
    titleBar h1 {
    font-size20pt !important;
    }
    2. Sau đó bạn tạo 1 template mới và đặt tên nó là message_user_info_firstpost
    Sau khi tạo xong template mới, các bạn add đoạn code này vào template này nhé!
    <xen:require css="message_user_info.css" />
    
    <div class="messageUserInfo" itemscope="itemscope" itemtype="http://data-vocabulary.org/Person">
    <div class="messageUserBlock">
    <xen:hook name="message_user_info_avatar" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
    <div class="avatarHolder">
    <span class="helper"></span>
    <xen:avatar user="$user" size="s"/>
    <!-- slot: message_user_info_avatar -->
    </div>
    </xen:hook>
    
    <xen:if is="!{$isQuickReply}">
    <xen:hook name="message_user_info_text" params="{xen:array 'user={$user}', 'isQuickReply={$isQuickReply}'}">
    <h3 class="userText">
    <xen:username user="$user" itemprop="name" rich="true" />
    <xen:if hascontent="true"><em class="userTitle" itemprop="title"><xen:contentcheck>{xen:helper userTitle, $user}</xen:contentcheck></em></xen:if>
    <!-- slot: message_user_info_text -->
    </h3>
    </xen:hook>
    
    </xen:if>
    <span class="tt_share_page">
    <div class="facebookLike shareControl">
    <fb:like href="{$url}" layout="button_count" action="{$xenOptions.facebookLikeAction}" font="trebuchet ms" colorscheme="@fbColorScheme"></fb:like>
    </div>
    <div class="plusone shareControl">
    <div class="g-plusone" data-size="medium" data-count="true" data-href="{$url}">
    </div>
    </span>
    <span class="arrow"><span></span></span>
    </div>
    </div>
    3. Cuối cùng là các bạn vào template message và tìm đúng đoạn code sau:

    <li id="{$messageId}class="message {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_admin} OR {$message.is_moderator}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">
    <
    xen:include template="message_user_info">
    <
    xen:map from="$messageto="$user/>
    </
    xen:include>
    và thay nó bằng đoạn code này:
    <xen:if is="{$post.position} == 0 AND !{$message.conversation_id}">
    <
    li id="{$messageId}class="message firstPost {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_admin} OR {$message.is_moderator}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">
    <
    xen:include template="message_user_info_firstpost">
    <
    xen:map from="$messageto="$user/>
    </
    xen:include>
    <
    xen:else />
    <
    li id="{$messageId}class="message {xen:if $message.isDeleted, 'deleted'} {xen:if '{$message.is_admin} OR {$message.is_moderator}', 'staff'} {xen:if $message.isIgnored, ignored}" data-author="{$message.username}">
    <
    xen:include template="message_user_info">
    <
    xen:map from="$messageto="$user/>
    </
    xen:include>
    </
    xen:if>
    Thế là xong rồi! Rất đơn giản đúng không nào

Bạn đang xem Zing.vn Mobile trên màn hình máy tính hoặc thiết bị trình chiếu mà giao diện này không hỗ trợ.

Chuyển về giao diện đầy đủ