Question 377486 in Html Question posted in
Some basic documentation can be found here.

Html – What's wrong with the src attribute in this img tag?

I got a handlebars main template with the following code.

<!doctype html>
<html>
<head>
    <title>Meadowlark Travel</title>
</head>
<body>
    <header><img src="/img/logo.png" alt="Meadowlark Travel Logo"></header>
    {{{body}}}
</body>
</html>

and I have a directory structure like this.

└── meadowlark.js
└── img
   └── logo.png

└── views

   └── home.handlebars

   └── layouts

         └── main.handlebars

When I boot up the server I get a 404 error for image. What am I typing wrong in the src attribute? meadowlark.js is what runs the server.

I have no clue what else to try I keep getting 404 error no matter what I type in.

Tags:

2

Answers


  1. Chosen as BEST ANSWER
    0

    Not sure what I did but it's working now. I did set the img folder to static with this line: app.use(express.static(__dirname + '/public')); and then put the img folder inside public.

    Or maybe the browser cached some earlier copy with bad code and now I refreshed it. Either way it's working now.


  2. 0

    I believe you need to use relative path like img/logo.png, the way you are doing it it’s trying to find on the root level, since the img folder you have is sibling of the HTML file you should use a relative path.

    So basically just remove the initial /

    <header><img src="img/logo.png" alt="Meadowlark Travel Logo"></header>
    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search