Using includes and stylesheets for a specific page? - php

I was about to use includes for my websites, setting up includes for
the header, footer, nav, etc. In the header I added the DOCTYPE to the end of the </head> tag.
If I do it this way, how would I add a stylesheet just for one specific page if the head of the page is in a include?


well there are alot of various ways to do this one would in the included header php file
add an variable
like so
<?=#$css;?>
and then in the file that includes it define the css variable to whatever you want to be included
$css = 'something';
include(header.php);
if this is your header.php
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<?=#$css;?>
</head>
and this is your index.php
$css= '<link href="style.css" rel="stylesheet" type="text/css" />';
include('header.php');


You could use php on the header page to detect what page the user is on, and display the relevant stylesheet.
<?php
$page = $_SERVER["REQUEST_URI"];
$clean = array("/", ".php");
$page = str_replace($clean, "", $page);
echo "
<link href=css/$page.css media=screen rel=stylesheet type=text/css />";
?>
If you are on index.php, then this script will include index.css, main.php will include main.css, etc.

Related

how to load different css for different pages?

I am trying to create different style sheet for my pages.
I have a set header file
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<link href="/includes/main.css" rel="stylesheet" media="all"/>
</head>
<body>
then I have my main body page, I will have main.html, project.html, contact.html …etc
//php load different pages for my body
<div>….
and a footer page.
<footer>…
My question is how to swap the css file to adapt different pages for my main body page. The header and footer files are the template and I don't want to change the css file every time I load a new page. How do I accomplish this? Thanks a lot!

One simple way of doing it is by using a php function called "basename".
If you have 3 pages main.php, project.php and contact.php, you can load different resources depending upon the name of the page you are viewing.
For example
echo ;
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<?php if(basename($_SERVER['PHP_SELF']) == 'main.php'){ ?>
<link href="/includes/main.css" rel="stylesheet" media="all"/>
<?php }
elseif(basename($_SERVER['PHP_SELF']) == 'project.php'){
?>
<link href="/includes/project.css" rel="stylesheet" media="all"/>
<?php } ?>
</head>
<body>

How do I set base URL for all pages of my website?

How do I set a base URL for my website and get it to include in every page?
Is there a way for me to easily change a variable to be the base url for the website, such as <?php $baseurl = "http://www.website.com/website/"; ?>, and include this on every page so that all CSS, JavaScript, images and PHP includes follow this $baseurl?

You can’t make both PHP and client-side assets use the same base URL, unless you use PHP to echo a base URL variable or constant to the page.
The usual approach is to have a bootstrap file that you include on every page, and define your base URL and other site-wide variables in there.
bootstrap.php:
<?php
define('BASE_URL', 'http://example.com');
index.php:
<?php
include('bootstrap.php');
?>
<!DOCTYPE html>
<html>
<head>
<!-- // -->
<link rel="stylesheet" href="<?php echo BASE_URL; ?>/css/styles.css" />
</head>
<body>
<!-- // -->
</body>
</html>

You may want to take a look at the html base tag.
Inside the <head> section of your html, put
<base href="http://www.website.com/website/">
On top of that, you may want to have a base.php with default directories and whatnot that you include into your project.

(xampp), the
How do I use on the local computer.
folder layout,
http://www.resimagaci.com/img/90rvnrf.png
ust.php
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<title></title>
<meta name="description" content="">
<meta name="viewport" content="width=device-width">
</head>
<body>
alt.php
</body>
</html>
sabitler.php
<?php
#sabitler
define('BASE_URL', 'base-url');
?>
index.php
<?php
include 'kutuphane/sabitler.php';
?>
<?php
$ust= BASE_URL . '/kutuphane/ust.php';
$alt= BASE_URL . '/kutuphane/alt.php';
?>
<?php
include ($ust);
?>
<?php
include ($alt);
?>

Include a js and css file only in a specific view

