Jeff
Jeff

Reputation: 410

How to load CSS in specific page in php

I want to have dynamic header.php in all of my website pages, and there are many CSS files for loading. is there any way to load different CSS files for each page ? for example:

<?php if($title == "title") { ?>
<link   href="mycss.css" >
<script src="test.js"></script>
<?php } ?> 

Upvotes: 0

Views: 2982

Answers (6)

Igor Pavlenko
Igor Pavlenko

Reputation: 707

This worked for me just fine, I added it to the _header.php file which is included on on all my pages:

<?php
  $page_name =  $_SERVER['PHP_SELF'];
  if($page_name =='/recepiepg/admin/index.php'){
    echo '<link rel="stylesheet" href="../css/admin.css" type="text/css"/>';
  }

?>

Upvotes: 0

Rasclatt
Rasclatt

Reputation: 12505

You can create a function (or class) to echo your header and feed parameters as settings. Something like this may work:

function.get_header.php

// This function will render the header
function get_header($settings = false)
    {
        ob_start();
        include("header.php");
        $data = ob_get_contents();
        ob_end_clean();
        return $data;
    }

function.get_page_css.php

// This function will act like a pseudo database return
// and will return a series of css links based on input
function get_page_css($var = false)
    {
        $css['title'][] = "/css/style1.css";
        $css['other'][] = "/css/style2.css";
        $css['title'][] = "/css/style3.css";

        if(!empty($css[$var]))
            return $css[$var];
    }

header.php

<!DOCTYPE html>
<html>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width">
<title><?php echo (!empty($settings['title']))? $settings['title'] : "Untitled Page"; ?></title>
<head>
<?php if(!empty($settings['css']) && is_array($settings['css'])) {
    foreach($settings['css'] as $link) {
?>
<link type="text/css" rel="stylesheet" href="<?php echo $link; ?>" />
<?php  }
    }
?>
</head>

index.php

<?php
// Include the header function
include("function.get_header.php");
// Include the css return function
include("function.get_page_css.php");
// Write the header to browser using the get_page_css() function
echo get_header(array("title"=>"This Great Page!","css"=>get_page_css('title')));
?>
<body>...etc.

Upvotes: 2

Rizky
Rizky

Reputation: 414

Put this index.php file in your css folder

<?
    $title = $_GET['title'];
    header('Content-Type: text/css');
    switch ( $title ) {
        case 'title_1':
            include('style_1.css');
        case 'title_2':
            include('style_2.css');
        default:
            include('default.css');
    }
    exit();
?>

Then whenever you want to call your css :

<?
    echo '<link href="path/to/css/folder/?title='.$variable.'" rel="stylesheet">'
?>

The index.php in the css folder will be controller for css needs to be included

Upvotes: 1

Dilip kumar
Dilip kumar

Reputation: 176

In a simple way, you can used this method which is given below...

<?PHP
    $page_name=  $_SERVER['PHP_SELF'];
    if($page_name=='about.php'){
      echo '<link href="about_css.css" type="text/css">
        <script src="about_test.js"></script>';
}

if($page_name=='contact.php'){
      echo '<link href="contact_css.css" type="text/css">
        <script src="contact_test.js"></script>';
}
?>

Upvotes: 2

Siddhartha esunuri
Siddhartha esunuri

Reputation: 1144

first check this url path

   <?php 
    $url = 'http://' . $_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'];
      ?>

or

 <?php 
    $url = 'http://' . $_SERVER['SERVER_NAME'] . $_SERVER['REQUEST_URI'];

    $url1 = "http://example.com/home";
    $url2 = "http://example.com/about";
    if (strpos($url1,'home') !== false) { ?>
       <link   href="mycss.css" >
    <?php
    } else if(strpos($url2,'about') !== false){ ?>
         <link   href="mycss2.css" >
    <?php }else {   ?>
    // your defult css file
    <?php } ?>

I hope you understood

Upvotes: 1

Thamilhan
Thamilhan

Reputation: 13313

For simplicity, you can assign a page code for every page. Create the script with that name. So you can import it like this:

In the page header:

$pageCode = "INDEX";

in the footer:

<?php
$scriptFileName = "your/path/to/file/".$pageCode.".js";
if(file_exists($scriptFileName)){
  echo "<script src='$scriptFileName'></script>";
}

apply the same for CSS if needed. But in header!

Upvotes: 0

Related Questions