Tutorial 2x Add Font Awesome icons to your usergroups - Thêm biểu tượng Font Awesome vào usergroup cho XenForo 2

[PVS]

Add Font Awesome icons to your usergroups - Thêm biểu tượng Font Awesome vào usergroup cho XenForo 2

Đây là code cơ bản để thêm vào template EXTRA.less của bạn:

/*add fa to your usergroups*/
.username--style3:before {
font-family: "FontAwesome";
content: "\f013";
color: inherit;
padding-right: 4px;
display: inline-block;
}

style3 là usergroup Admin của tôi.

Nếu bạn muốn rotation thì thêm:

.username--style3:hover:before{
display:inline-block;
-webkit-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-o-transform:rotate(360deg);
-ms-transform:rotate(360deg);
transform:rotate(360deg);
-webkit-transform:rotate(360deg);
-moz-transform:rotate(360deg);
-ms-transform:rotate(360deg);
-o-transform:rotate(360deg);
transition:all 0.8s;
-webkit-transition:all 0.8s;
-moz-transition:all 0.8s;
-ms-transition:all 0.8s;
-o-transition:all 0.8s
}

​

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

Nguồn: xenforo.com​