Icone Code for Fontawesome

XF 2.3 Icone Code for Fontawesome

Add-on xenforo 2

Ressources et modules complémentaires pour XenForo 2

Styles xenforo 2

Styles / Thèmes et apparence pour xenforo 2

Templates xenforo 2

Codes pour modifier les templates sur xenforo 2

Section Premium

Add-on et Styles pour membre Premium
Icone Code for Fontawesome

XF 2.3 Icone Code for Fontawesome

Catégorie Catégorie Modifications Templates
Titre du sujet Titre du sujet Icone Code for Fontawesome
Auteur de la discussion Auteur de la discussion Binkaddas
Date de début Date de début
Réponses Réponses 2
Affichages Affichages 251
Réaction Réaction 5
Dernier message par Dernier message par chithanh22

Binkaddas

Membre Actif

Membre
Réputation: 11%
Discussions
8
Messages
95
Solutions
1
J'aime
9
Points
8
I show you the code for all forum icons, it's working for version Xenforo 2.3

All Code should be add it to ( extra.less )

1- Main Fourm iCone
1726895299194.png

- Code below
Code:
/* XenForo 2.1.x Navtab menu FontAwesome 5 - Start */
.p-navEl a:before {
    .m-faBase();
    display: inline-block;
    text-align: center;
    margin-right:5px;
    border-radius:30px;
    line-height:normal;
}
.p-navEl a[data-nav-id='home']:before {.m-faContent("@{fa-var-home}");}
.p-navEl a[data-nav-id='forums']:before {.m-faContent("@{fa-var-comments}");}
.p-navEl a[data-nav-id='whatsNew']:before {.m-faContent("@{fa-var-question}");}
.p-navEl a[data-nav-id='members']:before {.m-faContent("@{fa-var-users}");}
.p-navEl a[data-nav-id='xfrm']:before {.m-faContent("@{fa-var-download}");}
.p-navEl a[data-nav-id='xfmg']:before {.m-faContent("@{fa-var-camera}");}
/*Subnav Forums*/
.p-navEl a[data-nav-id='newPosts']:before {.m-faContent("@{fa-var-search-plus}");}
.p-navEl a[data-nav-id='findThreads']:before {.m-faContent("@{fa-var-search}");}
.p-navEl a[data-nav-id='searchForums']:before {.m-faContent("@{fa-var-search}");}
.p-navEl a[data-nav-id='watched']:before {.m-faContent("@{fa-var-eye}");}
.p-navEl a[data-nav-id='markForumsRead']:before {.m-faContent("@{fa-var-eye-slash}");}
/* WhatsNew Subnav */
.p-navEl a[data-nav-id='whatsNewPosts']:before {.m-faContent("@{fa-var-pencil}");}
.p-navEl a[data-nav-id='whatsNewProfilePosts']:before {.m-faContent("@{fa-var-rss}");}
.p-navEl a[data-nav-id='whatsNewNewsFeed']:before {.m-faContent("@{fa-var-star}");}
.p-navEl a[data-nav-id='xfmgWhatsNewNewMedia']:before {.m-faContent("@{fa-var-images}");}
.p-navEl a[data-nav-id='xfmgWhatsNewMediaComments']:before {.m-faContent("@{fa-var-comments}");}
.p-navEl a[data-nav-id='xfrmNewResources']:before {.m-faContent("@{fa-var-download}");}
.p-navEl a[data-nav-id='latestActivity']:before {.m-faContent("@{fa-var-trophy}");}
/* XFMG Subnav */
.p-navEl a[data-nav-id='xfmgNewMedia']:before {.m-faContent("@{fa-var-images}");}
.p-navEl a[data-nav-id='xfmgNewComments']:before {.m-faContent("@{fa-var-comments}");}
.p-navEl a[data-nav-id='xfmgAddMedia']:before {.m-faContent("@{fa-var-plus-square}");}
.p-navEl a[data-nav-id='xfmgYourContent']:before {.m-faContent("@{fa-var-user}");}
.p-navEl a[data-nav-id='xfmgWatchedContent']:before {.m-faContent("@{fa-var-eye}");}
.p-navEl a[data-nav-id='xfmgSearchMedia']:before {.m-faContent("@{fa-var-search}");}
.p-navEl a[data-nav-id='xfmgMarkViewed']:before {.m-faContent("@{fa-var-eye-slash}");}
/* XFRM Subnav */
.p-navEl a[data-nav-id='xfrmLatestReviews']:before {.m-faContent("@{fa-var-balance-scale}");}
.p-navEl a[data-nav-id='xfrmYourResources']:before {.m-faContent("@{fa-var-user}");}
.p-navEl a[data-nav-id='xfrmWatched']:before {.m-faContent("@{fa-var-eye}");}
.p-navEl a[data-nav-id='xfrmSearchResources']:before {.m-faContent("@{fa-var-search}");}
/* Members Subnav */
.p-navEl a[data-nav-id='currentVisitors']:before {.m-faContent("@{fa-var-user-plus}");}
.p-navEl a[data-nav-id='newProfilePosts']:before {.m-faContent("@{fa-var-pencil}");}
.p-navEl a[data-nav-id='searchProfilePosts']:before {.m-faContent("@{fa-var-user-secret}");}
/* XenForo 2.1.x Navtab menu FontAwesome 5 - End */


