Archived topic
How to get a class applied to a background image
5 replies · Started by Sue on March 11, 2022
I'm trying to add a menu item to a secondary menu with social icons, using Menus and Custom CSS in the Customizer. However, the image isn't showing up, and when I inspect it, it looks like all of the visible icons have the "solinks" class applied to them, but the new icon does not:
https://libbyhellmann.com/wp-content/uploads/2022/03/Screen-Shot-2022-03-11-at-4.55.51-PM.png
If you view the site's source code, you should see the images around line 220. The "missing" icon is Pinterest, and the image does show up if I copy and paste the image URL:
.pinterest{background-image: url('https://libbyhellmann.com/wp-content/uploads/2022/03/pinterest.png');}
What am I missing that would enable the solinks class to apply to the pinterest icon?
Hi Sue,
The menu item doesn't have Pinterest or solinks in its class list so that the CSS won't work.
https://www.screencast.com/t/cPBT5mAlvS
Yes, I realize that, I just can't figure out how to get those in there. This is what it looks like in the customizer. It looks identical to the others so I don't know why the image isn't appearing?
https://libbyhellmann.com/wp-content/uploads/2022/03/Screen-Shot-2022-03-11-at-5.24.35-PM.png
This article should help:
https://sevenspark.com/how-to/how-to-add-a-custom-class-to-a-wordpress-menu-item
You just need to follow the step 1 - 3.
Oh my gosh, that was exactly what I needed! THANK YOU!!!
No problem :)
