CODEWITHSUNDEEP
phphtmlcss
josh
josh

Reputation: 43

including css in php from header

I have a header file that is linked to a css file. When I run the header file it displays exactly as I want. I therefore know that the css and header file are working. When I include the header in my index.php the css is ignored and the header displays incorrectly.

In the header file I import the css as: 

<link rel="stylesheet" href="css/style.css">

and in index.php I import the header as: 

<?php include("header/header.php"); ?>

Any ideas what I need to do so that the css is also included so that the page will display correctly? My header.php is inside a header folder, which also includes the css folder.

Upvotes: 2

Views: 5036

Answers (5)

Birendra Gurung
Birendra Gurung

Reputation: 2233

function base_url() {
    $hostName = $_SERVER['HTTP_HOST']; 

    $protocol = strtolower(substr($_SERVER["SERVER_PROTOCOL"],0,5))=='https://'?'https://':'http://';

    return $protocol.$hostName.'/';
    //Or return $protocol.$hostName.'/ your project folder'; -> if you are working on localhost
}

Call this function to get the base url of your site.

Now for defining location of each css or other assets, you may use this function.

<link rel="stylesheet" href="<?php echo base_url(); ?>path/to/style.css">

And remember to include the file containing the function base_url() in each file where you need to use this function.

Upvotes: 0

Javi Monta&#241;ez
Javi Monta&#241;ez

Reputation: 1

there are two possible solutions.

The firts one, it is possible that in your header.php you put the link tag without echo:

<?php <link  rel = "stylesheet"  href = "css / style.css" > ¿>

The correct form is:

<?php echo "<link  rel = \"stylesheet\"  href = \"css / style.css\" > ?>

The second one, the css path is wrong. It is possible that you put the css file in the folder css, this folder is in the header folder. When you include the header.php in index.php, the browser look for css style sheet in css/style.css ,which is in the header folder, the correct path is header/css/style.css

enter image description here

You must change:

<link  rel = "stylesheet"  href = "css/style.css" >

To:

Upvotes: 0

CodeGodie
CodeGodie

Reputation: 12132

I would define a constant BASE_URL and use that in your template header as such:

Example file structure:

|--- css
|    |--- main.css
|
|--- templates
|    |--- footer.php
|    |--- header.php
|
|--- index.php

index.php

<?php
define('BASE_URL', $_SERVER['SERVER_NAME'] . "/");
include 'templates/header.php';
?>

My content

<?php
include "templates/footer.php";
?>

header.php

<!DOCTYPE html>
<html>
<head>
    <link href="<?= BASE_URL ?>css/main.css" type="text/css" rel="stylesheet">
</head>
<body>

footer.php

</body>
</html>

Upvotes: 4

David Wilkinson
David Wilkinson

Reputation: 5118

Without seeing your project tree, etc it's difficult to pinpoint exactly the issue. From your question though I gather the header.php file is loading fine, but the CSS file you're trying to load isn't.

<?php include("header/header.php"); ?>

As above, when the header.php file is loaded, the browser is looking for the style.css file in the header/css/ folder, which probably doesn't exist.

You're then within the header folder of your site. Yet I'm guessing the css folder is located at one level above? In which case, I'd bet money on you needing to go back a level as follows within your header.php file:

<link rel="stylesheet" href="../css/style.css">

If the css folder is located one level up further, you could just go up another level:

<link rel="stylesheet" href="../../css/style.css">

Failing that, you could revert back to the root level:

<link rel="stylesheet" href="/path/to/css/style.css">

Upvotes: 0

Flash
Flash

Reputation: 1125

I had the same problem and i do not know what the language makers did. If you want to use a header with css on an index.php or another file you will have to make sure that the header and that file are in the same directory and NOT the header in a subdirectory. With this you can at least work until you find a better answer

include('header.php'); //this works even with the css in it
include('header/header.php'); // this does not work when you have a css file in it

Upvotes: 0

Related Questions