2- User Information
1726895424637.png


- Code below
Code:
/* Icons in Visitor menu */
.menu-content.js-visitorMenuBody .menu-linkRow {
    padding: 6px 5px 6px 12px;
}
.menu-content.js-visitorMenuBody a.menu-linkRow {
    &:before {
        padding-right: 5px;
    }
    &[href*="whats-new/news-feed"]:before {
        .m-faContent(@fa-var-rss);
    }
    &[href*="search/member"]:before {
        .m-faContent(@fa-var-comments);
    }
    &[href*="account/reactions"]:before {
        .m-faContent(@fa-var-thumbs-up);
    }
    &[href*="account/alerts"]:before {
        .m-faContent(@fa-var-bell);
    }
    &[href*="account/account-details"]:before {
        .m-faContent(@fa-var-user-cog);
    }
    &[href*="account/security"]:before {
        .m-faContent(@fa-var-shield-alt);
    }
    &[href*="account/privacy"]:before {
        .m-faContent(@fa-var-lock);
    }
    &[href*="account/preferences"]:before {
        .m-faContent(@fa-var-cogs);
    }
    &[href*="account/signature"]:before {
        .m-faContent(@fa-var-signature);
    }
    &[href*="account/upgrades"]:before {
        .m-faBase('Brands');
        .m-faContent(@fa-var-paypal);
    }
    &[href*="account/connected-accounts"]:before {
        .m-faContent(@fa-var-users-class);
    }
    &[href*="account/following"]:before {
        .m-faContent(@fa-var-user-plus);
    }
    &[href*="account/ignored"]:before {
        .m-faContent(@fa-var-user-minus);
    }
    &[href*="logout"]:before {
        .m-faContent(@fa-var-sign-out);
    }
}
/*****/


3- Members
1726895549367.png


- Code below
Code:
/* Icons on Notable members page */
[data-template="member_notable"] .p-body-sideNavContent a.blockLink,
&[data-template="member_notable"] h3.block-textHeader a {
    &:before {
        .m-faBase();
        padding-right: 5px;
    }
    &[href*="members/"]:before {
        .m-faContent(@fa-var-ellipsis-h-alt);
    }
    &[href*="key=most_messages"]:before {
        .m-faContent(@fa-var-comments);
    }
    &[href*="key=highest_reaction_score"]:before {
        .m-faContent(@fa-var-thumbs-up);
    }
    &[href*="key=most_points"]:before {
        .m-faContent(@fa-var-dot-circle);
    }
    &[href*="key=xfrm_most_resources"]:before {
        .m-faContent(@fa-var-cog);
    }
    &[href*="key=xfmg_most_media_items"]:before {
        .m-faContent(@fa-var-images);
    }
    &[href*="key=xfmg_most_albums"]:before {
        .m-faContent(@fa-var-image);
    }
    &[href*="key=todays_birthdays"]:before {
        .m-faContent(@fa-var-gift);
    }
    &[href*="key=staff_members"]:before {
        .m-faContent(@fa-var-user-tie);
    }
}
/*****/


4- Account Details
1726895653217.png


