How can I change the icons of custom endpoints in my account page

Hello, I’ve added some custom endpoints for account page. And I’d like to give these elements particular icons in dashboard, just like default endpoints.
You can access to my site with the credentials provided here.

Hello,

Please try adding the following Custom CSS in the Global Custom CSS area under Theme Settings >> Custom CSS.

.wd-my-account-links .wt-smart-coupon-link a::before {
    content: "\f106";
font-family: "woodmart-font";
}

.wd-my-account-links .uap-link a:before {
    content: "\f106";
font-family: "woodmart-font";
}

.wd-my-account-links .portafoglio-link a:before {
    content: "\f106";
font-family: "woodmart-font";
}

.wd-my-account-links .make-a-deposit-link a:before {
    content: "\f106";
font-family: "woodmart-font";
}

.wd-my-account-links .withdrawal-requests-link a:before {
    content: "\f106";
font-family: "woodmart-font";
}

You can change the content and font-family as you need.

Regards.
Xtemos Studios

Hello, thank you for your code. But how can I use the awesome font as font family?

Hello,

You can use the icons from the following link:
https://fontawesome.com/v5/cheatsheet

And the font-family will be added like “font-family: “Font Awesome 5 Free”;”

Regards.
Xtemos Studios

Hello, thank you for your reply. But it still doesn’t work.
Here is my code added in global css.

.wd-my-account-links .wt-smart-coupon-link a::before {
font-family: "Font Awesome 5 Free";
content: "\f004";
}

.wd-my-account-links .uap-link a:before {
	font-family: "Font Awesome 5 Free";
	content: "\f0c0";
}

.wd-my-account-links .portafoglio-link a:before {
	font-family: "Font Awesome 5 Free";
	content: "\f555";
}

.wd-my-account-links .make-a-deposit-link a:before {
	 font-family: "Font Awesome 5 Free";
    content: "\f19c";
}

.wd-my-account-links .withdrawal-requests-link a:before {
	 font-family: "Font Awesome 5 Free";
    content: "\f0d6";
}

You can see the situation on my site by this image

Hello,

Please make sure that you have enabled the Font-Awesome Library to always use from Theme Settings >> Performance >> Fonts & icons.

Screenshot for Clarification: https://gyazo.com/a72cb5b72ce334b3fb863f7046eaa32a

Then check back.

Regards.
Xtemos Studios

Hello, I’ve enabled it. But it still doesn’t work

Hello,

Your issue has been Resolved. I have added the font-weight property with the Custom CSS for the icons and the issue is fixed.

Please clear cache and check back.

Regards.
Xtemos Studios

I confirm you that the problem is solved. Thank you for your help

Most Welcome 🙂

If you do not mind, can you please leave 5 stars rating for our theme by going here: http://themeforest.net/downloads It will allow us to release more updates and provide dedicated support in the future. It would encourage our work a lot. If you like our Theme and Support.

Have a wonderful day.

Topic Closed.
Best Regards.

[Author]

Posts