Today, I’m explaining what is Absolute Path and Relative Path? where to use Absolute path and Relative Path and How to include root level any file (or folder file) with theme folder file by using relative path in WordPress.
Absolute Path :
Absolute world explain what is it. it is full path of any file that are Images, Css, Jasvascript file or any else.
Ie, http://www.domain.com/css/styales.css is absolute Path
Relative Path :
instead of giving a full location of file that we want to include, use related path according to folder directory structure. like,
/css/style.css Or ../../images/icon/fb.gif
If the path to CSS (or any file for that matter) leads off with the / that means go to the root and begin look there.
A single DOT in front of the slash means look in current directory, and two dots means go up one level and look there.
Example :
style.css belong to CSS folder at root.
Now, if I’m currently accessing url http://www.domain.com/posts/2013/11/20/myPost
the include relative path of style.css is: css/style.css – it will try to find the css folder under myPost, which doesn’t exist, and not load the css file.
If I have ../css/style.css, it will attempt to go to the css folder under the 20 folder, again it doesn’t exist.
If the path is: /css/stle.css then it will go all the way up the tree to my root and find the css folder (which does exist) and then load the css from there – which it will do successfully.
Note: its also happens with images, javascript or any other file.
Summary :
Here, Three different path types to point to the css file ( say, style.css) located in the css folder at root directory, assuming we’re linking from a file (say, index.php) in side the wp folder.
Root Relative (best method): /css/styles.css
In this case: start at the root, then go forward to the css folder.
Document Relative: ../css/styles.css
In this case: go up one level from the wp folder, which brings us back to the root folder, then go forward to the css folder.
Absolute: http://www.mysite.com/css/styles.css
TAGS :
– Webrupee css not working in mozila if use css path are absolute path.
– In WP, Inlcude root level any file (or folder file) with theme folder file by using “/” root relative path instead of “./” or “../” or “../../” document relative file.