Custom Image for Menu Items

tti2
15 Posts
tti2 posted this 09 March 2016

Hi every one,
Stagger Lee in post http://answers.themler.com/questions/62863/custom-image-for-menu-items explain how to implement icon in menu using only CSS (without special plugins for WP: Menu Icons, etc.), thanks a lot for explanation.

What is done wrong in my case: I set special class in WP menu, add CSS in Themler but Icon does not appears ?
On the figure 1: Home and Produkty it seems, the icon there is - space but does not appears.
On the figure 2: Google also see the Bootstrap Font

Added CSS:
.bd-menuitem-20.menu > a::before {
margin: 0 5px 0 0;
padding: 0;
font-family: 'Billion Web Font';
font-style: normal;
font-weight: normal;
text-decoration: inherit;
text-align: center;
text-transform: none;
width: 1em;
}
.bd-menuitem-20.menu > a::before {
content: '\123';
}

I give up. Where I made a mistake ? Please, help.

AS

Hi every one, Stagger Lee in post http://answers.themler.com/questions/62863/custom-image-for-menu-items explain how to implement icon in menu using only CSS (without special plugins for WP: Menu Icons, etc.), thanks a lot for explanation. What is done wrong in my case: I set special class in WP menu, add CSS in Themler but Icon does not appears ? On the figure 1: Home and Produkty it seems, the icon there is - space but does not appears. On the figure 2: Google also see the Bootstrap Font Added CSS: .bd-menuitem-20.menu > a::before { margin: 0 5px 0 0; padding: 0; font-family: 'Billion Web Font'; font-style: normal; font-weight: normal; text-decoration: inherit; text-align: center; text-transform: none; width: 1em; } .bd-menuitem-20.menu > a::before { content: '\123'; } I give up. Where I made a mistake ? Please, help. AS
wordpress-menu menu-icons menu-icons-plugin
figure-1.PNG
figure-2.PNG
Vote to pay developers attention to this features or issue.
4 Comments
Order By: Standard | Newest
Support Team
Support Team posted this 10 March 2016

Hi,

Maybe you will need to set the color to white as well as it might be black now. In any case please also provide a link to the site so we could review the code.

Sincerely,
Hella

Hi, Maybe you will need to set the color to white as well as it might be black now. In any case please also provide a link to the site so we could review the code. Sincerely, Hella
tti2
15 Posts
tti2 posted this 14 March 2016

Hi,
I provide link http://test.tti.pl/.
Please, take a look for main menu (set as responsive also for desktop).
For Home and Produkty are set additional CSS in WORDPRESS; in Themler are added CSS as pointed previously.
I also manipulated with color but no results I can't get icons in browser only spaces for them.

Best regards,
AS

Hi, I provide link http://test.tti.pl/. Please, take a look for main menu (set as responsive also for desktop). For Home and Produkty are set additional CSS in WORDPRESS; in Themler are added CSS as pointed previously. I also manipulated with color but no results I can't get icons in browser only spaces for them. Best regards, AS
Stagger Lee
1818 Posts
Stagger Lee posted this 14 March 2016

You have visibility: hidden set for ::before, ::after selectors. Remove it in Themler options for menu items.

You have visibility: hidden set for ::before, ::after selectors. Remove it in Themler options for menu items.
tti2
15 Posts
tti2 posted this 14 March 2016

Visibility means NO VALUE for Menu Item Icon options in Themler.
It works. I wish say more then thank You.
It is a pity that the author of the post does not have the authority to close it and then assign (for example) any points of reputation to a person who solved the problem.
Once again thanks a lot for Your advice.

Regards,
AS

Visibility means NO VALUE for Menu Item Icon options in Themler. It works. I wish say more then thank You. It is a pity that the author of the post does not have the authority to close it and then assign (for example) any points of reputation to a person who solved the problem. Once again thanks a lot for Your advice. Regards, AS
You must log in or register to leave comments