1

I have the following folder structure

website 
    \styles\ 
         main.css
    \directory\
         page.php  
    \layout\ 
         background.jpg 
         common_includes.php 
    index.php 

main.css contains background-image such as

 #container  {
    background-image: url('../layout/background.jpg'); 
 }

common_includes.php contains CSS and JS files which are common to all pages.Eg:

 <link rel="stylesheet" type="text/css" href="styles/main.css" />
 <link rel="stylesheet" type="text/css" href="styles/other.css" />
 ... 

index.php

  <?php include_once '/layout/common_includes.php'; ?>

Everything perfect until here.

Now I want to have a folder with other pages (/directory/page.php).

I want page.php to use the same common_includes.php.

Obviously by doing:

  <?php include_once '../layout/common_includes.php'; ?>

doesn't work due to a different Working Directory.

I tried duplicating common_includes.php to have correct paths:

common_includes_directory.php

<link rel="stylesheet" type="text/css" href="../styles/main.css" />
<link rel="stylesheet" type="text/css" href="../styles/other.css" />
...

THen I got into the problem that the background.jpg in the CSS cannot be found.

How can I achieve this without having to duplicate everything?

Dan Dinu
  • 32,492
  • 24
  • 78
  • 114

1 Answers1

1

Use absolute path(relative to root)

<link rel="stylesheet" type="text/css" href="/styles/main.css" />
<link rel="stylesheet" type="text/css" href="/styles/other.css" />

In css use

#container  {
    background-image: url('/layout/background.jpg'); 
 }

Any path which starts with "/" is relative to root and it remains same wherever you use it. For more details read Having links relative to root?

Community
  • 1
  • 1
Rehan Haider
  • 893
  • 11
  • 26
  • open page in chrome then open console to check which link is not working. It may have 404 error. inspect it and show results so I could help you accordingly. – Rehan Haider Mar 12 '16 at 19:20