Tasty Menu Icons not showing - How to

Sydney Pro
#1

Hi,
I am messing around for hours to get working custom icons for the menu section on my page.

Link

https://www.heuriger-dreimaederlhaus.com/

I tried a lot of things in Custom CSS, but I don’t get it. In html it shows:

img src="none"

When I change the src to the correct URL of my Icons, the Icons appear. But I am not able to make that constantly working with CSS.

I tried things like:
div.menu-group-header:nth-child(1) > img:nth-child(1) { src: url("http://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png"); }

and other CSS Selectors, but somewhere I am wrong. I guess src: url() is the problem, but I can not figure out how to get it right.

Could you please give me a hint or solution? I would appreciate it really.

Thank you very much.

Anmerkung%202019-12-02%20171812
Anmerkung 2019-12-02 171812.png1483×247 25.4 KB
Anmerkung%202019-12-02%20171813
Anmerkung 2019-12-02 171813.png277×780 21.8 KB
Anmerkung%202019-12-02%20172300
Anmerkung 2019-12-02 172300.png1495×195 25.9 KB

#2

Hi there,

Actually you already know the answer. The CSS code like this will not work.

div.menu-group-header:nth-child(1) > img:nth-child(1) { 
   src: url("http://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png"); 
}

Instead, please do the same as your uploaded image, e.g:

<img src="http://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png">

Regards,

#3

Thanks for your reply.
Still, I don’t get it working. Maybe, if you don’t mind could you please post the full code snippet for me?
I tried the following in different manners:

div.menu-group-header:nth-child(1) > img:nth-child(1) {
<img src="https://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png">

}

The selector should be right, as if I change

background: anycolor;

it works fine.

The initial question is, why does not show up the correct icon and URL after uploading it? Instead it shows src=“none”? How do I get rid of that problem? Any idea?

#4

Hi,

I am sorry, that’s not what I mean to merge the CSS code + HTML code:

div.menu-group-header:nth-child(1) > img:nth-child(1) {
<img src="https://www.heuriger-dreimaederlhaus.com/wp-content/uploads/2019/12/soup_gruen.png">
}

Is the upload-image as your last screenshot didn’t work?

If not, is it okay if you create a temporary login detail and send it to me through a private message?
Let me try to check it directly

#5

Sorry for my late reply, was really busy.
No, the icons are not shown at all. Only if I manually enter the Link of the icon into the Inspector of my Browser instead of “none”.
I see the icons in the customizer on the left side, but on the site itself only the “broken image” icon appears. And in the inspector I see img src="none".

That means - the upload of the icons in the customizer of tasty does not work correctly.
Can I manually enter the correct Links to my icons into the code? Into any theme file (php or html?)?
Or - what might be the correct CSS code as in inspector it works, but I don’t get it how the CSS in Custom CSS must look like.

Otherwise - yes, I can give you a login, but are you an admin of athemes? I only know Vlad and Roman for sure.

#6

Hmm… that’s odd.

Yes, I am admin support for several years on this theme. You can see a “moderator” badge next to my “avatar-username”.

#7

you have mail :wink:

…

#8

Hi there,

I’m not sure why it doesn’t work from the Customizer. It should work fine.

You can handle it with some custom CSS that you put in Customize > Additional CSS: https://pastebin.com/BwQfSd9d
You just need to replace each url with the one you need.

Otherwise, nice job with the site, looks cool.

Vlad

#9

Rock’n’Roll Vlad - Thank you so much. It works. Badaboom tssssss.