In my CodeIgniter application have a common header and footer view, which I include in different views. My header_view is as simple as:
<!DOCTYPE html>
<html lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title><?php echo $page_title;?></title>
<link rel="stylesheet" href="<?php echo base_url();?>/css/master.css" type="text/css" media="screen" />
<script src="<?php echo base_url();?>js/common.js" type="text/javascript"></script>
</head>
<body>
<!-- end of header -->
Now Lets suppose I have another view called form_view, where I would like to include a CSS file form.css and a javascript file form.js. Since these files are only used in form_view, I don't want to add them in the header_view, because then they will be included in all of the views in my application.
So my question remains, how can I include a specific css or a specific javascript file on a specific view, when using a common header like above.
Thanks.

You could write something like Zend_Bootstrap and run it before views. The bootstrap file will be responsible for setting css and js files so your header will just grab them from an array.
Bootstrap:
$head_array = array(
'css' => array(
'/static/css/style.css',
'/static/css/style1.css'
),
'js' => array(
'/static/js/script.js'
)
)
if($view == 'view_form') {
$head_array['css'][] = '/static/css/form.css';
}
Of course this example is very primitive but it shows the idea.

How to import/include a CSS file using PHP code and not HTML code?

I have googled a lot but it seems that I am doing something wrong.
I want to do this:
<?php
include 'header.php';
include'CSS/main.css';
...
?>
However, my page prints the CSS code.
Note: I want to use PHP to include the CSS file, and not use
I also do you want to rename my CSS file to a PHP file as some website mentioned.
Any clues?
Many thanks.

You have to surround the CSS with a <style> tag:
<?php include 'header.php'; ?>
<style>
<?php include 'CSS/main.css'; ?>
</style>
...
PHP include works fine with .css ending too. In this way you can even use PHP in your CSS file. That can be really helpful to organize e.g. colors as variables.

You are including the CSS code as text in your PHP page. Why not just link it in the traditional fashion?
<link rel="stylesheet" href="CSS/main.css" type="text/css">

you can use:
<?php
$css = file_get_contents('CSS/main.css');
echo $css;
?>
and assuming that css file doesn't have it already, wrap the above in:
<style type="text/css">
...
</style>

To use "include" to include CSS, you have to tell PHP you're using CSS code. Add this to your header of your CSS file and make it main.php (or styles.css, or whatever):
header("Content-type: text/css; charset: UTF-8");
This might help with some user's connections, but it theoretically (read: I haven't tested it) adds processor overhead to your server and according to Steve Souder, because your computer can download multiple files at once, using include could be slower. If you have your CSS split into a dozen files, maybe it would be faster?
Steve's blog post: http://www.stevesouders.com/blog/2009/04/09/dont-use-import/
Source: http://css-tricks.com/css-variables-with-php/

<?php
define('CSSPATH', 'template/css/'); //define css path
$cssItem = 'style.css'; //css item to display
?>
<html>
<head>
<title>Including css</title>
<link rel="stylesheet" href="<?php echo (CSSPATH . "$cssItem"); ?>" type="text/css">
</head>
<body>
...
...
</body>
</html>
YOUR CSS ITEM IS INCLUDED

This is an older post, however as the info is still relevant today an additional option may help others.
Define a constant for the file path per Stefan's answer. The
definition can be placed at the top of the PHP page itself, or within
an included/required external file such as config.php.
(http://php.net/manual/en/function.include.php)
Echo the constant in PHP tags, then add the filename directly after.
That's it!
Works for other linked files such as JavaScript as well.
<?php
define('CSS_PATH', 'template/css/'); //define CSS path
define('JS_PATH', 'template/js/'); //define JavaScript path
?>
<!-- Doctype should be declared, even in PHP file -->
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="<?php echo CSS_PATH; ?>main.css">
<script type="text/javascript" src="<?php echo JS_PATH; ?>main.js"></script>
</head>
<body>
</body>
</html>

If you want to import a CSS file like that, just give the file itself a .php extension and import it anyway. It will work just fine :)

