Hướng dẫn Thêm font awesome cho debug

1,109 0 4
K

Kem

Private
Tham gia
31/12/2015
Bài viết
22
Được Like
20
Hôm nay xin phép tập tành viết gì đó đóng góp cho diễn đàn, bài viết này hướng dẫn cho những ai chưa rành về cách chèn các font awesome. Lọ mọ vài phút bật dedug xong ngồi chèn font awesome cho debug để nhìn khớp với mấy dòng mặc định của xenforo (trang chủ, trợ giúp,..v.v) ở dưới footer. Không dài dòng nữa đi thẳng vào vấn đề chính.

Demo:
Zalo_ScreenShot_14_1_2016_719463.png



Để thực hiện trước tiên các bạn lưu ý phải cài font awesome, sau đó vào temp footer tìm:

Mã: 
<xen:if is="{$debugMode}">
                <xen:if hascontent="true">
                    <dl class="pairsInline debugInfo" title="{$controllerName}-&gt;{$controllerAction}{xen:if $viewName, ' ({$viewName})'}">
                    <xen:contentcheck>
                        <xen:if is="{$page_time}"><dt>{xen:phrase timing}:</dt> <dd><a href="{$debug_url}" rel="nofollow">{xen:phrase x_seconds, 'time={xen:number $page_time, 4}'}</a></dd></xen:if>
                        <xen:if is="{$memory_usage}"><dt>{xen:phrase memory}:</dt> <dd>{xen:phrase x_mb, 'size={xen:number {xen:calc "{$memory_usage} / 1024 / 1024"}, 3}'}</dd></xen:if>
                        <xen:if is="{$db_queries}"><dt>{xen:phrase db_queries}:</dt> <dd>{xen:number {$db_queries}}</dd></xen:if>
                    </xen:contentcheck>
                    </dl>
                </xen:if>
            </xen:if>

... và thay bằng đoạn sau

Mã: 
<xen:if is="{$debugMode}">
                <xen:if hascontent="true">
                    <dl class="pairsInline debugInfo" title="{$controllerName}-&gt;{$controllerAction}{xen:if $viewName, ' ({$viewName})'}">
                    <xen:contentcheck>
                        <xen:if is="{$page_time}"><dt> <i class="fa fa-clock-o"></i> {xen:phrase timing}</dt> <dd> <a href="{$debug_url}" rel="nofollow">{xen:phrase x_seconds, 'time={xen:number $page_time, 4}'}</a></dd></xen:if>
                        <xen:if is="{$memory_usage}"><dt> <i class="fa fa-hdd-o"></i> {xen:phrase memory}</dt> <dd>{xen:phrase x_mb, 'size={xen:number {xen:calc "{$memory_usage} / 1024 / 1024"}, 3}'}</dd></xen:if>
                        <xen:if is="{$db_queries}"> <dt> <i class="fa fa-cogs"></i> {xen:phrase db_queries}:</dt> <dd>{xen:number {$db_queries}}</dd></xen:if>
                    </xen:contentcheck>
                    </dl>
                </xen:if>
            </xen:if></ul>

Ngoài ra bạn nào muốn các dòng mặc định của xenforo như Chọn Style, Ngôn Ngữ, Quy Định, v..v... cũng có font awesome thì tìm dòng sau:

