Styles Làm sao được nút counter và author như Tt.vn

981 4 0
N

nminhkhoi

Private
Tham gia
20/02/2017
Bài viết
31
Được Like
10
Tình hình là em mới nghiên cứu về xenf, mò mẫm cả tuần rồi cũng được chút chút. nhưng em không biết sao hiển thị được tác giả bài viết và nút counter như thế này.
Có cao nhân nào giúp em với ạ. Em cám ơn rất nhiều. Cần thiết thì e hậu tạ thẻ cào coi như cafe chỉ giáo.

Screen Shot 2017-03-04 at 06.08.52.png
 
Bài viết liên quan
Innovate Light - Style Innovate Light cho XenForo 2 2.2.13 bởi PVS,
Vault - Style Vault cho XenForo 2.2 2.2.13d bởi PVS,
Vault - Style Vault cho XenForo 2.2 2.2.13c bởi PVS,
Classified location check - Kiểm tra địa điểm rao vặt cho XenForo 2 1.1 bởi PVS,
Innovate Dark - Style Innovate Dark cho XenForo 2 2.2.13 bởi PVS,
Nova - Style Nova cho XenForo 2 2.2.3 bởi PVS,
Bài viết mới
Carbon - Style Carbon cho XenForo 2 2.2.13 bởi PVS,
Exclusive Light - Style Exclusive Light cho XenForo 2 2.2.13 bởi PVS,
Blackend Pro - Style Blackend Pro cho XenForo 2 2.2.13 bởi PVS,
XenForo_Nulled 2.3.0 Beta 4 bởi okonecc,
Not Alone Pro - Style Not Alone Pro cho XenForo 2.2 2.2.15 bởi PVS,
Nexxe - Style Nexxe cho XenForo 2.2 2.2.15 bởi PVS,
tuna

tuna

