Cập nhật Icon FontAwesome trong Visitor Tab & Account Wrapper

924 0 0
PVS

PVS

Super Moderator
Thành viên BQT
Tham gia
28/02/2015
Bài viết
16,829
Được Like
12,687
Cập nhật Icon FontAwesome trong Visitor Tab & Account Wrapper

Trang chủ FontAwesome: http://fortawesome.github.io/Font-Awesome/]font awesome site
Danh sách các icon: http://fortawesome.github.io/Font-Awesome/icons/]Font awesome icons

font_awesomepane.png

​
1. Vào template PAGE_CONTAINER và thêm code này trong <head>
Mã: 
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

2. Đến template navigation_visitor_tab và thay thế tất cả mọi thứ giữa
Mã: 
<ul class="col1 blockLinksList">
</ul>

Mã: 
<xen:hook name="navigation_visitor_tab_links1">
                    <xen:if is="{$canEditProfile}"><li><a href="{xen:link account/personal-details}"><i class="fa fa-user fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase personal_details}</a></li></xen:if>
                    <xen:if is="{$canEditSignature}"><li><a href="{xen:link account/signature}"><i class="fa fa-pencil fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase signature}</a></li></xen:if>
                    <xen:if is="{$canEditProfile}"><li><a href="{xen:link account/contact-details}"><i class="fa fa-book fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase contact_details}</a></li></xen:if>
                    <li><a href="{xen:link account/privacy}"><i class="fa fa-lock fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase privacy}</a></li>
                    <li><a href="{xen:link account/preferences}" class="OverlayTrigger"><i class="fa fa-cog fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase preferences}</a></li>
                    <li><a href="{xen:link account/alert-preferences}"><i class="fa fa-bell-o fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase alert_preferences}</a></li>
                    <xen:if is="{$canUploadAvatar}"><li><a href="{xen:link account/avatar}" class="OverlayTrigger" data-cacheOverlay="true"><i class="fa fa-picture-o fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase avatar}</a></li></xen:if>
                    <xen:if is="{$xenOptions.facebookAppId}"><li><a href="{xen:link account/facebook}"><i class="fa fa-facebook fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase facebook_integration}</a></li></xen:if>
                    <li><a href="{xen:link account/security}"><i class="fa fa-key fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase password}</a></li>
                </xen:hook>
                </ul>
                <ul class="col2 blockLinksList">
                <xen:hook name="navigation_visitor_tab_links2">
                    <xen:if is="{$xenOptions.enableNewsFeed}"><li><a href="{xen:link account/news-feed}"><i class="fa fa-rss fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase your_news_feed}</a></li></xen:if>
                    <li><a href="{xen:link conversations}"><i class="fa fa-inbox fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase conversations}
                        <strong class="itemCount {xen:if $visitor.conversations_unread, '', 'Zero'}"
                            id="VisitorExtraMenu_ConversationsCounter">
                            <span class="Total">{xen:number $visitor.conversations_unread}</span>
                        </strong></a></li>
                    <li><a href="{xen:link account/alerts}"><i class="fa fa-exclamation-circle icon-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase alerts}
                        <strong class="itemCount {xen:if $visitor.alerts_unread, '', 'Zero'}"
                            id="VisitorExtraMenu_AlertsCounter">
                            <span class="Total">{xen:number $visitor.alerts_unread}</span>
                        </strong></a></li>
                    <li><a href="{xen:link account/likes}"><i class="fa fa-thumbs-up fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase likes_youve_received}</a></li>
                    <li><a href="{xen:link search/member, '', 'user_id={$visitor.user_id}'}"><i class="fa fa-comments icon-large  icon-fixed-width" style="padding-right:7px;"></i>{xen:phrase your_content}</a></li>
                    <li><a href="{xen:link account/following}"><i class="fa fa-group fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase people_you_follow}</a></li>
                    <li><a href="{xen:link account/ignored}"><i class="fa fa-ban fa-large  fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase people_you_ignore}</a></li>
                    <xen:if is="{$xenCache.userUpgradeCount}"><li><a href="{xen:link account/upgrades}"><i class="fa fa-arrow-circle-up fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase account_upgrades}</a></li></xen:if>
                </xen:hook>
                </ul>
            </div>
            <div class="menuColumns secondaryContent">
                <ul class="col1 blockLinksList">
                    <li>    
                        <form action="{xen:link account/toggle-visibility}" method="post" class="AutoValidator visibilityForm">
                            <label><input type="checkbox" name="visible" value="1" class="SubmitOnChange" {xen:checked $visitor.visible} />
                                {xen:phrase show_online_status}</label>
                            <input type="hidden" name="_xfToken" value="{$visitor.csrf_token_page}" />
                        </form>
                    </li>
                </ul>
                <ul class="col2 blockLinksList">
                    <li><a href="{xen:link logout, '', '_xfToken={$visitor.csrf_token_page}'}" class="LogOut"><i class="fa fa-sign-out fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase log_out}</a></li>

Bạn có thể phải thêm "color: #;" trong style= cho phù hợp với nhu cầu của bạn.

3. Vào template account_wrapper và thay thế tất cả giữa
Mã: 
<li class="section">

</li>

