Xenforo 2.1 Add Font Awesome icons to the Forum Statistics (xf 2.0 / 2.1)

lolo68

Collaborate
Collaborate
Registered
Joined
Feb 18, 2019
Messages
23
Points
13

Reputation:

For xenforo 2.0 and xenforo 2.1

In your extra.less template add these codes ( code in the attached file )

Result :

04db84cbe9b7cced5cdfb30b8613f142.png


Code for the addon " Andy forumStatisticsPlus"

Résult :

1e00f991585d8bd581ad832480c6aa16.png


Crédit : @laurent68
 

Attachments

  • Add Font Awesome icons to the Forum Statistics.txt
    5.5 KB · Views: 222
Last edited:

Soul1991

Member
Registered
Joined
Nov 14, 2019
Messages
11
Points
3

Reputation:

No salen los iconos
 

Attachments

  • Screenshot_20191205-030320_Samsung Internet.jpg
    Screenshot_20191205-030320_Samsung Internet.jpg
    53.9 KB · Views: 148

ENXF NET

Administrator
Staff member
Administrator
Moderator
+Lifetime VIP+
S.V.I.P.S Member
S.V.I.P Member
V.I.P Member
Collaborate
Registered
Joined
Nov 13, 2018
Messages
19,151
Points
823

Reputation:

add extra.less
Code:
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs.pairs--justified > dt:before {
    font-family: "Font Awesome 5 Pro";
    padding-right: 3px;
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(1) dt:before {
    content: "\f4b2";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(2) dt:before {
    content: "\f4b6";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(3) dt:before {
    content: "\f2bd";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(4) dt:before {
    content: "\f234";
}
For l'add_on Andy forumStatisticsPlus
Code:
.p-body-sidebar [data-widget-definition="forumStatisticsPlus"] .pairs.pairs--justified > dt:before {

    font-family: "Font Awesome 5 Pro";

    padding-right: 3px;

}

.p-body-sidebar [data-widget-definition="forumStatisticsPlus"] .pairs:nth-child(1) dt:before {

    content: "\f4b2";

}

.p-body-sidebar [data-widget-definition="forumStatisticsPlus"] .pairs:nth-child(2) dt:before {

    content: "\f4b6";

}

.p-body-sidebar [data-widget-definition="forumStatisticsPlus"] .pairs:nth-child(3) dt:before {

    content: "\f2bd";

}

.p-body-sidebar [data-widget-definition="forumStatisticsPlus"] .pairs:nth-child(4) dt:before {

    content: "\f4b4";

}

.p-body-sidebar [data-widget-definition="forumStatisticsPlus"] .pairs:nth-child(5) dt:before {

    content: "\f4ab";

}

.p-body-sidebar [data-widget-definition="forumStatisticsPlus"] .pairs:nth-child(6) dt:before {

    content: "\f25d";

}

.p-body-sidebar [data-widget-definition="forumStatisticsPlus"] .pairs:nth-child(7) dt:before {

    content: "\f234";

}
 

WaterFR

New member
Registered
Joined
Oct 15, 2020
Messages
3
Points
13

Reputation:

It does not work in 2.2.7
 

Loki

Moderator
Staff member
Moderator
S.V.I.P Member
Collaborate
Registered
Joined
Dec 31, 2019
Messages
481
Points
253

Reputation:

It does not work in 2.2.7
WaterFRHi test this here

.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs.pairs--justified > dt:before {
.m-faBase();
padding-right: 6px;
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(1) dt:before {
content: "\f4b2";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(2) dt:before {
content: "\f4b6";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(3) dt:before {
content: "\f234";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(4) dt:before {
content: "\f0c0";
}
 

WaterFR

New member
Registered
Joined
Oct 15, 2020
Messages
3
Points
13

Reputation:

Hi test this here

.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs.pairs--justified > dt:before {
.m-faBase();
padding-right: 6px;
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(1) dt:before {
content: "\f4b2";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(2) dt:before {
content: "\f4b6";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(3) dt:before {
content: "\f234";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(4) dt:before {
content: "\f0c0";
}
LokiMy theme is Royal 2.0.4 lite :)

my extra.less
1636908993615.png
 

Loki

Moderator
Staff member
Moderator
S.V.I.P Member
Collaborate
Registered
Joined
Dec 31, 2019
Messages
481
Points
253

Reputation:

WaterFR

New member
Registered
Joined
Oct 15, 2020
Messages
3
Points
13

Reputation:

LokiI just put your code and I don't have this :)

Here is my extra.less:
PHP:
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs.pairs--justified > dt:before {
.m-faBase();
padding-right: 6px;
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(1) dt:before {
content: "\f4b2";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(2) dt:before {
content: "\f4b6";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(3) dt:before {
content: "\f234";
}
.p-body-sidebar [data-widget-definition="forum_statistics"] .pairs:nth-child(4) dt:before {
content: "\f0c0";
}

Addons : Andy forumStatisticsPlus
 
Top