Mã: 
<xen:hook name="footer">
    <div class="pageWidth">
        <div class="pageContent">
            <xen:if is="{$canChangeStyle} OR {$canChangeLanguage}">
            <dl class="choosers">
                <xen:if is="{$canChangeStyle}">
                    <dt>{xen:phrase style}</dt>
                    <dd><a href="{xen:link 'misc/style', '', 'redirect={$requestPaths.requestUri}'}" class="OverlayTrigger Tooltip" title="{xen:phrase style_chooser}" rel="nofollow">{$visitorStyle.title}</a></dd>
                </xen:if>
                <xen:if is="{$canChangeLanguage}">
                    <dt>{xen:phrase language}</dt>
                    <dd><a href="{xen:link 'misc/language', '', 'redirect={$requestPaths.requestUri}'}" class="OverlayTrigger Tooltip" title="{xen:phrase language_chooser}" rel="nofollow">{$visitorLanguage.title}</a></dd>
                </xen:if>
            </dl>
            </xen:if>
  
            <ul class="footerLinks">
            <xen:hook name="footer_links">
                <xen:if is="{$xenOptions.contactUrl.type} === 'default'">
                    <li><a href="{xen:link 'misc/contact'}" class="OverlayTrigger" data-overlayOptions="{&quot;fixed&quot;:false}">{xen:phrase contact_us}</a></li>
                <xen:elseif is="{$xenOptions.contactUrl.type} === 'custom'" />
                    <li><a href="{$xenOptions.contactUrl.custom}" {xen:if {$xenOptions.contactUrl.overlay}, 'class="OverlayTrigger" data-overlayOptions="{&quot;fixed&quot;:false}"'}>{xen:phrase contact_us}</a></li>
                </xen:if>
                <li><a href="{xen:link help}">{xen:phrase help}</a></li>
                <xen:if is="{$homeLink}"><li><a href="{$homeLink}" class="homeLink">{xen:phrase home}</a></li></xen:if>
                <li><a href="{$requestPaths.requestUri}#navigation" class="topLink">{xen:phrase go_to_top}</a></li>
                <li><a href="{xen:link forums/-/index.rss}" rel="alternate" class="globalFeed" target="_blank"
                    title="{xen:phrase rss_feed_for_x, 'title={$xenOptions.boardTitle}'}">{xen:phrase rss}</a></li>
            </xen:hook>
            </ul>
  
            <span class="helper"></span>
        </div>
    </div>
</div>

<div class="footerLegal">
    <div class="pageWidth">
        <div class="pageContent">
            <ul id="legal">
            <xen:hook name="footer_links_legal">
                <xen:if is="{$tosUrl}"><li><a href="{$tosUrl}">{xen:phrase terms_and_rules}</a></li></xen:if>
                <xen:if is="{$xenOptions.privacyPolicyUrl}"><li><a href="{$xenOptions.privacyPolicyUrl}">{xen:phrase privacy_policy}</a></li></xen:if>
            </xen:hook>
            </ul>
  
            <div id="copyright">{xen:helper copyright} {xen:phrase extra_copyright}</div>
            <xen:hook name="footer_after_copyright" />

            <xen:if is="{$debugMode}">
                <xen:if hascontent="true">
                    <dl class="pairsInline debugInfo" title="{$controllerName}-&gt;{$controllerAction}{xen:if $viewName, ' ({$viewName})'}">
                    <xen:contentcheck>
                        <xen:if is="{$page_time}"><dt>{xen:phrase timing}:</dt> <dd><a href="{$debug_url}" rel="nofollow">{xen:phrase x_seconds, 'time={xen:number $page_time, 4}'}</a></dd></xen:if>
                        <xen:if is="{$memory_usage}"><dt>{xen:phrase memory}:</dt> <dd>{xen:phrase x_mb, 'size={xen:number {xen:calc "{$memory_usage} / 1024 / 1024"}, 3}'}</dd></xen:if>
                        <xen:if is="{$db_queries}"><dt>{xen:phrase db_queries}:</dt> <dd>{xen:number {$db_queries}}</dd></xen:if>
                    </xen:contentcheck>
                    </dl>
                </xen:if>
            </xen:if>
  
            <span class="helper"></span>
        </div>
    </div>
</div>

và thay thế bằng:

