Addon Style add-on VNXF More Thread

logliu21

logliu21

Gefreiter
Tham gia
25/09/2016
Bài viết
54
Được Like
24
Hầu như các bạn ai cũng biết đến add-on này ^^..
Đây là giao diện mặc định của add-on
upload_2017-7-7_16-18-13.png


Thì mình đã fix lại giao diện mới cho add-on như sau:
* Trên máy tính:
upload_2017-7-7_16-18-58.png


* Trên điện thoại:
upload_2017-7-7_16-20-32.png



## Hướng dẫn
Các bạn tìm template VNXF_more_thread
thay toàn bộ bằng
Mã: 
<xen:if is="{$vnxfpost} || {$vnxfnew}">
<style>
a.img_items {
    display: block;
    float: left;
    height: 130px;
    margin-right: 10px;
    overflow: hidden;
    width: 100%;
    border:1px solid #F0F0F0;
}
a.img_items img {
    #max-height: {$opt.himg}px;
    width: 100%;
}
</style>
<xen:require css="VNXF_More_Thread.css" />
    <div class="HotBlock">
        <xen:if is="{$vnxfpost}">
            <div class="HotBlock_wrp">
                <div class="header_rc header_hb">
                    <div class="title_rc">
                        Quan tâm nhiều
                    </div>
                </div>
                <div class="HotBlock_ct">
                    <xen:foreach loop="$vnxfpost" value="$news" i="$i">
                        <div class="HotBlock_items" style="height:<xen:if is="{$opt.hthread} != 0 && {$showimg}">{$opt.hthread}px<xen:else/><xen:if is="{$showimg}">80px<xen:else/>50px</xen:if></xen:if>">
                            <xen:if is="{$showimg}">
                                    <a class="img_items" href="{xen:link threads, $news}" title="{$news.title}" target="_blank">
                                        <xen:if is="{$news.attach}">
                                            <img src="{xen:link attachments, $news.attach}" alt="{$news.title}" title="{$news.title}" style=" -webkit-filter: blur(5px); -o-filter: blur(5px); -moz-filter: blur(5px); filter: blur(5px); " />
                                        <xen:elseif is="{$news.image}" />
                                            <img src="{$news.image}" alt="{$news.title}" title="{$news.title}" style=" -webkit-filter: blur(5px); -o-filter: blur(5px); -moz-filter: blur(5px); filter: blur(5px); "/>
                                        <xen:else />
                                            <img src="{$opt.bia}" alt="{$news.title}" title="{$news.title}"  style=" -webkit-filter: blur(5px); -o-filter: blur(5px); -moz-filter: blur(5px); filter: blur(5px); "/>
                                        </xen:if>
                                    </a>
                                </xen:if>
                            <div class="ct_items" style="    padding: 20px;">
                            <h4 style="    background: rgba(0,0,0,0.5); position: absolute;text-decoration: none;text-transform: uppercase;#width:100%;position: absolute; line-height: 1.2; outline: 0; font-family: 'Noto Sans',sans-serif; text-align: center; color: #fff; top: 50%; padding: 0 10px 0 0; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); ">
                                <a href="{xen:link threads, $news}" title="{$news.title}" target="_blank" class="title_items">{$news.title}</a>
                                <span class="info_items">bởi <a href="{xen:link members, $news}" class="username">{$news.username}</a>, <abbr title="{xen:datetime $news.post_date, 'absolute'}" class="DateTime">{xen:datetime $news.post_date, 'absolute'}</abbr></span>
                            </h4>
                            </div>
                        </div>
                    </xen:foreach>
                    <div style="clear:both;"></div>
                </div>
            </div>
        </xen:if>
        <xen:if is="{$vnxfnew}">
            <div class="HotBlock_wrp">
                <div class="header_rc header_hb">
                    <div class="title_rc">
                        Bài viết mới
                    </div>
                </div>
                <div class="HotBlock_ct">
                    <xen:foreach loop="$vnxfnew" value="$news" i="$i">
                        <div class="HotBlock_items" style="height:<xen:if is="{$opt.hthread} != 0 && {$showimg}">{$opt.hthread}px<xen:else/><xen:if is="{$showimg}">80px<xen:else/>40px</xen:if></xen:if>">
                            <xen:if is="{$showimg}">
                                    <a class="img_items" href="{xen:link threads, $news}" title="{$news.title}" target="_blank">
                                        <xen:if is="{$news.attach}">
                                            <img src="{xen:link attachments, $news.attach}" alt="{$news.title}" title="{$news.title}" style=" -webkit-filter: blur(5px); -o-filter: blur(5px); -moz-filter: blur(5px); filter: blur(5px); " />
                                        <xen:elseif is="{$news.image}" />
                                            <img src="{$news.image}" alt="{$news.title}" title="{$news.title}" style=" -webkit-filter: blur(5px); -o-filter: blur(5px); -moz-filter: blur(5px); filter: blur(5px); " />
                                        <xen:else />
                                            <img src="{$opt.bia}" alt="{$news.title}" title="{$news.title}" style=" -webkit-filter: blur(5px); -o-filter: blur(5px); -moz-filter: blur(5px); filter: blur(5px); " />
                                        </xen:if>
                                    </a>
                                </xen:if>
                            <div class="ct_items" style="    padding: 20px;">
                            <h4 style="   background: rgba(0,0,0,0.5); position: absolute; text-decoration: none;text-transform: uppercase;#width:100%;position: absolute; line-height: 1.2; outline: 0; font-family: 'Noto Sans',sans-serif; text-align: center; color: #fff; top: 50%; padding: 0 10px 0 0; -moz-transform: translateY(-50%); -webkit-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); ">
                                <a href="{xen:link threads, $news}" title="{$news.title}" target="_blank" class="title_items">{$news.title}</a>
                                <span class="info_items">bởi <a href="{xen:link members, $news}" class="username">{$news.username}</a>, <abbr title="{xen:datetime $news.post_date, 'absolute'}" class="DateTime">{xen:datetime $news.post_date, 'absolute'}</abbr></span>
                           </h4>
                            </div>
                        </div>
                    </xen:foreach>
                    <div style="clear:both;"></div>
                </div>
            </div>
        </xen:if>
    </div>
