- This topic has 7 replies, 2 voices, and was last updated 2 years, 1 month ago by
.
-
Posts
-
I am needing help inserting category icons in WordPress. I am creating a website for a client that is mainly a blog and she wishes to have her categories labeled with custom icons. I am using a widget now that displays the posts on the homepage (screenshot is attached) and the icons that are currently showing are copy and pasted character icons. Is there a way to use custom icons or font-awesome icons for categories in WordPress? The current widget is “LiveMesh Add-ons” and has downloaded many plugins that allow for category icons but none will work on this widget.
Lead Developer
Hi there,
Which plugins for category icons have you tried?
What’s the password to access the frontend of the site?
Thanks! 🙂
Hi Tom! Thank you for your quick response, I’m really impressed!
I have tried all the plugins I could find, currently I’m using Easy Category Icons. If you go to categories you’ll see that I’ve uploaded images for the categories but they do not work. It only works if I paste in Unicode icons but that doesn’t really work from a design standpoint.
Is there some custom code I can put into GeneratePress to use FontAwesome instead?
Thanks Tom, I really appreciate your help. I love GeneratePress, I have build dozens of client sites using your theme and everyone is so happy with the result.
-Mel
You could try using your own CSS instead of a plugin.
For example:
1. Add Font Awesome to your site: https://docs.generatepress.com/article/font-awesome/
2. Find the body class of the category. For example, if I right click + Inspect the Diet and Herbs category, I see this class in the
<body>element:category-diet-herbs3. Find the
unicodeof the icon you want to use: https://fontawesome.com/icons/magic?style=solid3. Add the icon using CSS:
.category-diet-herbs .page-header h1:before { font-family: "Font Awesome 5 Free"; font-weight: 900; content: "\f0d0"; }Or, you can use an image:
.category-diet-herbs .page-header h1:before { content: url(URL TO YOUR IMAGE); }Hope this helps 🙂
Thank you so much!! I will give this a try and see how it goes. Really appreciate it, Tom. 🙂
You’re welcome 🙂
Hi! Could you also help me with this as well. I have my own SVG icons in the asset library of GenerateBlocks and I want to change the folders to my own custom SVG icon.
Customer Support
Can you open a new topic for your question?
This one is very old.
Thanks!
- The topic ‘How to create custom category icons in WordPress’ is closed to new replies.