You can also do the following:
Create a php file in includes folder, name it bootstrap_css.php for example
paste the css code files to file created above
<?php
$minCss=' <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">';
$business = '<link href="bootstrap/css/modern-business.css" rel="stylesheet">';
echo $minCss;
echo $business;
?>
in the html header, include the css files as follows
<?php include_once 'includes/bootstrap_css.php'; ?>

You could do this
<?php include("Includes/styles.inc"); ?>
And then in this include file, have a link to the your css file(s).

I don't know why you would need this but to do this, you could edit your css file:-
<style type="text/css">
body{
...;
...;
}
</style>
You have just added here and saved it as main.php. You can continue with main.css but it is better as .php since it does not remain a css file after you do that edit
Then edit your HTML file like this. NOTE: Make the include statement inside the tag
<html>
<head>
<title>Sample</title>
<?php inculde('css/main.css');>
</head>
<body>
...
...
</body>
</html>

I solved a similar problem by enveloping all css instructions in a php echo and then saving it as a php file (ofcourse starting and ending the file with the php tags), and then included the php file.
This was a necessity as a redirect followed (header ("somefilename.php")) and no html code is allowed before a redirect.

Just put
echo "<link rel='stylesheet' type='text/css' href='CSS/main.css'>";
inside the php code, then your style is incuded. Worked for me, I tried.

This is the format of what I have which works:
<head>
<title>Site Title</title>
<?php include 'header.php'; ?>
</head>
Inside my header.php I have:
<!doctype html>
<html class="no-js" lang="en">
<meta name="viewport" content="width=device-width, initial-scale=1">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="shortcut icon" type="image/png" href="assets/images/icon/favicon.ico">
<link rel="stylesheet" href="assets/css/bootstrap.min.css">

The file name must be something other than a .CSS index. Write the following:
<link rel="stylesheet" href="style.css" type="text/css" />

The best way to do it is:
Step 1:
Rename your main.css to main.php
Step 2: in your main.php add
<style> ... </style>
Step 3: include it as usual
<?php include 'main.php'; ?>
That is how i did it, and it works smoothly..

_trace its directory, I guess
echo css('lib/datatables_rqs/jquery.dataTables.css');

js and css on-demand loading

i am confused by the concept of on-demand loading
I saw this blog post and was wondering if I could do the same with php using the ff. approach:
check current url
serve css or js based on current url
which may be done like this in Kohana
if (uri::segment(1) == 'search') // check current url
echo html::stylesheet('search.css'); // serve stylesheet
echo html::script('search.js'); // serve script
endif;
or am I getting the idea wrong?
a side question would be is ti alright to have a css file for each individual page aside from the site-wide forms.css and layout.css

you can use your approach. css files are better served in the head and so you can put your conditions in the site wide template.
for javascript, which should be served at the bottom of your html, you can simply put your tags directly in your application/view/your_action.php without using any url based condition.
about
would be is ti alright to have a css
file for each individual page aside
from the site-wide forms.css and
layout.css
well, you can do it but keep in mind that this will generate an extra request (for the css files) for every new page visited by the user. if performance is critical you'd better serve a unique compressed css.

Here is an example for HTML and PHP using REQUEST_URI. the variable will hold the page you're at, you might want to do some parsing of it to get the exact page with out slashes etc, it's usually a relative path to the document from the root.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Demo</title>
<?php
switch($_SERVER['REQUEST_URI']) {
case "/home.php":
echo '<link type="text/css" href="home.css" rel="stylesheet" />';
echo '<script type="text/javascript" src="js/home.js"></script>';
break;
case "/about.php":
echo '<link type="text/css" href="about.css" rel="stylesheet" />';
echo '<script type="text/javascript" src="js/about.js"></script>';
break;
case "/contact.php":
echo '<link type="text/css" href="contact.css" rel="stylesheet" />';
echo '<script type="text/javascript" src="js/contact.js"></script>';
break;
default :
echo '<link type="text/css" href="default.css" rel="stylesheet" />';
echo '<script type="text/javascript" src="js/default.js"></script>';
break;
}
?>
</head>
<body>
My Page
</body>
</html>

Categories