I am a newbie in website development.
here is my problem :
I have 2 HTML files. they are 'index.php' and 'header.php' . I try to include 'header.php' in to the 'index.php' using this code :
'index.php'
<body>
<?php
include("header/header.php");
?>
</body>
'header.php' contain this code :
<h1>Its header</h1>
<img src="img/006-tumblr.png" width="200" height="200">
its the folder hirearchy :
-index.php
--header
--img
-006-tumblr.png
-header.php
When I open 'index.php' , 'header.php' is included but the image is not displaying.
So how can I include 'header.php' with the image?
A good way of proceeding would be to have a folder "img" in your root public HTML path containing all images, eventually with subfolders to separate them. The reason for that is that your main controller is launching from root. In that way, wherever you call your image file, you just have to go to img/ in order to find it. The same logic applies to all media. So, if you intend to have video for example, you could have a main folder media with a img subfolder and a vid subfolder. This type of logic has to be defined at start of project so that you don't have to refactor in the middle of it.
The logic of including a file into another is different from linking a CSS file. When you include a PHP file, the entire code is added to the source file and then the server compiles the codes. So the image files and other resources should be addressed relative to the source document (not the included one). This logic is different in a CSS file and the resource files e.g. a background image is complied relative to the CSS file (Because a CSS may be used in different files hirearchy). So this will work:
<h1>Its header</h1>
<img src="header/img/006-tumblr.png" width="200" height="200"
Footnote: If you want to use header in different files with different hirearchy the solution for the question above is to set BASEURL for your document and setting the resource and anchores relative to the baseurl.
Giving location from root directory makes image accessible from any location.
<?php define('WEBSITE_BASE', $_SERVER["SERVER_NAME"]); ?>
<img src="<?=WEBSITE_BASE?>/header/img/006-tumblr.png" width="200" height="200">
Best linking policy you should always follow to link static assets to your page so that it links wherever the item is used.
Related
On my php site I'm trying to include html pages outside the root folder (the html pages change automatically)
if I include an html page I get the 404 error for the linked files and if I include the linked files too they aren't displayed correctly
path/site/root/index.php
...
include("path/html/index1.html");
include("path/html/index1_files/img.png");
...
path/html/index1.html
...
<img src="index1_files/img.png">
...
result:
You need to specify the directory properly. So, in your case, when linking to the image, replace <img src="index1_files/img.png"> with <img src="./index1_files/img.png">. The ./ goes back into the folder the file is saved in, and ../ goes up one level. Your code is looking for a folder called index1_files within the current page.
I’m creating a new site and in order to have the same navigation and footer in each page I created a footer and navigation files .
I put footer.php and navigation.php inside folder /include
this it the structure of my site so far:
old site folder
index.html
other.html
New Site folder
/index.php
/biography.php
/style folder (style.css, responsive.css)
/images folder
/include folder (footer.php , navigation.php)
/media folder (videos.php)
the problems I have are with images included in footer and links within the navigation menu
for instance, on file biography.php I put on the footer area this calls the footer just fine but the images I have in the footer are broken (the images reside in the images folder)
the same for navigation on biography.php, I have but the links in nav menu go back to old site folder, for instance index.php links to oldsite/index.php instead of newsite/index.php
the file videos.php footer and navigation display all ok , images and links
I guess the issue is with the paths, I tried adding / and dots but it doesn’t work
I don’t know what to do.. :(
You can define definite path to your images:
for example:
<img src='<?="$_SERVER['HTTP_HOST']"."/images/footer.png"?>' />
you can include from your /include/footer.php with
dirname(__FILE__).'/images/filetoinclude'
Edit:
If you want to display images that are served by your webserver, you will have to specify either absolute path /images/images.jpg or the fully qualified path including its host as suggested above
Your problem can solve by HTML.
You must use absolute path in image source.
<img src="/images/footer.png" />
When you use slash in first of src, that mean start path from root of site.
Before going on, I'd just like to say that I've tried pretty much everything, and I read a lot of questions here at Stackoverflow, but none of the solutions worked.
So here is the deal, I have a file ("empresaConf.php") that contains this code:
<?php
include 'navigator2.php';
?>
<div class="contTudo">
<div id="bgCorpo">
<div class="empresaConf">
<?php
include 'sqEsqInc.php'
?>
</div>
</div>
<?php
include '../rodape.php';
?>
</div>
</body>
</html>
As you can see, it is including "rodape.php". The problem is that in "rodape.php", I have an image that is in another folder, so when I include "rodape.php" in "empresaConf.php", the image path should change, since PHP include consider the file path to be the one that you're including other files, making rodape.php's image broken when I access "empresaConf". I want something to fix that so I have the image no matter what file I'm in. Here is the "rodape.php" code:
<div class="empresa">
/* below in the img src tag you can see what I'm talking about */
<div class="redeSocial">
<a href="http://www.facebook.com.br">
<img src="imgs/icons/iconFace42.png" class="iconeFace">
</a>
</div>
</div> <!-- Fim div .empresa -->
The folder structure is: "rodape.php" is in the root directory and "empresaConf.php" is inside a folder named "Empresa" (I would post a img but I can't).
Thanks in advance.
EDIT:
Sorry, I forgot a crucial detail, I'm also including "rodape.php" in other files such as "index.php". So if I change the img src to correspond "empresaConf.php", then in the "index.php" the image will be broken, since it's in the root directory, same as "rodape.php".
If it's an image accessible from the public side of things, the image can probably be accessed by the directory root. So if your index.php is in /index.php where / is the web document root and your image is in /imgs/icons/iconFace42.png you can access the image by
<img src="/imgs/icons/iconFace42.png" class="iconeFace">
Note the leading slash in the src attribute.
You have some options.
If rodape.php will only be accesed from that folder level, simply change the src to ../imgs/icons/iconFace42.png, if you will be changing folder deep then use an absolute path to the image. Another way would be add php code to set the src but that would be wast of resources.
When you include ../rodape.php, think of it like just putting the code from that file directly in the position where it was included. The path string will not change, as it has not been executed until it has been included.
In short, that is to say, things will be relative to the file that's being executed, not the file(s) that's being included.
<img src="../imgs/icons/iconFace42.png" class="iconeFace"
Using that image code should resolve your issues.
I'm trying to change the default path or add a path that the webserver looks for images. I really would really like a solution to do this in PHP and not in htaccess.
The most basic example would be trying to "break" the current implementation so say I have a directory with the following:
main/
image.png
index.php
In index.php:
<?php
// Change the directory WAY out of current directory
chdir('../../../');
echo getcwd(); // DEFINITELY NOT where image.png is located
?>
<img src="image.png" width="402" height="265" alt="1">
<!-- WHY ARE YOU STILL RENDERING?!?! -->
Let me know if you understand my point or if you have any questions.
Thanks all!
Matt Mueller
I think you're confusing the current working directory on the server filesystem and the web server document root.
When you create an image element in HTML, it (the browser) looks for the source based on a few parameters.
If the src path is relative (no leading slash), the image will load relative to the <base> element URL if set, otherwise the current URI
If the src path is absolute, the image will load from the absolute path from the document root, eg <img src="/foo/bar/baz.jpg"> will load from http://example.com/foo/bar/baz.jpg
If the src is an absolute URI, then it will simply load from that
The img tag is sent to the client.
changing the directory of the preprocessor will not change the client's directory, as that is fixed to the current page they are on, such as http://example.com/.
You would need to change each img tag's src to change the directory to look in.
To avoid future confusion, you could have a function that prefixes the correct directory.
e.g.
<img src = "<?php echo produceImageURL('image.png'); ?>" width = "402" height = "265" alt = "1" />
What is the relative path for PHP and the relative path for the page are two separate things.
You changed the directory for the current PHP script. However, the requested page and it's resources are still relative to main/index.php
jnpcl had it right:
<base href="../../../">
put that between your <head> </head> typically after <meta />, before you load any files
Consider the following directory structure:
ROOT
------ images
............... logo.png
------ includes
............... vars.php
------ layout
............... content.php
------ index.php
How do I define a path constant for logo.png in vars.php that is accessible in both index.php and content.php? Should be compatible with HTML Tags as a relative path.
<img src="<?php echo IMAGE_PATH; ?>">
which should be parsed as
<img src="images/logo.png"> <!-- if used in index.php -->
and
<img src="../images/logo.png"> <!-- if used in content.php -->
New Question (EDIT): Does root-relative path work when including php files using include / require methods?
Try setting the <base> tag in the <head> section of your code.
All your images, css, and js files will use this instead of the url in the address bar.
Info on base
Absolute url or root paths will give you the least amount of headaces. Trust me, when the system grows you'll regret that setup.
It is a perfectly legal way to reference things. (as you ask in the comments)
If you're worried about setups between domains, just create a config variable with the absolute path to the domain / directory / etc
You can use "root-relative" paths. Simply link to everything with a forward slash at the beginning, i.e.
<img src="/images/logo.png">
This will resolve to http://yoursite.com/images/logo.png from every page on yoursite.com.
simply specify all paths as relative to the root
<img src="/images/logo.png"> <!-- will work anywhere -->
I'd suggest, primarily, that you use root-relative paths. This is only to reduce the complications of moving your site to another host, and also it allows for consistent paths (rather than using an if() condition to test from where the script's being run).
But otherwise, your suggestion would be fine.
I would use something like an application base URL:
define('APP_URL', 'http://example.com/path/to/app');
echo '<img src="'.APP_URL.IMAGE_PATH.'">';
Or to have it more convenient, write a function that resolves your relative URL to an absolute URL.