Relative paths from subdomain - HTML - html

This seems like a simple question but it's baffling me. Let's say my domain is:
bar.com and my subdomain is foo.bar.com.
If I'm on foo.bar.com/1/2 and I go back a directory through a link with a relative path (href="../") it will take me to foo.bar.com, not foo.bar.com/1 as I'd expect it to. Why is this? How do I get to foo.bar.com/1 with a relative path?
Side question: If foo.bar.com is masking another directory (let's say bar.com/foo, and I go to href="/", will that take me to the root of the entire domain (bar.com) or just to the root of the subdomain (foo.bar.com)?

If the current page is http://foo.bar.com/1/2, browser thinks 2 is a document under the directory 1. So if you have ../, it goes to its parent directory, which is the root directory. If you want to link to http://foo.bar.com/1/, you can use href=./.
I don't quite understand your side question. Generally if the URL displayed in browser is bar.com/foo, then href="/" takes users to bar.com/; if the URL displayed in browser is foo.bar.com/, then href="/" takes users to foo.bar.com/

Related

Image not found altough right relative path is specified

My website on my server does not want to show the on server saved image.
The path is relative and to my information correct, but I always get a 404 error.
Found no solution after browsing endlessly.
All nessecary information is found in the second picture posted.
Apparently, you use a Framework. The file you have in the view folder isn't the one you send to the browser, it's just a source file that will be used by your Framework entry point: public/index.php. Your root folder is therefore public.
Two things must then be understood:
Even though the line your type is in application/view/index/index.php, the browser will only see it as index.php, located at the base of your site (http://localhost/index.php or somethig like that). The relative path must therefore be written as relative to public.
As your root folder, public, is seen as http://localhost by the browser, you can't use .., there is nothing above the root of your website, for the browser. You must do one of the followings:
Place your image in public/_images instead of application/_images (normally, all the files that can be sent without passing by the PHP preprocessor can go in public)
Place it wherever you want and create a controller that maps a custom URL to your image. Something like /images/(:any) maps to a controller looking into your specific image folder (please, don't, it's not because you can that you should).
My advice: create a public/img folder and place it your images, then you load it with <img src="/img/title_image_me.jpeg" alt="My picture">. (The initial / is very important there!, it's understood as the root folder of your website, Linux-style).

How do I specify an absolute path?

I wrote this code, but I couldn't get the html. I don't know why. I want to know why this is when the route is not wrong.
<img id = "navLogo" src = "C:/Bitnami/wampstack-7.1.27-0/apache2/htdocs/TermProject/imgs/navLogo.jpg"></img>
For security reasons, websites may not request arbitrary files from your machine's filesystem.
Keep in mind that the way this works is the HTML is sent to the browser and then the browser sends a second request for the image.
In this case the browser would be trying to get the file off of your machine, (which may coincidentally be where the web server happens to be running), but if this site were live on the web and someone else accessed it, their browser would be trying to get this image from that user's machine, not from the website.
If the browser was allowed to serve files from your local filesystem, one could very easily create a site to grab files off of your machine and transmit them elsewhere, creating a MASSIVE security problem.
To fix this you should specify a path relative to the web server's root, which would probably mean:
<img src="/imgs/navLogo.jpg" />
or maybe:
<img src="/TermProject/imgs/navLogo.jpg" />
Note that behavior will be different if you're loading the HTML file from the filesystem (the location is file:…) vs. serving it from a web server (location is http://…). I'm assuming you're doing the former here based on the fact that your image is under an apache directory.
Ray Hatfield's answer is good but I don't have enough rep to comment.
I think you are misunderstanding absolute vs relative paths here.
You are thinking of absolute as starting with your c: drive, but on a web server, the absolute path starts at the root of your site, which is always just a forward slash "/".
Relative paths begin from the current directory of the source file(s) that specify them.
Neither of them can go higher in the file system than your site's root folder.
To put it simply (specifically answering "How do I specify an absolute path?"):
All absolute paths on the web start with a /
All relative paths on the web do not.
Given the path in your example:
C:/Bitnami/wampstack-7.1.27-0/apache2/htdocs/TermProject/imgs/navLogo.jpg
A default apache installation considers the site root to be the "htdocs" in this path.
This means that the absolute path / on your website is found at C:/Bitnami/wampstack-7.1.27-0/apache2/htdocs/ on your hard drive.
If you have a file C:/Bitnami/wampstack-7.1.27-0/apache2/htdocs/TermProject/index.html then you can access the navLogo image from that page
with an absolute path at:
/TermProject/imgs/navLogo.jpg
or a relative path at (note the missing forward slash):
imgs/navLogo.jpg
I believe the source you specify should have path starting from folder where your html is located. So, try something like this "/imgs/navLogo.jpg".

Do I need slashes before links?

When I code my website, on my local computer i can use
blablabla.
However, I also can see this type of thing on other places as
blablabla.
I am not sure what I will need when my site goes live. If I try to do this on my local computer, it doesn't understand it. My question is, if I post my site up like this, will it work?
Ok, if I have all of the files of my site in the root directory that the main index.html file is located in, will it work when it is being hosted?
If you do not use a slash, the link will point to index.html in the same folder as the page the link is on.
For example, if you have a link to index.html on the page www.example.com/page2.html then the link will take you to www.example.com/index.html. If you include a slash, it will do the same thing.
However, if the link is in a page in a subfolder, like www.example.com/projects/page2.html, then the first link will take you to www.example.com/projects/index.html while the second link will still take you to www.example.com/index.html.
The slash denotes the "web root."
Note that these are still considered "relative" links: they refer to a resource on the same server, regardless of the server's name. If your domain name changes or you upload it to another server, relative links will still work provided they have the same folder structure.

Using HTML relative addresses in masterpage

In my project I have a master page and 2 pages using that master page. One of them is beside the master page in the root folder, and another is inside 'admin' folder in the root.
The problem is when I use an image in my master page with relative address for example 'images/pic.jpg', it is displayed in first page but not in second page.
I can solve this problem by addressing from root folder like this: '/images/pic.jpg' but this is not a good idea, as may be my project folder will change in the future.
What should I do for this purpose?
Relative addresses will work only if the folder schema remains the same. Masquad's solution presumes the same...that the file will remain in a folder 1 level below the root and on the same level as the image folder.
If this is not the case, and you change the schema, an absolute address is needed, thereby making 'http://www.example.com/images/pic.jpg' a good idea.

Base URL for HTML and CSS

I got a question and although I could find related information, I'm if it was exactly about what I'm wondering about.
The thing is, I got a site on http://localhost/site.
Now, when I create a link, let's say, <a href="/posts">, it links to http://localhost/posts instead of http://localhost/site/posts.
It works fine if I remove the slash (<a href="posts">), that would be the closest and maybe the easiest solution, but I'd like to know why the links ignore the folder where the file is at?
And I also would like to know if this can be fixed with .htaccess or something.
I've read that a link that begins with / makes it "absolute". So a link beginning with / is only intended to be used to link directly to the root, or to be used by sites stored at the root (in this case it wouldn't make much sense?) ?
The leading '/' at the start of the URL informs the web browser that the path given is absolute (with respect to the web server root), i.e. if you link to /posts then you know that the resulting link will be to http://www.mysite.com/posts.
If you don't supply the leading '/' (and you don't give a complete url like http://www.mysite.com/posts) then usually the url is relative, and any page given will be relatvie to the page currently being viewed.
For example:
page being viewed link url target page
------------------------------------------------------------------------------
www.mysite.com/site link.html www.mysite.com/site/link.html
www.mysite.com/site ../link.html www.mysite.com/link.html
www.mysite.com/some/other/page link.html www.mysite.com/some/other/page/link.html
www.mysite.com/some/other/page ../../../link.html www.mysite.com/link.html
The decision on whether to use absolute or relative links is entirely up to you - the advantage of relative links is that if your site moves, links between pages on your site will still work correctly (for example if your site moves to www.mysite.com/otherpath, then any absolute links such www.mysite.com/originalpath/home will no longer work.
You should see the following site for a more complete explanation of relative urls:
Relative URLs (WebReference.com)
Your site root is localhost although you assume that site is your site root. When you use / it is relative to localhost as it is an absolute link.
Try doing it < a href="../posts" >
./ Means base directory, or home
../ Means one directory up