I have embedded my CSS file as PHP to make it more dynamic as shown in various examples online but I can't seem to get it working
<link rel='stylesheet' href='myphpstylesheet.php'>
My PHP file which I added in the link
<?php
$bgcolor = '#FF00FF';
?>
<style>
Div #container {
Background-color: <?php echo $bgcolor ; ?>
}
</style>
My HTML file
<html>
<head>
<link rel='stylesheet' href='myphpstylesheet.php'>
</head>
<body>
<div id="container ">
I am a div with lorem ipusum
</div>
</body>
</html>
But the color does not apply please help
I did some search on embedding css as php file,
I don't really see the reason for this just use css as intended.
Anyway you can try these methods hope it fixes you problem also take note of herf and hrefas pointed out by Riggs Folly as they are not the same.
METHOD 1
You can edit your httpd.conf or .htaccess with this line
AddType application/x-httpd-php .css
the web server will now parse PHP code that is within the CSS files but i would
avoid messing with those at all costs.
METHOD 2
You can also include a PHP file, in the same manner as you include a CSS file
<link rel="stylesheet" href="style.php" media="screen">
this should be done within the head of the HTML document that is the <head></head> tags
Then your style.php file should look something like this:
<?php
header("Content-type: text/css; charset: UTF-8");
$brandColor = "#990000";
$linkColor = "#555555";
$CDNURL = "http://cdn.blahblah.net";
?>
Then your css file should look somthing like this:
#header {
background: url("<?php echo $CDNURL; ?>/images/header-bg.png") no-repeat;
}
a {
color: <?php echo $linkColor; ?>;
}
ul li a {
color: <?php echo $linkColor; ?>;
}
You should use PHP's include command to inject the external PHP:
<?php include 'myphpstylesheet.php'; ?>
Inside that PHP file, you have a missing PHP closing tag, and the CSS needs to be declared properly within <style> tags:
<?php
$bgcolor = '#FF00FF';
?>
<style>
div #container {
background-color: <?php echo $bgcolor ; ?>
}
</style>
There's many ways to have dynamic control over CSS.
If you wanted to maintain the method, and truly feed it a dynamic PHP file, you have to make sure the PHP output is ONLY css. Here's an article on that.
Related
It's possible to define a main color and a secondary color (hex-codes) in my application, those are saved to the db.
The secondary color for example is used for links. I don't want to say Text but instead <a href="#" class=secColor>Text</a> where .secColor has something like
.secColor {
color: $fromDatabase;
}
I'm using Laravel btw.
You can include a .php file as a css by using following code:
index.html:
<!DOCTYPE HTML>
<html>
<head>
<link rel="stylesheet" href="style.php">
</head>
<body>
<!-- stuff goes here -->
</body>
</html>
style.php:
<?php
header("Content-type: text/css");
?>
//DB Query
.secColor{
color: <?php echo $fromDatabase;?>
}
You can do this:
Create new route rule:
Route::get('style/generate.css', function ($id) {
// take your color
$data['firstColor']= Colors::where('alias', '=', 'firstColor')->get();
...
return View::make('css.colors', $data)
});
And create new view in resources/views/css/colors:
.firstColor{
color: $colors['firstColor'];
}
And in your main views
I use this method for create js custom file
So I have some PHP stuff inside my html doc, and I'm fairly new to web stuff so I'm kinda confused. The code in question is:
<style type="text/css">
body{
background: url(<?php include 'background.php';
echo "$selectedBg"; ?>) no-repeat center center fixed;
background: url(images/1.png)
background-size: cover;
}
</style>
The rest of the file works seamlessly, I've tried putting that little bit in all sorts of different tags, and even changing the file to a php file instead of an html one. I've verified that php is installed and my path is correct. background.php exists in the same directory as seen here, this and this are the sites I referenced when creating it. The only other info I can think to provide is that I'm viewing it through the live preview in Brackets.
Changing the file to a php file fixed it. The whole file now looks like.
<html>
<?php include 'background.php';?>
<title>Yay</title>
<head>
<link rel="stylesheet" type="text/css" href="main.css">
<style type="text/css">
body {
background: url(<?php echo $wall;?>);
}
</style>
</head>
<body>
</body>
</html>
where background.php is
<?php
$bg = array('1.png', '2.png', '3.png', '4.png', '5.png', '6.png', '7.png', '8.png');
$i = rand(0, count($bg)-1);
$selected = "$bg[$i]";
$wall = "images/$selected";
?>
I have a css file named test.css and I want to use into it of $var.$var is at test.php. test.css is attached in test.php. My structure is something like this:
//test.php
<html>
<head>
<?php $var = 'anything';?>
<link href="test.css" rel="stylesheet" type="text/css" />
</head>
<body></body>
</html>
and this is test.css:
// test.css
.<?php echo $var> { // css property }
Currently test.css does not work. In fact, I want to knoe how can I use of a php variable as a class name into a css file ?
Actually you can.
1st Solution
Instead of using the .css file extension, use .php
Set up variables
<?php
header("Content-type: text/css; charset: UTF-8"); //look carefully to this line
$brandColor = "#990000";
$linkColor = "#555555";
?>
Use variables
#header {
background: url("<?php echo $CDNURL; ?>/images/header-bg.png") no-repeat;
}
a {
color: <?php echo $linkColor; ?>;
}
...
ul#main-nav li a {
color: <?php echo $linkColor; ?>;
}
2nd and short solution
Create a file and name it like style.php, then in your style.php set your styles in tags like below
style.php
<style>
.blabla{
....
}
#heeeHoo{
...
}
</style>
then include style.php to your file (test.php) like
<html>
<head>
<?php include 'style.php'; ?>
</head>
<body>
</body>
</html>
That is the correct answer. Think like inline css but that is actually in external file
You can use <style> in the PHP file.
//test.php
<html>
<head>
<?php $var = 'anything';?>
</head>
<body>
<style>
<?php echo $var; ?>
</style>
</body>
</html>
The style can also be put in the <head>.
I'm actually working on a PHP project using MVC structure, including DOCTYPE & HEAD tag via a single file during an output buffering using ob°start().
The problem comes when i wanna declare a min-height property for may page container, in order to stick the footer at the bottem of the page. ob_start() -- ob_get_clean() use seems to forbid browsers to access these properties in time so they can't evaluate height value.
This is my index.php file:
<?php
include_once('global/init.php');
ob_start();
if(isset($_GET['module'])){
$module = dirname(__FILE__).'/modules/'.htmlspecialchars($_GET['module']).'/';
$action = (isset($_GET['action'])) ? htmlspecialchars($_GET['action']).'.php' : 'index.php';
if(!file_exists($module.$action)){
include('global/home.php');
}else{
include($module.$action);
}
}else{
include('global/home.php');
}
$content = ob_get_clean();
include_once('global/header.php');
echo $content;
include_once('global/footer.php');
the header.php file contains the doctype, and the first basics of html:
<html>
<head>
<meta charset='UTF-8' />
<title><?php echo "LiveSession".' '.DOMAIN_INFOS;?></title>
<meta name='description' content='<?php echo $_SESSION['currentDesc'];?>' />
<meta name='keywords' content='<?php echo $_SESSION['currentKWds'];?>' />
<link rel='stylesheet' media='screen and (max-width:480px)' href='css/smartphones.css' />
<!-- TABLETS -->
<script type='text/javascript' src='scripts/jquery.1.7.js'></script>
<script type='text/javascript' src='scripts/poll_edit.js'></script>
<script type='text/javascript' src='scripts/smartphones.js'></script>
</head>
<body>
<div id='page'>
<div id='header'>
<h1><a href='index.php'>InteractivePollSession</a></h1>
<?php
if(is_connected_user()){
echo "<span id='disconnector'><a href='index.php?module=members&action=dscnx' title='disconnect'>Disconnect</a></span>";
}
?>
</div>
<div id='contentWrap'>
the footer:
</div>
<div id='footer'>
<span id='central-footer'>© <a href='http://www.jsteitgen.com'>JSTeitgen</a></span>
</div>
</div>
</body>
And a basic css exemple:
body{height:100%;}
#page{min-height:100%; position:relative;}
#footer{position:absolute; bottom:0; width:100%;}
Does any one know how to fix this using ob_start() ?
Of course, every other CSS rules work fine except this ...
Thank's
JS
The ob_start() is not the problem. The problem is only a html/css problem. You can only use a height in percentage if the parent of the element has a fixed height.
In your case, #page parent is body and the body's height is 100%, so you can't use a height in percentage for #page. But you can try this for example :
body{height: 1000px;}
#page{min-height:100%; position:relative;}
#footer{position:absolute; bottom:0; width:100%;}
I think the problem is with the css; you are setting the body element's height to 100% of its parent, the html element, which does not necessarily have a height of 100%.
You should be able to solve your problem using:
html, body {
height: 100%;
}
1) database
2) php
3) css
4) html form
The user enters some properties for example background: red in the html form and it saves in the db, then php loades from the db the color option in background css... and then how can I put php variable in the css properties...
also some hostings does not allow to add handlers in .htaccess, is there other options?
Yes, it is possible.
You can serve a css file with php by setting the content-type.
<?php header('content-type: text/css; charset=utf-8'); ?>
You would output the css from the php file.
You could store values in a mySQL or other table with a form, and later retrieve them with the mySQLi or other library.
This is an example of the php script:
<?
header('content-type: text/css; charset=utf-8');
$bgColor = "#FFF"; // Get it from database, I'm setting manually for this example
?>
body{
background-color:<?php echo "$bgColor" ?>;
}
Alternatively, you could output inline css on the page. Either directly in to a tag, or inline on elements.
If really needed a native css file for some reason (I can't think of one), you could technically overwrite a specific css file using php's fwrite() function, though I wouldn't recommend doing it this way.
<?php
$filename = "phpstyle.css";
$fp = fopen($filename, 'w');
$bgcolor = "#FFF";
$css = "body{";
$css .= "background-color:".$bgcolor.";";
$css .= "}";
fwrite($fp, $css);
fclose($fp);
?>
Yes you can serve a css through php script.
One method is to output style elements through php.
<?php
#css on php file
$color = '#FFFFFF';
?>
<html>
<head>
<title>Css through php</title>
<style>
.test{
text-color: <?php echo $color; ?>
}
</style>
</head>
<body>
<p class="test">Your body </p>
</body>
</html>
Another method is to generate css dynamically in a php file and linking it on an html page.
<?php
#css on php file [test_css.php]
header("Content-type: text/css");
$color = '#FFFFFF';
?>
.test{
text-color: <?php echo $color; ?>
}
<html>
<!-- test.html -->
<head>
<title>Css through php</title>
<link rel="stylesheet" type="text/css" href="test_css.php">
</head>
<body>
<p class="test">Your body </p>
</body>
</html>
In addition to Khaleel's answer, you can put CSS in the HTML document itself, in a
<style>
...
</style>
section. You can use PHP variables to fill this in.
Or you can use inline styles in the HTML
<span style="...">...</span>
Why not just:
<?php if (myCondition) { ?>
<style>.myClass {
background: <?php echo $myColor; ?> !important;
} </style>
<?php } ?>
The myCondition triggers the insertion of in body styling. The !important tag overwrites all other existing value of that property.
Simple to understand and easy to use. Works every time.
ether create a css file using php dynamically, such as:
<link href="../styles/styles.php" type="text/css" />
or use php to write the css inline on your html file:
<html>
<head>
<style type="text/css">
body {
background-color: <?php echo $redcolor; ?>;
}
</style>
</head>
<body></body>
</html>
however, you cannot create a standard css file with php.