I have two DIVs which are floating side by side correctly but after embedding the php code as below, the whole page will not show anything. Even When I remove the php code, the page will not show again. The code below is for the div that floats right.
<div style="float:right;">
<?php
echo "<div>
<head>
<link rel='stylesheet' type='text/css' href='chatbox/style/cb_style.css'>
<script type='text/javascript' src='chatbox/ajax.js'></script>
<script type='text/javascript' src='chatbox/chatbox.js'></script>
</head>
<div>";
?>
<div id="container">
<div id="usersOnLine">
<div style="font-weight:bold;margin-top:35%;">Online Users</div>
<div style="height:82%;">
<?php
if (!empty($friends)) {
foreach ($friends as $friend) {
$friend_name = htmlentities($user['username'], ENT_NOQUOTES);
echo "<span>{$friend_name}</span>";
}
}
?>
</div>
<form method="post" action="">
<input type='text' placeholder='search' style='width:145px;'/><a href='#'><span class='glyphicon glyphicon-search'></span></a>
</form>
</div>
<div id="chat_search">
<un>
</div>
</div>
</div>
<div style="clear:both;"></div>
Since you are adding a <head> element into the DOM, you should remove that surrounding div and head and place that first chunk of php code inside your page's <head> section. The browser is getting confused when you introduce a new <head> element that way.
EDIT: to explain further, with a possible example...
You can add those new stylesheet and js entries into your head by appending them to your header include (assuming you are using an include for your main html header - in this example, we call it "header.php", since that's common)
<?php
$addme = '<link rel="stylesheet" type="text/css" href="chatbox/style/cb_style.css">
<script type="text/javascript" src="chatbox/ajax.js"></script>
<script type="text/javascript" src="chatbox/chatbox.js"></script></head>';
ob_start(); // start a buffer
include("header.php");
$contents = ob_get_contents(); // buffer the contents of header.php
ob_end_clean(); // end & clean the buffer
// replace the closing tag with the added stuff
echo str_replace('</head>', $addme, $contents);
?>
Related
I'm having trouble with creating some sort of indicator on a webpage.
This should show me if something is turned on or off.
My project concerns on making a "automatic" terrarium controller, with sensors, relays and a raspberry. I'm able to show the sensor readings on a website, updating every minute (using jQuery).
At certain times, some relays are activated (which still has to be done, relay arrived today) and I want to see on the site if relay 1 is activated or not and again, updated automatically when this changes. The program to activate some relays is in python, and will also write a txt-file, containing a "0" or a "1" (for "off" and "on").
Then, using for instance a switch (e.g. switch) which should show the state of the relay, according to the txt file.
But, I don't seem to get it working.
Using PHP If and Else statements, ends up showing both even when using simple images as "indicators" of the relay.
<?php
$myfile = fopen("./statusUV.txt", "r") or die("Unable to open file!");
$status= fread($myfile);
if ($status == 1){
print ('<img src=./images/on.png />');
}
else{
print ('<img src=./images/on.png />');
}
But, how can different div's been shown, in case of this switch?
Oh, and I have to say, I'm new to PHP, HTML, Python, jQuery etc.
The "button" doesn't have to be clickable, it just have to show the state of the relay (or the output in the file).
If more information is needed, please, let me know!
Thanks in advance!
<!DOCTYPE HTML>
<html>
<head>
<title>UV</title>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<link href='http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,700' rel='stylesheet' type='text/css'>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<script src="js/skel.min.js"></script>
<script src="js/skel-panels.min.js"></script>
<script src="js/init.js"></script>
<noscript>
<link rel="stylesheet" href="css/skel-noscript.css" />
<link rel="stylesheet" href="css/style.css" />
<link rel="stylesheet" href="css/style-desktop.css" />
</noscript>
<?php
$myfile = fopen("./statusUV.txt", "r") or die("Unable to open file!");
$status= fread($myfile);
fclose($myfile);
switch(intval($status)){
case 0 : $img = "<img src='./images/off.png' />"; break;
default : $img = "<img src='./images/on.png' />";break;
}
?>
</head>
<body class="left-sidebar">
<!-- Wrapper -->
<div id="wrapper">
<!-- Header -->
<div id="header">
<div class="container">
<!-- Nav -->
<nav id="nav">
<ul>
<li class="active">Data</li>
<li>UV timer</li>
<li>Heat Timer</li>
<li>Led Timer</li>
<li>Sproeier Timer</li>
<li>Apparaten</li>
</ul>
</nav>
</div>
<div id="logo-wrapper">
<div class="container">
<!-- Logo -->
<div id="logo">
<h1>Timer<span class="tagline"> voor Sproeier</span></h1>
</div>
</div>
</div>
</div>
<!-- /Header -->
<!-- Main -->
<div id="main-wrapper">
<div class="divider"> </div>
<div id="main">
<div class="container">
<div class="row">
<div id="sidebar" class="4u">
<?php
if (isset($img)){
echo $img;
echo $status;
}?>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="divider"> </div>
<!-- /Wrapper -->
<div id="copyright">
<div class="container">
<p style="font-size:11px">Design: TEMPLATED Images: Unsplash (CC0)</p>
</div>
</div>
</body>
</html>
Assume the var $status = 1 or 0 in the text file.
Your code must be like that :
<html>
<head>
<?php
$myfile = fopen("./statusUV.txt", "r") or die("Unable to open file!");
$status = fread($myfile);
fclose($myfile);
switch(intval($status)){
case 1 : $img = "<img src='./images/on.png' />"; break;
default : $img = "<img src='./images/off.png' />"; break;
}
?>
</head>
<body>
<?php
if (isset($img)){
echo $img;
}?>
</body>
</html>
Some PHP-problems has been solved by reseting the server. Apparently that would fix the strange code appearing on the site.
Now, after testing various things, it appears that $status remains empty. After trying various techniques, I found that fgets($myfile) would do the trick, instead of the fread($myfile)! Thanks everyone for helping!
regarding working control flow if the page has 2 html tags
<html>
.....
</html>
<html>
.....
</html>
WHICH WOULD BE EXECUTED BOTH OR THE ONLY FIRST ONE....
I am working on a cs50 project in which when i call
<?php
dump($_SERVER);
render("login_form.php", ["title" => "Log In"]);
?>
only dumps get executed whereas when
<?php
render("login_form.php", ["title" => "Log In"]);
dump($_SERVER);
?>
both gets executed
the details of dump and render function are..
function render($template, $values = [])
{
// if template exists, render it
if (file_exists("../templates/$template"))
{
// extract variables into local scope
extract($values);
// render header
require("../templates/header.php");
// render template
require("../templates/$template");
// render footer
require("../templates/footer.php");
}
// else err
else
{
trigger_error("Invalid template: $template", E_USER_ERROR);
}
}
function dump
function dump($variable)
{
require("../templates/dump.php");
exit;
}
the templates file are
dump.php
<!DOCTYPE html>
<html>
<head>
<title>dump</title>
</head>
similar are header.php
<!DOCTYPE html>
<head>
<link href="/css/bootstrap.min.css" rel="stylesheet"/>
<link href="/css/bootstrap-theme.min.css" rel="stylesheet"/>
<link href="/css/styles.css" rel="stylesheet"/>
<?php if (isset($title)): ?>
<title>Mobi3: <?= htmlspecialchars($title) ?></title>
<?php else: ?>
<title>Mobi3</title>
<?php endif ?>
<script src="/js/jquery-1.10.2.min.js"></script>
<script src="/js/bootstrap.min.js"></script>
<script src="/js/scripts.js"></script>
</head>
<body>
<div class="container">
<div id="top">
<img alt="C$50 Finance" src="/img/logo.gif"/>
</div>
<div id="middle">
<body>
<pre><?php print_r($variable); ?></pre>
</body>
footer.php
<div id="bottom">
Copyright © M3shop
</div>
</div>
</body>
If the answer is "having two sets of html tags" you are asking the wrong question. Regardless on which one is shown (which can also vary from browser to browser).
I am trying to create a very simple web application, basically to understand the best practices of coding in HTML5, CSS and JavaScript.
My application has 3-4 pages and each one is using same menu header. So I want to make it reusable by writing it in a separate file (either PHP or HTML).
head.php (it is to be made reusable):
<!DOCTYPE html>
<html>
<head>
<link href="../../css/headermenu.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<ul id="menu">
<li>Home<span></span></li>
</ul>
<p>
</p>
</body>
</html>
front.php:
<?php
include ("$_SERVER[DOCUMENT_ROOT]/page/common/head.php");
?>
HTML markup (dirty code):
<!DOCTYPE html>
<html>
<head>
<!DOCTYPE html>
<html>
<head>
<link href="../../css/headermenu.css" rel="stylesheet" type="text/css"/>
</head>
<body>
<ul id="menu">
<li>Home<span></span></li>
</ul>
<p>
</p>
</body>
</html></head>
<body>
<div>
</div>
<p>
</p>
</body>
</html>
I have following questions:
head.php has both <body> and <head> tag. So where should I write these PHP lines to include it? (in <head> or <body>) (I don't want to have multiple <head>s and <body>s in the final page)
What are the other best practice I should follow? (any link to references welcome)
I have already read w3schools.
In my opinion it would be a good idea to read about templating systems or have a look how frameworks/CMS handle this.
Doing it your way, you can't completly avoid repeating e.g. the closing head tag </head> in every content.php.
So this is just an idea:
head.php
<?php
// Some other includes / requires,
// code snippets...
?>
<!DOCTYPE html>
<html>
<head>
<!-- site-wide stylesheets -->
<!-- & js-files -->
<link href="css/main.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="my/global/scripts.js"></script>
content.php
<?php
include ($_SERVER['DOCUMENT_ROOT'] . '/page/common/head.php');
?>
<!-- put page specific scripts &
<!-- styles here -->
<link href="my/pages/css/style.css" rel="stylesheet" type="text/css"/>
<script type="text/javascript" src="my/pages/js/scripts.js"></script>
</head>
<body>
<div id="container">
<!-- content start -->
<div id="content">
<h1>title</h1>
<p>Your content</p>
</div>
<!-- end of content div -->
<?php
include ($_SERVER['DOCUMENT_ROOT'] . '/page/common/foot.php');
foot.php
<div id="foot">
copyright etc
</div>
</div> <!-- end of container div -->
</body>
</html>
php is rendering html and if you have in both files header of course it will be printed twice
you should separate in includes but don't write in both files tag
example
<header>
<?php
// this file should not include <head> taf
include ($_SERVER[DOCUMENT_ROOT] . '/page/common/header.php);
?>
</header>
BODY
<header>
<?php
include ($_SERVER[DOCUMENT_ROOT] . '/page/common/foot.php);
?>
</header>
include will bring content from head.php and foot.php and will put in index.php file
Another possible solution to avoid multiple head tags which also makes it possible to add additional css files:
<?php
// head.php
$html = <<< EOF
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
<head>
<title>{$title}</title>
{$meta}
<link href="../../css/headermenu.css" rel="stylesheet" type="text/css"/>
{$additional_style}
</head>
<body>
<ul id="menu">
<li>Home<span></span></li>
</ul>
{$mainbody}
{$footer}
{$javascript}
</body>
</html>
EOF;
?>
<?php
// page1.php
$title = 'some title';
$meta = '';
$additional_style = '';
$mainbody = 'your body';
$footer = '';
$javascript = '';
include_once("head.php");
echo $html;
?>
<?php
// page2.php
$title = 'some other title';
$meta = '';
$additional_style = '<link href="../../css/page2.css" rel="stylesheet" type="text/css"/>';
$mainbody = 'your body';
$footer = '';
$javascript = '';
include_once("head.php");
echo $html;
?>
It also allows for multiple levels of inheritance (for example, you could define the same footer for a couple of pages). This principle can also be used without EOF, but I think that it looks nicer this way.
The main downside is that you will get a warning if you do not set all the variables of head.php in the pages including it.
If anyone can think of a better title, please let me know.
Right now I'm using a technique from this tutorial to get the width and height of the user's viewing window. It works, but only on the index.php page. I'm using a php based css file.
In the php based css file, everything would normally work fine, except that the first line at the top *$width_div_center = $GET['width']0.8; thinks the width is in string form. (Or something like that.) As a result, the $width_div_center variable is set to zero which causes a lot of issues. What am I doing wrong, or how can I get the php based css file to do a multiplication on *$GET['width']0.8 properly? Thank you for your assistance.
<html>
<head>
<title>Taylor Love</title>
<!--
<link rel="stylesheet" media="only screen and (color)" href="main.css" />
<link rel="stylesheet" href="main.css"/>
-->
<link rel="stylesheet" type="text/css" href="css/style.php" />
<?php
$content = "null";
include_once('content.php');
?>
</head>
<body class="body">
<!-- top header -->
<div class="div-center decorated-white">
<div class="header-background">
<div style="margin:10px;">
<font color="#AAA" >
hello, universe!
<?php
echo $_GET['width'] *.8;
echo "<h1>Screen Resolution:</h1>";
echo "Width : ".$_GET['width']."<br>";
echo "Height : ".$_GET['height']."<br>";
?>
</font>
</div>
</div>
</div><!-- div-center-->
<div class="div-center" style="margin-top:10px;">
<?php
include('sidenav.php');
?>
<div id="div-content" class = "decorated-white">
<?php echo $content; ?>
</div><!-- div-content-->
</div><!-- div-center-->
<div class="clear"></div>
<!-- top header
<div class="div-center decorated-white" style="margin-top:10px">
<?php
for ($i = 0; $i < 5; $i++){
echo "</br>";
}
?>
</div>-->
</body>
</html>
////////////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////////////
I appear to be having issues separating two different pages of code.
You seem to be calling style.php without any $_GET parameters.
The $_GET parameters you use in index.php are not automatically passed to the style.php. script.
Try temporary hard-coding the 'width' parameter to see if it makes any difference
<link rel="stylesheet" type="text/css" href="css/style.php?width=100" />
This is because the request for the stylesheet is a separate GET request which has no idea about the referrer's get parameters.
this is probably because $_GET variables are usually strings. That is probably the cause of your problem. You could use the function floatval() to convert it to a float.
The first line should be $width_div_center = floatval($_GET['width'])*0.8;
Hello friends a newbie question...
The Issue is like this:
I have a static HTML file and I want to import just a portion of that file into another page. How can I do that.
Example Code:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Some title here</title>
<link rel="stylesheet" type="text/css" href="styles.css" />
</head>
<body>
<div id="box-1">
<div class="block">
<!-- Some code here -->
</div>
</div>
<div id="box-2">
<div class="block">
<!-- Some code here -->
</div>
</div>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script src="script.js"></script>
</body>
</html>
Now what I want is to read this HTML file and import just this bit:
<div id="box-1">
<div class="block">
<!-- Some code here -->
</div>
</div>
Is there a way of doing it?
Kindly help.
Even a PHP, jQuery, Ajax or any other solution will also do. Please help me.
You can use jQuery's load() to specify only a certain container to be loaded:
$('#targetdiv').load('static.html #box-1');
Here's a solution that differs from the others: It performs a one-time import of a section of content from a large number of static html files/pages (in case that was what you were wanting). I used it successfully to import about 700 pages from straight html to a cms database.
// get the pages you want to import
$pages = array('page1.html',
'page2.html',
'page3.html'
);
foreach($pages as $p) {
$url = 'http://yourDomain.com/' . $p;
// load the webpage
$file = file_get_contents($url);
if($file) {
list($before,$content) = explode('<body>',$file); // chop off beginning
unset($before);
list($content) = explode('<div id="box-2">',$content); // chop off end;
$resultArray[] = trim($content);
// or do it this way to keep the filename associated with the content
// $resultArray[$p] = $content;
}//if file
} //endforeach;
// $resultArray holds your stripped content
// do something with $resultArray;