index.php links and images do not work on localhost

Question

I want to test my index.php and related files in my PHP localhost using the method found in this top comment. I was able to set up my localhost properly using the command:

$ php -S localhost:8000

Now, when I enter http://localhost:8000/ into my browser. I am able to see the index.php but without the effects of my style.css. In addition, the links do not work and the images do not show as well. Below are sample and containers that I use:

<li><a href='next.html'>Next></a></li>

and

<img src="localhost/marriage2.png" alt="marriage2">

marriage2.png and next.html are both located in the same directory as index.php. This setup works on the live server but not on my local. Any idea as to why this issue is occurring in localhost?

More info is needed. What kind of web server are you running? What OS is it running on? How is it configured? Also a couple of things to note. If marriage2.png is in the root of your site directory drop the localhost/. The right arrow ">" in your link is possibly breaking your html link. Instead of > try using > — Urbley, Jan 30 '17 at 08:30
if "marriage2.png and next.html are both located in the same directory as index.php" than why — Ofir Baruch, Jan 30 '17 at 08:33
you must use http:// in image src attribute before localhost, this might be helpful with css href attribute, have a try (use of http is necessary in absolute path use else use relative path without localhost) — Gaurav Rai, Jan 30 '17 at 08:33
@GauravRai: relative paths to images without use of http is allowed (I would think most common use). — Linkan, Jan 30 '17 at 08:35
@Linkan that'd be fine if the image was contained inside a directory called localhost in the site's root directory — Urbley, Jan 30 '17 at 08:37
@Urbley: the image was in the same directory as the html-file, no info that it is in the root directory. Adding http:// would not do anything to solve the problem — Linkan, Jan 30 '17 at 08:41
I agree with you on the http:// part but there's no way localhost/marriage2.png would work unless localhost was a subdirectory of the root directory. The html MUST be in the root directory if the site is accessible @ http://localhost:8000 — Urbley, Jan 30 '17 at 08:44
This is because of the port 8000. If you run it on port 80 then it will definitely work. Try running your `index.php` file on `port 80` — Suhail Akhtar, Jan 30 '17 at 09:23

score 0 · Answer 1 · answered Sep 14 '19 at 07:29

!!!SOLUTION!!! Hi, I had the same problem! Here is the solution:

1) Check My Files locations (img folder is in the same folder as index.php): php display images paths 2) In that case the correct path to your images is: "public/img/example.png" 3) That's it ß you are good to go!

Additionally I apply the following code to get the img-urls from DataBase (which represent the real location on the localhost):

<?php foreach($mediaFiles as $mediaFile) : ?>
    <img src="<?= 'public/img'.DIRECTORY_SEPARATOR.$mediaFile['url']; ?>">
<?php endforeach; ?>

score -1 · Answer 2 · answered Jan 30 '17 at 08:52

I'm going to venture a guess @ the answer. If I'm not mistaken it looks like you're just starting out in the HTML/CSS world. I'd recommend some of the basic tutorials available @ w3schools.com

If I was writing it, it would look like this. As long as the CSS and Image files are in the same directory as index.php this should work. Change main.css to whatever your stylesheet is called.

<html>
  <head>
    <link rel="stylesheet" type="main.css">
  </head>
  <body>
    <ul>
      <li><a href="next.html">Next&gt;</a></li>
    </ul>
    <img src="marriage2.png" alt="marriage2">
  </body>
</html>

index.php links and images do not work on localhost

2 Answers2