Mã: 
    <div class="pageWidth">
        <div class="pageContent">
        <xen:comment>
            <xen:if is="{$canChangeStyle} OR {$canChangeLanguage}">
            <dl class="choosers">
                <xen:if is="{$canChangeStyle}">
                    <dt>{xen:phrase style}</dt>
                    <dd><a href="{xen:link 'misc/style', '', 'redirect={$requestPaths.requestUri}'}" class="OverlayTrigger Tooltip" title="{xen:phrase style_chooser}" rel="nofollow">{$visitorStyle.title}</a></dd>
                </xen:if>
                <xen:if is="{$canChangeLanguage}">
                    <dt>{xen:phrase language}</dt>
                    <dd><a href="{xen:link 'misc/language', '', 'redirect={$requestPaths.requestUri}'}" class="OverlayTrigger Tooltip" title="{xen:phrase language_chooser}" rel="nofollow">{$visitorLanguage.title}</a></dd>
                </xen:if>
            </dl>
            </xen:if>

            <ul class="footerLinks">
            <xen:hook name="footer_links">
                <xen:if is="{$xenOptions.contactUrl.type} === 'default'">
                    <a href="{xen:link 'misc/contact'}" class="OverlayTrigger" data-overlayOptions="{&quot;fixed&quot;:false}">{xen:phrase contact_us}</a>
                <xen:elseif is="{$xenOptions.contactUrl.type} === 'custom'" />
                    <a href="{$xenOptions.contactUrl.custom}" {xen:if {$xenOptions.contactUrl.overlay}, 'class="OverlayTrigger" data-overlayOptions="{&quot;fixed&quot;:false}"'}>{xen:phrase contact_us}</a>
                </xen:if>
                <li><a href="{xen:link help}">{xen:phrase help}</a></li>
                <xen:if is="{$homeLink}"><li><a href="{$homeLink}" class="homeLink">{xen:phrase home}</a></li></xen:if>
                <li><a href="{$requestPaths.requestUri}#navigation" class="topLink">{xen:phrase go_to_top}</a></li>
                <li><a href="{xen:link forums/-/index.rss}" rel="alternate" class="globalFeed" target="_blank"
                    title="{xen:phrase rss_feed_for_x, 'title={$xenOptions.boardTitle}'}">{xen:phrase rss}</a></li>
            </xen:hook>
            </ul>
            </xen:comment>

            <span class="helper"></span>
        </div>
    </div>
</div>

<div class="footerLegal">
    <div class="pageWidth">
        <div class="pageContent">

            <xen:hook name="footer_after_copyright" />

            <ul id="legal">
            <xen:if is="{$canChangeStyle} OR {$canChangeLanguage}">
                <xen:if is="{$canChangeStyle}">
                <li>
                    <a href="{xen:link 'misc/style', '', 'redirect={$requestPaths.requestUri}'} "class="OverlayTrigger Tooltip" title="{xen:phrase style_chooser}"><i class="fa fa-cog"></i>  <rel="nofollow">{$visitorStyle.title}</a>
                </li>
                </xen:if>
                <xen:if is="{$canChangeLanguage}">
                <li>
                    <a href="{xen:link 'misc/language', '', 'redirect={$requestPaths.requestUri}'}"class="OverlayTrigger Tooltip" title="{xen:phrase language_chooser}"><i class="fa fa-pencil"></i> <rel="nofollow">{$visitorLanguage.title}</a>
                </li>
                </xen:if>"
            </xen:if>
            <xen:hook name="footer_links_legal">
                <xen:if is="{$tosUrl}"><li><a href="{$tosUrl}"><i class="fa fa-file-text"></i> {xen:phrase terms_and_rules}</a></li></xen:if>
                <xen:if is="{$xenOptions.privacyPolicyUrl}"><li><a href="{$xenOptions.privacyPolicyUrl}">{xen:phrase privacy_policy}</a></li></xen:if>
            </xen:hook>
            <li>
                <ul class="footerLinks">
                    <xen:hook name="footer_links">
                        <xen:if is="{$homeLink}"><li><a href="{$homeLink}" class="homeLink"><i class="fa fa-home"></i> {xen:phrase home}</a></li></xen:if>
                        <xen:if is="{$xenOptions.contactUrl.type} === 'default'">
                            <li><a href="{xen:link 'misc/contact'}" class="OverlayTrigger" data-overlayOptions="{&quot;fixed&quot;:false}"><i class="fa fa-envelope"></i> {xen:phrase contact_us}</a></li>
                        <xen:elseif is="{$xenOptions.contactUrl.type} === 'custom'" />
                            <li><a href="{$xenOptions.contactUrl.custom}" {xen:if {$xenOptions.contactUrl.overlay}, 'class="OverlayTrigger" data-overlayOptions="{&quot;fixed&quot;:false}"'}>{xen:phrase contact_us}</a></li>
                        </xen:if>
                        <li><a href="{xen:link help}"><i class="fa fa-check-square-o"></i> {xen:phrase help}</a></li>
          
                <li><a href="{$requestPaths.requestUri}#navigation" class="topLink"><i class="fa fa-angle-up fa-lg"></i><xen:comment>{xen:phrase go_to_top}</xen:comment></a></li>
                <li><a href="{xen:link forums/-/index.rss}" rel="alternate" class="globalFeed" target="_blank"
                    title="{xen:phrase rss_feed_for_x, 'title={$xenOptions.boardTitle}'}">{xen:phrase rss}</a></li>
            </ul>
            </li>
            </ul>