- Code below
Code:
/* Icons in sidenav on Account page */
[data-template="account_alerts"], &[data-template="account_reactions"], &[data-template="account_bookmarks"],
&[data-template="account_details"], &[data-template="account_security"], &[data-template="account_privacy"],
&[data-template="account_preferences"], &[data-template="account_signature"], &[data-template="account_upgrades"],
&[data-template="account_connected"], &[data-template="account_applications"], &[data-template="account_following"], &[data-template="account_ignored"] {
    .p-body-sideNavContent a.blockLink {
        &[href*="members/"]:before {
            .m-faContent(@fa-var-user);
        }
        &[href*="account/alerts"]:before {
            .m-faContent(@fa-var-bell);
        }
        &[href*="account/reactions"]:before {
            .m-faContent(@fa-var-thumbs-up);
        }
        &[href*="account/bookmarks"]:before {
            .m-faContent(@fa-var-bookmark);
        }
        &[href*="account/account-details"]:before {
            .m-faContent(@fa-var-user-cog);
        }
        &[href*="account/security"]:before {
            .m-faContent(@fa-var-shield-alt);
        }
        &[href*="account/privacy"]:before {
            .m-faContent(@fa-var-lock);
        }
        &[href*="account/preferences"]:before {
            .m-faContent(@fa-var-cogs);
        }
        &[href*="account/signature"]:before {
            .m-faContent(@fa-var-signature);
        }
        &[href*="account/upgrades"]:before {
            .m-faContent(@fa-var-paypal);
        }
        &[href*="account/connected-accounts"]:before {
            .m-faContent(@fa-var-users-class);
        }
        &[href*="account/applications"]:before {
            .m-faContent(@fa-var-grip-horizontal);
        }
        &[href*="account/following"]:before {
            .m-faContent(@fa-var-user-plus);
        }
        &[href*="account/ignored"]:before {
            .m-faContent(@fa-var-user-minus);
        }
        &[href*="logout"]:before {
            .m-faContent(@fa-var-sign-out);
        }
    }
}
/*****/


5- Forum List: Sidebar
1726895758807.png


- Code below
Code:
[data-widget-section="staffMembers"] h3.block-minorHeader:before { /* Staff online */
    display: inline-block;
    padding-right: 5px;
    .m-faBase();
    .m-faContent(@fa-var-user-tie);
}
[data-widget-section="onlineNow"] h3.block-minorHeader:before { /* Members online */
    display: inline-block;
    padding-right: 5px;
    .m-faBase();
    .m-faContent(@fa-var-users);
}
[data-widget-key="forum_overview_new_posts"] h3.block-minorHeader:before { /* Latest posts */
    display: inline-block;
    padding-right: 5px;
    .m-faBase();
    .m-faContent(@fa-var-comments);
}
[data-widget-key="xfrm_forum_overview_new_resources"] h3.block-minorHeader:before { /* Latest resources */
    display: inline-block;
    .m-faBase();
    .m-faContent(@fa-var-download);
}
[data-widget-key="forum_overview_forum_statistics"] h3.block-minorHeader:before { /* Forum statistics */
    display: inline-block;
    padding-right: 5px;
    .m-faBase();
    .m-faContent(@fa-var-chart-bar);
}
[data-widget-key="xfmg_media_slider"] h3.block-minorHeader:before { /* Random media */
    display: inline-block;
    padding-right: 5px;
    .m-faBase();
    .m-faContent(@fa-var-image);
}
[data-widget-key="forum_overview_share_page"] h3.block-minorHeader:before { /* Share this page */
    display: inline-block;
    padding-right: 5px;
    .m-faBase();
    .m-faContent(@fa-var-share-alt);
}

6- Main Fourm iCone Colored
1726895949725.png


- Code below
Code:
/* NavBar modifications */
.p-navEl a:before, .p-navEl:before,.offCanvasMenu--nav:before, .p-nav-list .p-navEl ap-navEl-link:before {
    .m-faBase();
/* display: inline-block;*/
    text-align: center;
/* margin-right:5px;*/
    border-radius:30px;
    line-height:normal;
}

