March 7, 2023, 5:27pm
My chat program needs to have an icon that I made called “User.svg” which is located in “images”. One thing you may notice once you see the program, is that the
index.html file is located inside of a folder called “public”. I try to reference my User.svg image from the img tag in my index.html code but that image does not show.
Second, why is my user.svg icon not showing up to the left of each new message?
You’ll need to make the images folder static as well, which means adding:
Then in the html file, make the src
User.svg and it should work.
March 7, 2023, 6:32pm
I’m afraid I shall need more clarification than that.
In your server.js, add the following code on line 12:
Then on line 175 in index.html, change the img src to
User.svg instead of
alternatively, you could try moving the whole “images” folder into “public” (That’d work right?)
That works too yes, but you’d still have to change the image src.
If you want to keep the image folder in the same place, use my solution.
March 7, 2023, 6:50pm
I moved the folder. But what about having the icon show to the left beside every new message
hmm, embed an html element at the beginning of each message that contains the user profile picture?
March 7, 2023, 10:36pm
If you can understand, can you please be more specific?
Porbably just add
<img src="./images/User.svg" alt="User Avatar"> to the beginning of each message (sorry for needing to edit, I don’t touch html
March 8, 2023, 1:37am
I know that, but I need to know
where in my code I should put that, in order to get the desired functionality.
Next to wherever you’re adding the messages to the page. (I’ll look)
Seems like you would need to add it to the code chunks by
March 15, 2023, 3:12pm
This topic was automatically closed 7 days after the last reply. New replies are no longer allowed.