Đóng Khung chữ kí kèm chữ kí mặc định

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
Đóng Khung chữ kí kèm chữ kí mặc định

Demo:

untitled.PNG

Mở template message
Tìm:
Mã:
<xen:if is="{$visitor.content_show_signature} && {$message.signature}">
            <div class="baseHtml signature ugc{xen:if $message.isIgnored, ' ignored'}"><aside>{xen:raw $message.signatureHtml}</aside></div>
        </xen:if>

Thay bằng:
Mã:
<!-- sig --><xen:if is="{$visitor.content_show_signature} && {$message.signature}">
                                    <div class="postsignature" style="margin-top:20px">
                                    <div style="width:100%;">
                                    <img src="http://chomaytinh.info/images/sig/sig.gif" class="title">
                                    <div style="min-height: 50px;overflow:auto" class="content">
                                    <div class="baseHtml signature ugc{xen:if $message.isIgnored, ' ignored'}"><aside>{xen:raw $message.signatureHtml}</aside></div>
                                    </div>
                                    </div></div>
                        <!-- / sig -->
<xen:else />
                            <!-- sig  default-->
                            <div class="postsignature" style="margin-top:20px">
                            <div style="width:100%;">
                            <img src="http://chomaytinh.info/images/sig/sig.gif" class="title">
                            <div style="min-height: 50px;overflow:auto" class="content">
                            <b> * vnxf.vn - Cộng Đồng Xenforo Việt Nam! *</b>
                            </div>
                            </div></div>
                            </xen:if><!-- / sig default-->

Chuyển sang message.css thêm đoạn này vào cuối

Mã:
/*chu ky*/
.postsignature {
    border: 1px solid #CCCCCC;
    border-radius: 2px 2px 2px 2px;
    display: block;
    padding: 4px 4px 4px 20px;
    position: relative;
    text-align: left;
}
.postsignature .title {
    border: 0 none;
    left: 20px;
    overflow: hidden;
    position: absolute;
    top: -22px;
}
.postsignature .content {
    margin-bottom: 4px;
    margin-top: 15px;
    text-align:center;
    padding: 0;
}
.postsignature .content:after {
content:"vnxf.vn";
right:10px;
position: absolute;
bottom:10px;}


Nguồn: 4vnn.com​
 

tqhuy

Private
Tham gia
30/05/2017
Bài viết
39
Được Like
8
Mình đã test thử trên desktop thì ok nhưng trên di động, chữ ký bị tràn ra ngoài. Bác @PVS có code fix responsive không. Cám ơn bác
 

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
Mình không có bạn
 

2L.Ohayo

Moderator
Thành viên BQT
Tham gia
08/03/2015
Bài viết
761
Được Like
835
.potsignature .title
{
width: 100%;
}
Thử xem được không
 

tqhuy

Private
Tham gia
30/05/2017
Bài viết
39
Được Like
8
Được rồi bác @2L.Ohayo ơi. Mình để code thế này:
/*chu ky*/
.postsignature {
border: 1px solid #CCCCCC;
border-radius: 2px 2px 2px 2px;
display: block;
padding: 4px 4px 4px 20px;
position: relative;
text-align: left;
}
.postsignature .title {
width:100%
}
Tuy nhiên trên desktop, chữ ký bị phóng to ra.
Nếu để width:50% thì trong điện thoại bị thu nhỏ lại.
Có cách nào khắc phục không bác
 
Sửa lần cuối:

Hướng dẫn sử dụng

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Mobile/Zalo: 0906081284

Telegram: anhanhxf

Chỉ nhận web nội dung lành mạnh

Nhà Tài Trợ

Mút Xốp Không Gian
Mút Sofa Không Gian
Top Bottom