Hướng dẫn Thêm nút đăng nhập hoặc đăng ký lên đầu trang cho giao diện diện trên điện thoại

[thuyet951]

Mã nguồn XenForo được thiết kế tối ưu hoá rất tốt cho mọi kích thước hiển thị màn hình, nhờ hệ thống Reponsive được tích hợp rất tinh tế, nhưng không phải cái gì cũng hoàn hảo (mỗi người một ý mà).
Hầu hết mọi diễn đàn sử dụng mã nguồn XenForo thường có bố cục tương đối giống nhau, gồm 1 phần chính và 1 phần phụ (sidebar) bên phải hoặc trái.
Ở giao diện mặc định, thì bên giao diện khung sidebar sẽ hiển thị một nút hướng dẫn đăng ký hoặc đăng nhập khá tiện dụng, nhưng có một số anh em sẽ không thích vì khi ở giao diện điện thoại (Reponsive) nút này sẽ bị đẩy xuống cuối, vậy làm thế nào để thêm một nút đăng nhập ở phía trên đầu trang web, mời bạn xem hướng dẫn nhỏ và đơn giản sau đây.

Bước 1: Truy cập vào Admin Control Panel của XenForo sau đó vào phần chỉnh sửa Template và tìm Template có tên ad_above_top_breadcrumb

Bước 2: Sao chép toàn bộ đoạn mã dưới đây và dán vào dưới cùng khung soạn thảo của template ad_above_top_breadcrumb sau đó lưu lại.

<xen:if is="!{$visitor.user_id}">
    <div class="section loginButton" style="display:none">       
        <div class="secondaryContent">
            <label for="LoginControl" id="SignupButton"><a href="{xen:link login}" class="inner">{xen:if $xenOptions.registrationSetup.enabled, {xen:phrase sign_up_now}, {xen:phrase log_in}}</a></label>
        </div>
    </div>
</xen:if>
<style>
<xen:if is="@enableResponsive">
@media (max-width:@maxResponsiveWideWidth) {
    .Responsive .mainContent .loginButton {
        display: block !important;
    }
}
</xen:if>
</style>

Xong rồi, tải lại trang và xem thành quả.
À quên nhớ thoát tài khoản ra và mở trang bằng giao diện Reposive hoặc lấy điện thoại truy cập thì mới thấy nhé.

 

[Jindo_Katori]

Cuối cùng bác cũng cho ra lò
Cảm ơn bác @thuyet951
Đã thử và thành công:

 

[Jindo_Katori]

Cảm ơn bác đã thử và thành công