I want to use LESS, but it is doesn't work at my localhost.
Here is my index.php
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv="content-type" content="text/html; utf-8">
<link rel="stylesheet/less" type="text/css" href="styles.less">
<script src="less.js" type="text/javascript"></script>
</head>
<body>
</body>
</html>
and here is my styles.less
#nice-blue: #5B83AD;
body{
backgroud-color: #nice-blue;
}
You shouldn't be using your less files directly in your HTML. Less is a CSS pre-processor, and needs to be compiled in order to be read by your browser.
Follow the examples here (http://lesscss.org/) on how to compile your LESS file so that you can use the CSS.
Related
In base.php
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Base</title>
<style>
body {
background: blue;
}
</style>
</head>
<body>
<h1>Base</h1>
</body>
</html>
the background of <body> is blue.
But if the CSS is linked, like
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Base</title>
<link rel="stylesheet" href="http://localhost/exp/mysite/css/style.css" type="text/css">
</head>
<body>
<h1>Base</h1>
</body>
</html>
with CSS in http://localhost/exp/mysite/css/style.css
body {
background: blue;
}
it doesn't work. Why?
Can you check error and write text of error for your post? To do that, open Developer Tools, reload page, and when style.css will be red, copy and paste code of Error and text of answer from the server.
I think here may be few common problems:
localhost follows to your computer/server, but web server (Apache / Nginx) doesn't know where your link (http://localhost) should follows. I mean to which directory where css file located.
Second common problem is permissions. For example directory with your CSS or css file has not readable permissions.
There can be few more problems, like CSP or something more complicated, but i need more information from you.
Try to use a relative filepath, this will also make the transfer to a production server easier:
<link rel="stylesheet" href="css/style.css" type="text/css">
instead of
<link rel="stylesheet" href="http://localhost/exp/mysite/css/style.css" type="text/css">
(of course it depends where your html or php document is placed in the file system – if that's in a folder, it will be something like href="../css/style.css"
You should link the css this way
<link rel="stylesheet" href="css/style.css" type="text/css">
or link the css file the exact folder name
Set your folder is:
mysite/index.html
mysite/css/style.css
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Base</title>
<link rel="stylesheet" href="css/style.css" type="text/css">
</head>
<body>
<h1>Base</h1>
</body>
</html>
The problem was
SetHandler application/x-httpd-php
in the .htaccess file.
I have a small problem.
On some of my pages I cannot make favicon to be shown.
On some pages everything is fine, and favicon is shown properly, however on other sites I cannot make the favicon to appear. I tried putting the ico file in the main directory, but without any results.
This file1.php is working fine:
<? include("core/config.php"); ?>
<!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" />
<link href="include/style.css" rel="stylesheet" type="text/css">
<title>Title</title>
<link rel="shortcut icon" type="image/x-icon" href="img/flavico.fw.ico">
<script type="text/javascript" src="include/script.js"></script>
</head>
However on this one favicon is not showing:
<?php include("core/config.php");
include("include/resolution.php");
function new_function($nazwa){
global $wys;
global $db;
$wys->some_function($ub,$na,$ub_pod);
}
?>
<!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>title</title>
<link rel="shortcut icon" type="image/x-icon" href="img/flavico.fw.ico">
<link href="include/style.css" rel="stylesheet" type="text/css">
</head>
I assume that this problem is caused by php functions, right?
Please show urls for both pages.
Guess your problem in relative urls. Assume that first url was http://mysite.org/file1.php and second was http://mysite.org/subsecrion/file2.php
then you should either use absolute path for favicon:
<link rel="shortcut icon" type="image/x-icon" href="/img/flavico.fw.ico">
or add tag:
<base href="http://mysite.org/">
I have a website that uses a global header.inc file, containing the header I want on top of every HTML page:
<!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-Language" content="de-at" />
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<link rel="stylesheet" type="text/css" href="standard.css.php" />
...etc...
Hence, the pages themselves look like this:
<?php include "header.inc"; ?>
<title>Page Title</title>
<style type="text/css">
/* additional style sheets for only this page */
</style>
</head>
<body>
...
Obviously, Expression Web complains about the unopened </head> tag and ignores the stuff present in the header file (e.g., the stylesheet), which makes the preview pane rather useless.
Since EW4 is supposed to "work nicely" with PHP, is there some way to make the preview pane honor includes? I've told EW where it can find the php-cgi.exe, so in the browser preview everything works nicely.
I have a php based website. As in, all of the pages html is output via php.
Here is a simple example:
<?php
ob_start();
$pageStart = '
<!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>MY WEBSITE PAGE</title>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
What i would like to do is make use of some jquery in this page.
So naturally my first attempt was to include the script inside of the php variable like so:
<?php
ob_start();
$pageStart = '
<!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>Untitled Document</title>
<script type="text/javascript">
var datefield=document.createElement("input")
datefield.setAttribute("type", "date")
if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
}
</script>
<script type="text/javascript">
if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
jQuery(function($){ //on document.ready
$('#birthday').datepicker();
})
}
</script>
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
Now, I use dreamweavers code editor, which due to the syntax highlighting feature, will point out the masses of syntax errors produced in this.
So i at first attempted to slash out these errors. This failed.
So i tried changing the "s to 's, and visa versa, until the errors were gone. This failed too as it seems the script will not validate in this manner.
So i read a few tutorials, and found this one:
JavaScript and PHP may each bring great potential to any Web development effort, but they don't always play nice together. Read about the problems.
And the way I understand it, is that you'd need to include the js rather than have it as part of your php directly.
So have a file called page.php and another called jquery.php. So I decided to try and modify this idea to suite my problem.
So i started with something like this - index.php:
<?php
ob_start();
$pageStart = '
<!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>MY WEBSITE PAGE</title>
'. include $_SERVER['DOCUMENT_ROOT'] . '/../../path/to/include/datepicker.php'.'
</head>
<body>
<p>CONTENT</p>
</body>
</html>
';
echo $pageStart;
exit;
?>
And - datepicker.php:
<script language="Javascript">
var datefield=document.createElement("input")
datefield.setAttribute("type", "date")
if (datefield.type!="date"){ //if browser doesn't support input type="date", load files for jQuery UI Date Picker
document.write('<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"><\/script>\n')
document.write('<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8/jquery-ui.min.js"><\/script>\n')
}
</script>
<script language="Javascript">
if (datefield.type!="date"){ //if browser doesn't support input type="date", initialize date picker widget:
jQuery(function($){ //on document.ready
$('#birthday').datepicker();
})
}
</script>
Now there are no syntax errors in either page, great... So I try it, half expecting things to finally just work...
Nope... Fatal Error: failed to open stream: No such file or directory blah blah. This error relates to the include that i added. So okay, even though the file is there, it is not being validated as php because there are no opening and closing php tags.
So I add them... Annnd... A page full of syntax errors again!
So my question is this:
Could some please share some knowledge and explain to me roughly how this process actually works. Whats the deal with all the syntax errors, and how are you supposed to go about a task like this?
I believe it is possible, and yes it would ceratinly be easier if i was not outputting the entire html via php. But this is a simple example and my actual design is alot more complex. It requires for the different parts of the page to be broken up into variables, in order to place those bits and peices when needed, dynamically.
Any input, suggestions, or insight would be greatly appreciated; and any links to pages or tutorials that cover this would also be greatly appreciated.
Thank You!!
All you need to do to use jQuery with PHP is to include the jQuery javascript file in your HTML document in the head tag. I actually use PHP along with jQuery all the time. And this is how I do it. In your code above, it looks like you have some escaping issues with your code. And it also looks like you want to hold the header of the page in a PHP variable then print it out. You don't have to do all that. Just put the plain text in your PHP file without any php tags and it will work. Also, you are using an old version of jQuery. Should probably use the latest version. But, if you need it stored in a PHP variable so that you can print it out, do this:
SO, here is some code to get you started.
<?php
$pageStart = '<!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>MY WEBSITE PAGE</title>
<link href="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/themes/base/jquery-ui.css" rel="stylesheet" type="text/css" />
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.17/jquery-ui.min.js"></script>
<script type="text/javascript">
$(document).ready(function(e) {
$("#date").datepicker();
});
</script>
</head>
<body>
<input type="text" id="date" name="date" />
</body>
</html>';
print $pageStart;
?>
<head>
<script type="text/javascript"
src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function() {
// javascript & jquery code
// even better would be if you would put client code in separate file!!!
});
</script>
</head>
<body>
<?php
echo "bla bla bla";
?>
</body>
and +1111 to # Heera's comment
You're missing the basics's.
Use Heredoc. Thousands of syntax errors will be gone.
See the heredoc version of your pages,
http://pastie.org/3412925
http://pastie.org/3412929
http://pastie.org/3412935 // Here you have used include to contact. include does not return anything. It just includes. So Its changed differently.
I think it should be
. (include ($_SERVER['DOCUMENT_ROOT'] . '/../../path/to/include/datepicker.php')) .
otherwise php will try to include all the stuff after until the l is reached (tags will be interpreted as part of the file name).
also, in terms of the php code, after the file is included (on success), the include statement translates into 1 as a number, instead of the content of the file.
use
<? $abc <<<qwerty
...
...
...
qwerty;
return qwerty;
?>
for all the files that you want to include
I wrote a small MVC app for a small website I am working on. I created a load method that loads the header, footer, and the specified view file. I am having issues to where the header is not loading all of the JS files and the entire document's HTML structure is missing indents.
Header.php:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title><?php echo $meta['title']; ?></title>
<?php //load all of the css files
foreach (glob("layout/css/*.css") as $css_filename)
{
echo '<link rel="stylesheet" href="'.INSTALL_PATH.'/'.$css_filename.'">';
}
//load all of the js files
foreach (glob("layout/js/*.js") as $js_filename)
{
echo '<script src="'.INSTALL_PATH.'/'.$js_filename.'"></script>';
}
?>
</head>
<body>
Renders as:
<!DOCTYPE html>
<html lang=en>
<head>
<meta charset=utf-8>
<title>Test Title</title>
<link rel=stylesheet href="/labs/wpsm/layout/css/style.css"><script></script></head>
<body>
One weird thing that I discovered is that if I include random text before the doctype declaration, everything is back to normal.
With extra character:
s
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Test Title</title>
<link rel="stylesheet" href="/labs/wpsm/layout/css/style.css"><script src="/labs/wpsm/layout/js/test.js"></script></head>
<body>
What am I missing here? I checked the character encoding of the page and it is utf-8. Any help or pointers would be awesome!
Just figured it out as I was messing around with the server. I discovered that it had mod_pagespeed enabled, I disabled the mod_pagespeed module (Google Page Speed for Apache) and it fixed the indenting and the JS file starting working. The module was automatically removing the JS file because it was a blank file I had put into the directory just to make sure the PHP was pulling the files properly. Thank you everyone for the help and I hope this helps someone save a few fistfuls of hair.