.offCanvasMenu--nav a[data-nav-id='home']:before,.p-navEl a[data-nav-id='home']:before {.m-faContent("@{fa-var -home}");}
.offCanvasMenu--nav a[data-nav-id='forums']:before,.p-navEl a[data-nav-id='forums']:before {.m-faContent("@{fa-var -comments}");color: #fc8a21;}
.offCanvasMenu--nav a[data-nav-id='whatsNew']:before,.p-navEl a[data-nav-id='whatsNew']:before {.m-faContent("@{fa-var -question}");color: #faf08c;}
.offCanvasMenu--nav a[data-nav-id='members']:before,.p-navEl a[data-nav-id='members']:before {.m-faContent("@{fa-var -users}");color: cyan;}

.offCanvasMenu--nav a[data-nav-id='xfrm']:before,.p-navEl a[data-nav-id='xfrm']:before {.m-faContent("@{fa-var -download}");color: #ee5f78;}
.offCanvasMenu--nav a[data-nav-id='xfmg']:before,.p-navEl a[data-nav-id='xfmg']:before {.m-faContent("@{fa-var -camera-retro}");color: #93f8fc;}
.offCanvasMenu--nav a[data-nav-id='xa_showcase']:before,.p-navEl a[data-nav-id='xa_showcase']:before {.m-faContent("@{fa-var -planet-ringed}");color: #db52db;}
.offCanvasMenu--nav a[data-nav-id='xa_ams']:before,.p-navEl a[data-nav-id='xa_ams']:before {.m-faContent("@{fa-var -pencil}");color: #bdf406;}
.offCanvasMenu--nav a[data-nav-id='xa_cas']:before,.p-navEl a[data-nav-id='xa_cas']:before {.m-faContent("@{fa-var -dollar-sign}");color: #04cf04;}
.offCanvasMenu--nav a[data-nav-id='xa_ld']:before,.p-navEl a[data-nav-id='xa_ld']:before {.m-faContent("@{fa-var -link}");color: #9c95c6;}
.offCanvasMenu--nav a[data-nav-id='xa_rms']:before,.p-navEl a[data-nav-id='xa_rms']:before {.m-faContent("@{fa-var -atom}");color: #9c95c6;}
.offCanvasMenu--nav a[data-nav-id='xa_ubs']:before,.p-navEl a[data-nav-id='xa_ubs']:before {.m-faContent("@{fa-var -blog}");color: #f4b4fa;}
.offCanvasMenu--nav a[data-nav-id='xa_ims']:before,.p-navEl a[data-nav-id='xa_ims']:before {.m-faContent("@{fa-var -clipboard-list}");color: #9c95c6;}
.offCanvasMenu--nav a[data-nav-id='tl_groups']:before,.p-navEl a[data-nav-id='tl_groups']:before {.m-faContent("@{fa-var -user-friends}");color: #a5f4ae;}
.p-navEl [data-nav-id='astroutil']:before {.m-faContent("@{fa-var-tools}");color: #fd9ab0; display:block; text-align: center; margin-left: auto;
    margin-right: auto; padding-right: 30px;}
.offCanvasMenu--nav [data-nav-id='astroutil']:before{.m-faContent("@{fa-var-tools}");color: #fd9ab0;}
 


/* Navtab menu using FontAwesome 5 */

7- login and register icon
1726896308234.png


- Code below
Code:
/* Icons for Login and Register buttons */
.p-navgroup-link.p-navgroup-link--textual.p-navgroup-link--logIn:before {
    .m-faContent(@fa-var-sign-in);
    color: #E6BB5C;
}
.p-navgroup-link.p-navgroup-link--textual.p-navgroup-link--register:before {
    .m-faContent(@fa-var-key);
    color: #E6BB5C;
}
/**********/

8- Fourm Rules
1726896455552.png


- Code below
Code:
.p-footer-linkList a[href*="/help/"]:before{.m-faContent(@fa-var-info-circle);}

.p-footer-linkList a[href*="/misc/contact"]:before{.m-faContent(@fa-var-envelope);}

.p-footer-linkList a[href*="/terms/"]:before{.m-faContent(@fa-var-file-alt);}

.p-footer-linkList a[href*="/privacy-policy/"]:before{.m-faContent(@fa-var-user-secret);}

.p-footer-linkList a[href*="https://nadorforum.com"]:before{.m-faContent(@fa-var-home);}


9- Home Furm Only
1726896597642.png


- Code below
Code:
.p-navEl a{
 
        &[data-nav-id='home']:before{
            .m-faBase('Pro');
            .m-faContent(@fa-var-home);
        }
}
 
Dernière édition:
Contenu similaire Les plus vues Voir plus
Retour
Haut Bas