Bằng
Mã: 
<ul>
                    <xen:hook name="account_wrapper_sidebar_your_account">
                    <li><a
                        class="{xen:if "{$selectedKey} == 'alerts/latest'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/alerts}"><i class="fa fa-exclamation-circle fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase your_alerts}</a></li>
                    <xen:if is="{$xenOptions.enableNewsFeed}"><li><a
                        class="{xen:if "{$selectedKey} == 'alerts/newsFeed'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/news-feed}"><i class="fa fa-rss fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase your_news_feed}</a></li></xen:if>
                    <li><a
                        class="{xen:if "{$selectedKey} == 'alerts/likes'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/likes}"><i class="fa fa-thumbs-o-up fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase likes_youve_received}</a></li>
                    <li><a
                        class="primaryContent"
                        href="{xen:link watched/threads}"><i class="fa fa-comment fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase watched_threads}</a></li>
                    <li><a
                        class="primaryContent"
                        href="{xen:link watched/forums}"><i class="fa fa-comments fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase watched_forums}</a></li>
                    </xen:hook>
                </ul>
            </li>
        
            <!-- slot: pre_conversations -->
        
            <li class="section"><h4 class="subHeading">{xen:phrase conversations}</h4>
                <ul>
                    <xen:hook name="account_wrapper_sidebar_conversations">
                    <li><a
                        class="{xen:if "{$selectedKey} == 'conversations/view'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link conversations}"><i class="fa fa-inbox fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase view_conversations}</a></li>
                    <xen:if is="{$canStartConversation}"><li><a
                        class="{xen:if "{$selectedKey} == 'conversations/add'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link conversations/add}"><i class="fa fa-envelope fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase start_new_conversation}</a></li></xen:if>
                    </xen:hook>
                </ul>
            </li>
        
            <!-- slot: pre_settings -->
        
            <li class="section"><h4 class="subHeading">{xen:phrase settings}</h4>
                <ul>
                    <xen:hook name="account_wrapper_sidebar_settings">
                    <xen:if is="{$canEditProfile}"><li><a
                        class="{xen:if "{$selectedKey} == 'account/personalDetails'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/personal-details}"><i class="fa fa-user fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase personal_details}</a></li></xen:if>
                    <xen:if is="{$canEditSignature}"><li><a
                        class="{xen:if "{$selectedKey} == 'account/signature'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/signature}"><i class="fa fa-pencil fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase signature}</a></li></xen:if>
                    <li><a
                        class="{xen:if "{$selectedKey} == 'account/contactDetails'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/contact-details}"><i class="fa fa-book fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase contact_details}</a></li>
                    <li><a
                        class="{xen:if "{$selectedKey} == 'account/privacy'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/privacy}"><i class="fa fa-lock fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase privacy}</a></li>
                    <li><a
                        class="{xen:if "{$selectedKey} == 'account/preferences'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/preferences}"><i class="fa fa-cog fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase preferences}</a></li>
                    <li><a
                        class="{xen:if "{$selectedKey} == 'account/alertPreferences'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/alert-preferences}"><i class="fa fa-bell fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase alert_preferences}</a></li>
                    <li><a
                        class="{xen:if "{$selectedKey} == 'account/following'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/following}"><i class="fa fa-group fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase people_you_follow}</a></li>
                    <li><a
                        class="{xen:if "{$selectedKey} == 'account/ignored'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/ignored}"><i class="fa fa-ban fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase people_you_ignore}</a></li>
                    <xen:if is="{$xenCache.userUpgradeCount}"><li><a
                        class="{xen:if "{$selectedKey} == 'account/upgrades'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/upgrades}"><i class="fa fa-arrow-circle-up fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase account_upgrades}</a></li></xen:if>
                    <xen:if is="{$xenOptions.facebookAppId} OR {$xenOptions.twitterAppKey} OR {$xenOptions.googleClientId}"><li><a
                        class="{xen:if "{$selectedKey} == 'account/externalAccounts'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/external-accounts}"><i class="fa fa-chain-broken fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase external_accounts}</a></li></xen:if>
                    <li><a
                        class="{xen:if "{$selectedKey} == 'account/security'", 'secondaryContent', 'primaryContent'}"
                        href="{xen:link account/security}"><i class="fa fa-key fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase password}</a></li>
                    </xen:hook>
                </ul>

Và thay thế bằng:
Mã: 
<li><a href="{xen:link logout, '', '_xfToken={$visitor.csrf_token_page}'}"
                        class="LogOut primaryContent"><i class="fa fa-sign-out fa-large fa-fixed-width" style="padding-right:7px;"></i>{xen:phrase log_out}</a></li>

Bạn có thể phải thêm "color: #;" trong style= cho phù hợp với nhu cầu của bạn.

panel.png

​
Chúc các bạn thành công.


Nguồn: xenforo.com​
 
Bài viết liên quan
Lỗi icon cho giao diện IO tốt bởi Binvnhehe999,
Hỏi về thêm icon sau node list bởi loinguyen1x94,
Ai giúp mình đổi icon chỗ này với ạ bởi NOKIAPRO,
Make collapsible sub-forums of a forum with no parent in forum list - Tạo sub-forum thu gọn của diễn đàn không có parent trong forum list XenForo 2 bởi PVS,
Adding Social Media Icons to the Headar Section - Thêm các biểu tượng Social vào Header XenForo 2 bởi PVS,
Bị lỗi không login & đăng kí được bởi JinkyS,
Bài viết mới
Mong các AE giúp đỡ em tạo Custom thread fields bởi nguyendinhnham,
Hiện bài viết trên thống kê. bởi maichi111,
làm như thế này như thế nào ạ bởi phamnguyen,
Sao profile post của mình k hiện bởi sanhpv,
Hỏi về rank bị dài bởi boyngheo21,
Xenforo modification bởi urkyfight,
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
2-tek Other Phân cấp comment? Template Modifications 5
longruoi Thủ Thuật Hiển thị footer tùy chỉnh theo link truy cập. Template Modifications 4
PVS Other "Current Visitors" for logged in members only - "Đang truy cập" chỉ giành cho thành viên đăng nhập Template Modifications 0
PVS Require Steam ID for Account Upgrades - Yêu cầu ID Steam cho Nâng cấp tài khoản Template Modifications 1
đình hoàng [hỏi] về thăng cấp trong xenforo Template Modifications 7

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