Sergeant
Tham gia
30/01/2017
Bài viết
639
Được Like
276
bcat95 nói:
Demo:
View attachment 19410
EWRporta2_ArticleList_Bit
Mã: 
<div class="articleItem" id="article_{$article.thread_id}">
    <div class="sectionMain">
        <div class="metaData">
            <xen:if hascontent="true">
                    <xen:contentcheck>
                    <span class="poster-avatar">
                        <xen:avatar user="$article" size="s" class="Tooltip" title="{$article.username}" itemprop="photo" />
                    </span>
                    </xen:contentcheck>
            </xen:if>
           
            <span class="dateData">
                <a href="{xen:link members, $article}" class="username">{$article.username}</a>
                <a href="{xen:link threads, $article}">{xen:datetime $article.article_date}</a>
            </span>
            <div class="sectionFooter">
                <xen:include template="EWRporta2_Article_Categories">
                    <xen:map from="$article.categories.cats" to="$categories" />
                </xen:include>
            </div>
        </div>
        <div class="thr_img_home">
        <xen:if hascontent="true">
                <xen:contentcheck>
                    <xen:if is="{$article.article_icon.type} == 'attach'">
                        <a class="attachHolder" href="{xen:link threads, $article}">
                            <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAADAQMAAACUBtwLAAAAA1BMVEX///+nxBvIAAAAAXRSTlMAQObYZgAAAAtJREFUCJljYAABAAAGAAHmh/5/AAAAAElFTkSuQmCC"alt="{$article.article_icon.data.filename}" class="art_att" style="background: url({xen:link attachments, $article.article_icon.data});background-size: cover;">
                        </a>
                    <xen:elseif is="{$article.article_icon.type} == 'image'" />
                        <a class="attachHolder" href="{xen:link threads, $article}">
                        <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAADAQMAAACUBtwLAAAAA1BMVEX///+nxBvIAAAAAXRSTlMAQObYZgAAAAtJREFUCJljYAABAAAGAAHmh/5/AAAAAElFTkSuQmCC" alt="{$article.article_icon.data.file}" class="art_att" style="background: url({$article.article_icon.data.url});background-size: cover;">
                    <xen:elseif is="{$article.article_icon.type} == 'medio'" />
                        <a class="medioHolder OverlayTrigger"style="background-image: url('{xen:helper medio2, $article.article_icon.data}');"
                            href="{xen:link 'full:media/media', $article.article_icon.data}" data-href="{xen:link 'full:media/media/popout', $article.article_icon.data}"
                            data-cacheOverlay="false" data-overlayoptions="{&quot;fixed&quot;:false}">
                                <img src="styles/8wayrun/EWRmedio_play.png" />
                        </a>
                    </xen:if>
                </xen:contentcheck>
            </xen:if>
        </div>
        <div class="subHeading">
            {xen:helper threadPrefix, $article}
            <a href="{xen:link threads, $article}">{$article.article_title}</a>
        </div>
       
        <xen:if is="@porta2_articles_header">
        <xen:if hascontent="true">
            <div class="headerBlock">
                <xen:contentcheck>
                <xen:if is="{$article.article_icon.type} == 'attach'">
                    <a class="attachHolder" href="{xen:link threads, $article}"><img src="{xen:link attachments, $article.article_icon.data}" alt="{$article.article_icon.data.filename}" /></a>
                <xen:elseif is="{$article.article_icon.type} == 'image'" />
                    <a class="attachHolder" href="{xen:link threads, $article}"><img src="{$article.article_icon.data.url}" alt="{$article.article_icon.data.file}" /></a>
                <xen:elseif is="{$article.article_icon.type} == 'medio'" />
                    <a class="medioHolder OverlayTrigger"style="background-image: url('{xen:helper medio, $article.article_icon.data}');"
                        href="{xen:link 'full:media/media', $article.article_icon.data}" data-href="{xen:link 'full:media/media/popout', $article.article_icon.data}"
                        data-cacheOverlay="false" data-overlayoptions="{&quot;fixed&quot;:false}">
                            <img src="styles/8wayrun/EWRmedio_play.png" />
                    </a>
                </xen:if>
                </xen:contentcheck>
            </div>
        </xen:if>
        </xen:if>
   
        <xen:if is="@porta2_articles_dateblock">
            <div class="dateBlock">
                <div class="heading">{xen:time $article.article_date, 'M'}</div>
                <div class="secondaryContent">{xen:time $article.article_date, 'd'}</div>
            </div>
        </xen:if>
       
        <div class="primaryContent">
            <div class="baseHtml excerptContent {xen:if '@porta2_articles_dateblock', 'excerptOffset'}">
                {xen:helper stripHtml, {xen:raw $article.messageHtml}}
               
                <xen:if is="{$article.article_break}">
                    <a href="{xen:link threads, $article}">{$article.article_break}...</a>
                </xen:if>
            </div>
        </div>
        <div class="post-controls controls width-narrow">
            <a href="{xen:link threads, $article}" class="control views">
                <span>
                    <i class="fa fa-eye" aria-hidden="true"></i>
                    <span class="counter" style="">{xen:number $article.view_count}</span>
                </span>
            </a>
            <a href="{xen:link threads, $article}#QuickReply" class="control replies">
                <span>
                    <i class="fa fa-comment-o" aria-hidden="true"></i>
                    <span class="counter" style="">{xen:number $article.reply_count}</span>
                </span>
            </a>
        <div class="controls sharing">
            <div class="bdSocialShare shareControl socialcounters got-data" data-url="{xen:link threads, $article}" data-server="">
                <div class="facebook got-counter" title="Chia sẻ lên Facebook">
                    <div class="fb-like" data-href="{xen:link threads, $article}" data-layout="button_count" data-action="like" data-size="small" data-show-faces="false" data-share="false"></div>
                </div>
            </div>
            <a href="https://cungcaphangsi.com/posts/{$article.thread_id}/permalink" class="control permalink OverlayTrigger">
                <span>
                    <i class="fa fa-share-alt" aria-hidden="true"></i>
                </span>
            </a>
        </div>
        </div>
       
    </div>
<div class="separator width-wide">&nbsp;</div>
</div>
Còn css tự code nha bác
Nhấn để mở rộng...