</xen:if>

Và VNXF_more_thread.css: Thay toàn bộ nha
Mã: 
.header_rc {
    border-bottom: 2px solid rgb(0, 68, 114);
    position: relative;
    width: auto;
}
.title_rc {
    background: none repeat scroll 0 0 #006d96;
    color: #fff;
    float: left;
    font-size: 13px;
    padding: 10px;
    position: absolute;
    text-transform: uppercase;
    top: -37px;
}
.HotBlock {
    margin-top: 40px;
    margin-bottom: 40px;
    width: 100%;
    clear:both;
}
.HotBlock_wrp {
    background: none repeat scroll 0 0 #ffffff;
    margin-top: 15px;
    padding-top: 30px;
}
.HotBlock_ct {
    padding: 20px 0 0;
}
.header_hb .title_rc {
    background: none repeat scroll 0 0 #444;
}
.HotBlock_items {
    float: left;
    margin-bottom: 10px;
    overflow: hidden;
    padding-left: 2%;
    width: 48%;
    position: relative;
}
.title_items {
    color: rgb(245, 245, 245) !important;
    display: block;
    font-size: 14px;
    font-weight: 600;
    overflow: hidden;
}
.info_items {
    color: #fff !important;
    font-size: 10px;
}
.info_items a {
    color: #fff;
}

@media (max-width: 900px) {
.HotBlock_items {
    float: none;
    padding-left: 2%;
    width: 96%;
}
.HotBlock_items .ct_items{
    display: inline;
}
}
 
