Add SVG image to link

Hi everyone. I’m a Webflow-junior.

Is it possible to add SVG image (Link Icon) to Link (“Webflow” word).

I suppose that I need to wrap my link in DIV, but I don’t know how to do it.

Thanks

Screenshot 2021-04-15 at 21.56.56

Hi @mkhdv instead add SVG to each link element manually there is another way with use of peudo element ::after. For this you need to use custom code like this.

.my-link::after{
content: "";
display: block;
width: 15px; /* size of box for background img */
height: 15px; /* size of box for background img */
position: absolute; 
background: url(path to your image);
/* top-left-bottom-right it is just option example and you can use your values */
top: 0px; 
left: 10px
}
1 Like

thank you, Stan

is it possible to do it without a paid plan?

hi @mkhdv I’m not sure as I do not remember is free plan have embed element activated. If not you can add another div as inline block and this will position this new div after.

EDIT: you can place your code inside page or site settings in head section as this is accessible on any plan. Don’t forget to wrap your code in <style></style> tags.

1 Like