Bác có code thanh navigation bar có ô search trên đó mà float được cho em xin với ạ, làm mãi ko đc :(
 
tuna

tuna

Sergeant
Tham gia
30/01/2017
Bài viết
639
Được Like
276
bcat95 nói:
bác làm k đc ở chỗ nào á?
hover hay click hay khi responsive
Nhấn để mở rộng...

nói chung là thanh nav của e float được, còn ô search mặc định nó nằm dưới thanh nav, bình thường thì ko sao, nhưng khi co về màn 480 thì bị mất, e có thử chỉnh css rồi mà vẫn chưa đc vị trí nhưng ứng ý, nó toàn che mất mấy tab khi co về màn 480p.

Có cách nào dính nó vào thanh nav với chỉ 1 biểu tượng cái kính lúp ko nhỉ :(
 
N

nminhkhoi

Private
Tham gia
20/02/2017
Bài viết
31
Được Like
10
em cám ơn anh rất nhiều. check inbox em khi rảnh nhé. clap~~clap~~clap~~
 
tuna

tuna

Sergeant
Tham gia
30/01/2017
Bài viết
639
Được Like
276
bcat95 nói:
Demo:
View attachment 19410
EWRporta2_ArticleList_Bit
Mã: 
<div class="articleItem" id="article_{$article.thread_id}">
    <div class="sectionMain">
        <div class="metaData">
            <xen:if hascontent="true">
                    <xen:contentcheck>
                    <span class="poster-avatar">
                        <xen:avatar user="$article" size="s" class="Tooltip" title="{$article.username}" itemprop="photo" />
                    </span>
                    </xen:contentcheck>
            </xen:if>
          
            <span class="dateData">
                <a href="{xen:link members, $article}" class="username">{$article.username}</a>
                <a href="{xen:link threads, $article}">{xen:datetime $article.article_date}</a>
            </span>
            <div class="sectionFooter">
                <xen:include template="EWRporta2_Article_Categories">
                    <xen:map from="$article.categories.cats" to="$categories" />
                </xen:include>
            </div>
        </div>
        <div class="thr_img_home">
        <xen:if hascontent="true">
                <xen:contentcheck>
                    <xen:if is="{$article.article_icon.type} == 'attach'">
                        <a class="attachHolder" href="{xen:link threads, $article}">
                            <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAADAQMAAACUBtwLAAAAA1BMVEX///+nxBvIAAAAAXRSTlMAQObYZgAAAAtJREFUCJljYAABAAAGAAHmh/5/AAAAAElFTkSuQmCC"alt="{$article.article_icon.data.filename}" class="art_att" style="background: url({xen:link attachments, $article.article_icon.data});background-size: cover;">
                        </a>
                    <xen:elseif is="{$article.article_icon.type} == 'image'" />
                        <a class="attachHolder" href="{xen:link threads, $article}">
                        <img src="data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAADAQMAAACUBtwLAAAAA1BMVEX///+nxBvIAAAAAXRSTlMAQObYZgAAAAtJREFUCJljYAABAAAGAAHmh/5/AAAAAElFTkSuQmCC" alt="{$article.article_icon.data.file}" class="art_att" style="background: url({$article.article_icon.data.url});background-size: cover;">
                    <xen:elseif is="{$article.article_icon.type} == 'medio'" />
                        <a class="medioHolder OverlayTrigger"style="background-image: url('{xen:helper medio2, $article.article_icon.data}');"
                            href="{xen:link 'full:media/media', $article.article_icon.data}" data-href="{xen:link 'full:media/media/popout', $article.article_icon.data}"
                            data-cacheOverlay="false" data-overlayoptions="{&quot;fixed&quot;:false}">
                                <img src="styles/8wayrun/EWRmedio_play.png" />
                        </a>
                    </xen:if>
                </xen:contentcheck>
            </xen:if>
        </div>
        <div class="subHeading">
            {xen:helper threadPrefix, $article}
            <a href="{xen:link threads, $article}">{$article.article_title}</a>
        </div>
      
        <xen:if is="@porta2_articles_header">
        <xen:if hascontent="true">
            <div class="headerBlock">
                <xen:contentcheck>
                <xen:if is="{$article.article_icon.type} == 'attach'">
                    <a class="attachHolder" href="{xen:link threads, $article}"><img src="{xen:link attachments, $article.article_icon.data}" alt="{$article.article_icon.data.filename}" /></a>
                <xen:elseif is="{$article.article_icon.type} == 'image'" />
                    <a class="attachHolder" href="{xen:link threads, $article}"><img src="{$article.article_icon.data.url}" alt="{$article.article_icon.data.file}" /></a>
                <xen:elseif is="{$article.article_icon.type} == 'medio'" />
                    <a class="medioHolder OverlayTrigger"style="background-image: url('{xen:helper medio, $article.article_icon.data}');"
                        href="{xen:link 'full:media/media', $article.article_icon.data}" data-href="{xen:link 'full:media/media/popout', $article.article_icon.data}"
                        data-cacheOverlay="false" data-overlayoptions="{&quot;fixed&quot;:false}">
                            <img src="styles/8wayrun/EWRmedio_play.png" />
                    </a>
                </xen:if>
                </xen:contentcheck>
            </div>
        </xen:if>
        </xen:if>
  
        <xen:if is="@porta2_articles_dateblock">
            <div class="dateBlock">
                <div class="heading">{xen:time $article.article_date, 'M'}</div>
                <div class="secondaryContent">{xen:time $article.article_date, 'd'}</div>
            </div>
        </xen:if>
      
        <div class="primaryContent">
            <div class="baseHtml excerptContent {xen:if '@porta2_articles_dateblock', 'excerptOffset'}">
                {xen:helper stripHtml, {xen:raw $article.messageHtml}}
              
                <xen:if is="{$article.article_break}">
                    <a href="{xen:link threads, $article}">{$article.article_break}...</a>
                </xen:if>
            </div>
        </div>
        <div class="post-controls controls width-narrow">
            <a href="{xen:link threads, $article}" class="control views">
                <span>
                    <i class="fa fa-eye" aria-hidden="true"></i>
                    <span class="counter" style="">{xen:number $article.view_count}</span>
                </span>
            </a>
            <a href="{xen:link threads, $article}#QuickReply" class="control replies">
                <span>
                    <i class="fa fa-comment-o" aria-hidden="true"></i>
                    <span class="counter" style="">{xen:number $article.reply_count}</span>
                </span>
            </a>
        <div class="controls sharing">
            <div class="bdSocialShare shareControl socialcounters got-data" data-url="{xen:link threads, $article}" data-server="">
                <div class="facebook got-counter" title="Chia sẻ lên Facebook">
                    <div class="fb-like" data-href="{xen:link threads, $article}" data-layout="button_count" data-action="like" data-size="small" data-show-faces="false" data-share="false"></div>
                </div>
            </div>
            <a href="https://cungcaphangsi.com/posts/{$article.thread_id}/permalink" class="control permalink OverlayTrigger">
                <span>
                    <i class="fa fa-share-alt" aria-hidden="true"></i>
                </span>
            </a>
        </div>
        </div>
      
    </div>
<div class="separator width-wide">&nbsp;</div>
</div>
Còn css tự code nha bác
Nhấn để mở rộng...
Bác ơi cho em xin css luôn đc ko ạ :(, có mấy class mới quá ko biết thêm thế nào :(
 
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
C Help - Ai giúp mình làm forum với được không Styles Xenforo 8
D Help Giúp em với mấy anh , làm sao thay đổi kích thước này được Styles Xenforo 7
C Styles anh em ơi làm sao để được giao diện như vậy? Styles Xenforo 1
begingame Help Làm sao tạo được tiền tố được phân chia độc lập như vậy Styles Xenforo 7
nguyendinhbang Help Làm sao để có được Video như này Styles Xenforo 2

Chủ đề tương tự


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

XenForo 1 XenForo 2
Translate by PVS

Dịch vụ XenForo của VNXF

Telegram: anhanhxf

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

Xử lý sự cố (Troubleshooting)

Texlink

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
Mút Sofa Không Gian
Top Bottom