Chúc các bạn thành công và ưng ý với thành quả vừa đạt được.
p/s: em biết nhiêu thì em hướng dẫn cho những bạn mới tập tành chưa biết, các cao nhân xin đừng chê cười ạ.
 
Sửa lần cuối:
Bài viết liên quan
Làm thế nào để gửi email cho users về các thread mới 1 tuần một lần? bởi gameboiz1806,
cho mình hỏi về account của xenforo bởi PIIIII,
Có cách nào để eddit và thêm dc mục ở đây không ạ? bởi gameboiz1806,
Làm thế nào để mình thêm dc các tag như kia ạ? (Help, Released 2x,...) bởi gameboiz1806,
Các bác có cách nào để chỉnh được chỉ cho phép users upload định dạng ảnh Webp không ạ? bởi gameboiz1806,
Cấu hình mail cho xenforo bởi quang9292,
Được quan tâm
Làm thế nào đẻ tối ưu mấy cái này xanh hết trên Xenforo? bởi gameboiz1806,
Bài viết mới
Làm thế nào đẻ tối ưu mấy cái này xanh hết trên Xenforo? bởi gameboiz1806,
Ở footer của mình bị hiển thị như này. Không biết làm ntn để ẩn được? bởi gameboiz1806,
File Attachment nằm ở đâu trên fpt hosting vậy cả nhà nhỉ bởi bloghocpiano,
Mình đã cài Litespeed nhưng LS không nhận bởi gameboiz1806,
Làm thế nào để gửi email cho users về các thread mới 1 tuần một lần? bởi gameboiz1806,
gặp sự cố khi upgrade bởi sanhpv,
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 Tutorial 2x FontAwesome Icons in Message User Info for Xenforo 2.2 - Thêm biểu tượng FontAwesome trong Message User Info của XenForo 2.2 Tips and Guides 0
PVS Tutorial 2x Font Awesome Icons in Navbar for 2.1 - Thêm biểu tượng Font Awesome vào Navbar cho XenForo 2.1 Tips and Guides 2
PVS Tutorial 2x Thêm biểu tượng Font Awesome động cho user group của XenForo 2 Tips and Guides 0
PVS Tutorial 2x Navtab menu FontAwesome - Thêm FontAwesome vào menu Navtab có hỗ trợ mobile cho XenForo 2 Tips and Guides 0
PVS Tutorial 2x Navtab menu FontAwesome use of - Thêm FontAwesome vào menu Navtab cho XenForo 2 Tips and Guides 0

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

Mobile/Zalo: 0906081284

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