Sửa lần cuối:
PVS

PVS

Generalissimo
Thành viên BQT
Tham gia
28/02/2015
Bài viết
15,961
Được Like
12,453
đẹp đấy bạn, nhưng mà chữ phía dưới nên đổi màu cho dễ nhìn xíu là ok
 
logliu21

logliu21

Gefreiter
Tham gia
25/09/2016
Bài viết
54
Được Like
24
à thấy rồi a.. mà hok pik đổi màu j luôn á kkk..
 
PVS

PVS

Generalissimo
Thành viên BQT
Tham gia
28/02/2015
Bài viết
15,961
Được Like
12,453
logliu21 nói:
à thấy rồi a.. mà hok pik đổi màu j luôn á kkk..
Nhấn để mở rộng...
màu gì sáng sáng ấy là sẽ rõ, mình nghĩ màu trắng cũng được, tuy giống tiêu đề nhưng rõ ràng :)
 
logliu21

logliu21

Gefreiter
Tham gia
25/09/2016
Bài viết
54
Được Like
24
Fix lại cái @media (max-width)+ lớp phủ ..
Coming Soon


upload_2017-7-7_18-2-24.png

upload_2017-7-7_18-4-50.png
 
Sửa lần cuối:
  • Like
Reactions: PVS
PVS

PVS

Generalissimo
Thành viên BQT
Tham gia
28/02/2015
Bài viết
15,961
Được Like
12,453
QTV => Quá tuyệt vời (y)
 
Blue

Blue

Legend
Thành viên BQT
Tham gia
25/02/2015
Bài viết
883
Được Like
1,492
Rất hoan nghênh sự đóng góp của bạn, tiếp tục phát huy nhé :)
 
S

singh

Sergeant
Tham gia
08/06/2015
Bài viết
470
Được Like
276
cảm ơn. khi nào share trang chủ vậy em
 
dinhyen

dinhyen

Corporal
Tham gia
22/05/2017
Bài viết
103
Được Like
36
Bác có cái adon quan tâm nhiều ở đâu thế.
Em đang cần em chỉ thấy nó có cái bài mới thôi.
 
Bạn phải đăng nhập hoặc đăng ký để bình luận.
Người đăng Chủ đề tương tự Diễn đàn Trả lời Ngày đăng
PVS Addon 2x [OzzModz] Style Default per Domain - Style mặc định cho mỗi tên miền cho XenForo 2.2 2.0.0 Add-ons Xenforo 0
PVS Addon 2x [XTR] Unlimited Prefix Styles - Tạo kiểu tiền tố không giới hạn cho XenForo 2.2 1.0.2 Add-ons Xenforo 0
PVS Addon 2x [XTR] Unlimited Prefix Styles - Tạo kiểu tiền tố không giới hạn cho XenForo 2.2 1.0.1 Add-ons Xenforo 0
PVS Addon 2x CinVin: Style & Meta Tweaks - Tinh chỉnh Style & Meta cho XenForo 2.2 1.1.1 Add-ons Xenforo 0
lamborghini711 Xin addon slide ảnh trong Style Wind của VNXF Add-ons Xenforo 6

Chủ đề tương tự


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

XenForo 1 XenForo 2
Translate by PVS

Hỗ trợ trực tuyến

Support Quảng cáo
Mr. San (PVS)

Skype chat, instant message

 Mr. Tuấn (Blue)

Skype chat, instant message
Mr. Tuấn
0988 488 096 		Mr. Trọng
0906 081 284
kinhdoanh@vnxf.vn

Texlink

Liên hệ đặt Textlink
Liên hệ đặt Textlink
Liên hệ đặt Textlink
Liên hệ đặt Textlink
Liên hệ đặt Textlink

Nhà Tài Trợ

Mút Xốp Không Gian
pallet Thịnh Phát
Điện Lạnh Thịnh Phát
Top Bottom