I have the following problem:
The URL is http://www.myhomeurl.com/application1/ and the base is:
<base href="http://www.myhomeurl.com/"/>
All resources like images, css and javascript will be at:
http://www.myhomeurl.com/css/myfile.css
http://www.myhomeurl.com/js/myscript.js
http://www.myhomeurl.com/images/img.jpg
BUT, the link will be at "application1", for example:
http://www.myhomeurl.com/application1/page1.html
http://www.myhomeurl.com/application1/page2.html
http://www.myhomeurl.com/application1/page3.html
The question is: How to apply base URL for resources (like css, js, etc) and apply the base/application1 for page links?
Here is a problem when I have:
Click me!
When the user clicks this the page will going to:
http://www.myhomeurl.com/page1.html
and not to:
http://www.myhomeurl.com/application1/page1.html
You could use a base tag and change it so all urls can be relative to the applications base.
<!DOCTYPE HTML>
<html>
<head>
<base href="http://www.myhomeurl.com/application1/" />
</head>
<body>
<!-- content -->
</body>
</html>
Additional information can be found at http://www.w3schools.com/tags/tag_base.asp
edit: w3c spec on base tag http://www.w3.org/TR/html4/struct/links.html#h-12.4 also illustrates how to pull images from other locations.
Change like this on your resources
<link href="./css/myfile.css" rel="stylesheet" type="text/css" />
Not like
<link href="http://www.myhomeurl.com/css/myfile.css" rel="stylesheet" type="text/css" />
And your base it looks like this
<base href="http://www.myhomeurl.com/application1/"/>
Use this varriable in link HTTP_SERVER
define('HTTP_SERVER', 'http://www.myhomeurl.com/application1/');
Click me!
I'm a little late for this question, but I can see none of the answers really do what (I think) you need.
I suggest you to use (as others have already said) a Base Url like this:
<base href="http://www.myhomeurl.com/application1/" />
This way your links will work in the intended way. Then, when you add resources, you only have to go up to the parent directory, like the following:
<link href="../css/myfile.css" rel="stylesheet" type="text/css" />
Or
<style type="text/css">
#import url(../css/myfile.css);
</style>
Note the ../, telling the browser to exit from "application1" directory, going up one step in the file structure.
Hope this helps :)
you should have something like this
root
root/css
root/js
root/files/html1.htm
root/files/htmml2.htm
root will be nothing but /// your website name
http://www.myhomeurl.com
Define two constant one for your css, js resources and one for links and use them across the application:-
define('RESOURCE_URL','http://www.myhomeurl.com/');
define('LINK_URL','http://www.myhomeurl.com/application1');
so that if any change in base url you can look up to these constants only.
I would start all link herd with /and the top directory of the URI. That makes them relative to the domain. Then just put the protocol and domain in the base.
when using base url you should not put www. in it.
Next if your url is mysite.com and your app is located at mysite.com/app then you set your base to be mysite.com/app when you use your example info.html it will look like mysite.com/app/info.html.
You can also use ../app/info.html and it will look like mysite.com/app/info.html
Related
<link href="/app/app.css" rel="stylesheet" type="text/css">
The above is the code I'm using to access a stylesheet, but it's not working at the .
Some extra details:
This is in a .php file, but it's located within the head of an html section
I'm working on a temporary url (i.e. 'my.ipa.dd.res/mydomain.com/dir/'). This might be the reason it's not working.
Edit:
It's a stylesheet I'd like to use on several pages, which is why I'm trying to point to a root directory (so that I don't need the file in every single folder I create).
Well I think you need to store your root directory path as a string to include your css file with an absolute URL.
Something like :
<link href="{$absoluteRootPath}/css/styles.css" rel="stylesheet" type="text/css">
If you remove the leading slash it will look for the css file in the folder relative to the current.
<link href="app/app.css" rel="stylesheet" type="text/css">
Edit: to reuse in multiple scripts in different dirs you would need to specify an absolute path, so to avoid having to change it in multiple places when you go live (ie stop using the temporary url) you should define a variable.
<?php
// set absolute path to the stylesheet
$cssPath = 'http://my.ipa.dd.res/mydomain.com/dir/';
?>
And
<link href="<?php echo $cssPath; ?>app/app.css" rel="stylesheet" type="text/css">
Depending on your php architecture you may need to define $cssPath as a global or you may be able to add it to an existing config variable. This is completely dependent on your framework.
I've been having this same problem recently. Here's what worked for me
Now on the index page, replace link rel="/app/app.css" href="stylesheet" type="text/css"
with
?php include 'style.php' ?
And on the style.php page insert the following tags:
style and /style
You can put the regular CSS between those two tags. See if that works. BTW for some reason I can't insert the greater or less than symbols without making the code disappear... Forgive me, I'm new here..
I'm using a MVC model and I can invoke webpages with URLs like http://mywebsite.com/product/productid.html. My folder structure is the following:
views - the views folder
js - the javascript and jquery folder
css - the stylesheets folder
images - the images folder
In views folder are contained web pages used to show data to the users. They can include scripts, images and stylesheets. The following snippet is incorrect
<link rel="stylesheet" href="css/style.css" media="all" type='text/css' />
since the webpage is called with the URL above, and css can't be found with a relative path. To solve the problem, I have defined a DOMAIN variable in PHP and changed the code into
<link rel="stylesheet" href="<?php echo DOMAIN;?>css/style.css" media="all" type='text/css' />
This works, but forces me to add the <?php echo DOMAIN;?> snippet to each href and src attribute on each page. Is it possible to automate it? I've tought to use the :before selector but I don't have idea how to use it in this case.
Any ideas? Thanks in advance.
:before only applies to CSS, so that's not of use here.
There's really no way to do automatically add it in PHP that wouldn't be cpu-intensive, and/or require a significantly more complex setup than it sounds like you have right now. Using find-and-replace in your code editor is the best option.
Using <?= DOMAIN; ?> instead would be shorter, BTW. (See this question for more info)
I can't seem to figure out how to add an extra "/" to the end of my website's URL without affecting the URLs that are referenced in the file.
So, I want to change the URL from
http://url.com/home
to
http://url.com/home/
without affecting the URLs that are embedded in the files.
Do you have any idea on how to do this?
Thanks,
Rob
You can use <base> tag in <head> section
<head>
<base href="http://mydomain.com/" />
</head>
With this all relative links will be prefixed with given base.
I used to create a unique header and load it in all my pages like this.
<?php
require_once('include/_header.php');
?>
<div id="main">
<!-- My Page -->
</div>
<?
require_once('include/_footer.php');
?>
In my root folder I have a folder named css where I put all my css stylesheets
in the header I call <link rel="stylesheet" href="css/style.css" type="text/css">.
Now, suppose I have to create a subfolder inside my root and I create a web page into it. When I call my stylesheets from the header, the page doesn't show correctly, because I call the stylesheet in a wrong way. How can I call my stylesheet in a way so that it can always be reachable from any position?
Here is the schema:
css
-style.css
include
-_header.php
-_footer.php
folder
-mypage.php
Use an absolute path:
<link rel="stylesheet" href="/css/style.css" type="text/css">
(Note the slash before the css directory)
Let me offer a way to debug this particular issue and other CSS reference issues in the future. Open up your page and then activate your browser's developer tools. (CTRL+SHIFT+I in Chrome).
Go to the Elements tab. Navigate the DOM until you see the CSS Entry. The URL for the stylesheet will be a clickable hyperlink. Click it. See where the browser navigates you. this should give you an indication as to what the fix is. Maybe you are too deep in the folder structure, maybe you are too shallow. In any case, I solve 99% of my CSS reference issues this way.
You should a base URL in your HTML header
<base href="http://website.com/"/>
Then everything regardless will become as follows..
<link href="css/style.css" rel="stylesheet" type="text/css">
Down the track for your menus you and simply go
Contact
Change your stylesheet href to href="/css/style.css"
<?php
// This is index.php
ob_start();
include 'tem/u.html';
ob_end_flush();
?>
<html>
<!-- This is u.html -->
<link rel="stylesheet" href="style.css" media="screen" />
<body>
<p> abc </p>
</body>
</html>
Now my problem is when i run h.html -> Ok with style.
But when i run index.php -> Ok without style (because now the index.php include style.css, not tem/style.css)
Need a fix
If possible, refer to a domain relative path to the style.css, for example
<link rel="stylesheet" href="/style.css" media="screen" />
If that is not possible, you need to keep track on the page base in some way, which I cannot tell because I do not know enough about your application. But anyway, like
<link rel="stylesheet" href="<?php echo $pageBase; ?>/style.css" media="screen" />
where $pageBase is a variable containing the url to the root of your application.
I'm assuming that the tem directory is supposed to be for some sort of template, and so you don't want it to be directly exposed to the user; rather, you want to be able to include the files so that they're accessible via index.php, possibly with the option of later changing what files are included.
You could create another PHP file called style.php (in the root directory) which would include tem/style.css. You could do this for any other files that your templates used as well — the idea being that each PHP file in the root directory would correspond to a "role" in the template, not a particular template file, so that the template could later be changed without everything needing to be rewritten.
This might get a bit cumbersome if you had a lot of files required by your template, so it might be better to have a single script that could be instructed which file to load (through a $_GET variable). But in that case, you need to be very careful not to allow the user to specify arbitrary files. I'd suggest avoiding this approach until you're more proficient in PHP.
EDIT: On second thought, I'd suggest using a <base> tag in your template HTML file, as suggested in my comment on #gnud's answer.
This has nothing to do with PHP or include. This has to do with your browser, and how URLs are interpreted.
When your browser is pointed at http://xyz.abc/tem/h.html and asked to load "style.css", it tries to load http://xyz.abc/tem/style.css - this is known as a relative url, relative to the current document location.
When your browser is at http://xyz.abc/index.php and is asked to load the stylesheet in the same way, it tries http://xyz.abc/style.css. Maybe you see the problem?
As for a solution, you might use a domain-relative path for the stylesheet ("/tem/style.css").
just always use absolute path to your css file
<link rel="stylesheet" href="/tem/style.css" media="screen" />
that's all