How to change an icon for the Shop page in the Menu?

This topic has 9 replies, 3 voices, and was last updated 4 years, 7 months ago by Artem Temos.

Viewing 10 posts - 1 through 10 (of 10 total)

Author

Posts
April 7, 2020 at 8:39 pm #185253

goodmanrams
Participant

Greetings,

I’ve placed all svg icons next to categories but there is an item on top called “Shop”
The “Shop” itself is a page /shop/, not a category, so advise where I can attach an icon for it?

April 8, 2020 at 6:13 am #185282

Aizaz Imtiaz Awan
Keymaster

Hello,

I saw the screenshot you attached. Unfortunately, There is no option in theme settings. You cannot use svg icons for the menu items.

You can only use the font-awesome icons by adding the class of the icon with the title.

Screenshot for Clarification: https://ibb.co/TLMmGbC

Best Regards.

April 8, 2020 at 6:14 am #185283
Artem Temos
Keymaster
Hello,

This option is available for categories only. If you want to put similar image for that particular menu item, try to add the following CSS code to the Custom CSS section and replace the image with your own
```
.menu-item-12034 a:before {
    content: "";
    display: inline-block;
    background: url(https://xo.kz/wp-content/uploads/2020/04/wine.svg) no-repeat center;
    background-size: contain;
    width: 20px;
    height: 20px;
    margin-right: 5px;
}
```
Kind Regards
April 8, 2020 at 9:28 am #185384

goodmanrams
Participant

Artem, why your support team lacks so much vs you mate. Keep it cool man and thanks for chiming in. Great support from you as always. Thank you.

April 8, 2020 at 9:31 am #185386

Artem Temos
Keymaster

Hello dear,

Some questions may not be in our support scope according to Envato Theme Support policy https://themeforest.net/page/item_support_policy
I have personally reviewed all your requests and see that most of questions answered correctly. But you are right, something is still missed in our support answers and we are always working on it to deliver the best service. We hope for your understanding and sorry for the inconvenience. It would be very kind of you if you can remove your negative review on ThemeForest while we are here to help you with all the requests.

Kind Regards

April 19, 2020 at 11:27 pm #188375

goodmanrams
Participant

The thread can be closed. Thank you.

April 20, 2020 at 12:13 am #188380

goodmanrams
Participant

The code works only for the desktop but mobile menu goes without the icon still.

April 20, 2020 at 6:15 am #188410

Artem Temos
Keymaster

Try to replace the following line in your code .menu-item-12034 a:before { with the following

.menu-item-3326 a:before, .menu-item-12034 a:before {

Kind Regards

April 24, 2020 at 1:06 pm #189689

goodmanrams
Participant

Thank you Artem, works fine now! By the way, if I’ll need to add an icon for the tag, where should I look to copy/paste same code with a different style (like you showed me earlier)?

April 25, 2020 at 2:53 am #189729

Artem Temos
Keymaster

This code works for the menu only. If you need to add the image somewhere on your website, we suggest you to use <img> tag instead.
Author

Posts

Viewing 10 posts - 1 through 10 (of 10 total)

How to change an icon for the Shop page in the Menu?

Create your WordPress website.