I've read and heard it is really sensible to separate your PHP and HTML tags as much as possible. Now my question is how should I do that? I couldn't really find the answer so I decided to ask you.
I was thinking about to use the POST function.
Check out my code:
<div class="aftelklok rondenSB">
<a href="?page=agenda">
<?php
// countdown function
// parameters: (year, month, day, hour, minute, seconds)
countdown(2013,2,24,18,0,0);
function countdown($year, $month, $day, $hour, $minute, $seconds)
{
// make a unix timestamp for the given date
$the_countdown_date = mktime($hour, $minute, $seconds, $month, $day, $year, -1);
// get current unix timestamp
$today = time();
$difference = $the_countdown_date - $today;
if ($difference < 0) $difference = 0;
$days_left = floor($difference/60/60/24);
$hours_left = floor(($difference - $days_left*60*60*24)/60/60);
$minutes_left = floor(($difference - $days_left*60*60*24 - $hours_left*60*60)/60);
$seconds_left = floor($difference - $days_left*60*60*24 - $hours_left*60*60 - $minutes_left*60);
if($difference > 0){ echo "Nog ".$days_left." dagen ".$hours_left." uur .$minutes_left." minuten tot de dienst"; }
else{ echo "De vorige dienst is afgelopen."; }
}
?>
</a>
</div>
So what i want is just the echo but then have all the php code not in my div but above the html code. like:
<?php ..... ?>
<html>
<body>
echo
</body>
</html>
As pemeon said, Smarty is quite a smart (pun intended) approach for that.
If you want to learn more about the backgrounds, you might want to google for "Model-View-Controller in php" or something like that. Basically, it's about separating your view (all the presentation stuff, e.g. HTML) from your code logic (controller) and your data objects / sources (model).
Smarty is nice but you'll need a bit of learning time to figure out how the template engine is designed, how to use it and how to apply it to your specific challenges.
If you don't want such a big solution at the moment and want to start a bit smaller and easier, you could write your own very simple template "engine" around the functions file_get_contents(...) and str_ireplace. The idea looks like this: You put your HTML stuff in template-files (for example *.html or *.tpl file ending) that don't contain any php code but place holders for dynamically created content:
Example: main-layout.tpl
<html>
<head><title>${Title}</title></head>
<body>
<img src="yourfancylogo.png" alt="Header logo"><br>
Here some navigation | ... | ... <br>
${Content}
<hr>
<div id="footer">© 2013 John Doe - Contact us</div>
</body>
</html>
Example: welcome.tpl
<h1>Hello, ${Username}! Nice to see you!</h1>
<p>So your username is ${Username}? Then you might want to read our terms of service before starting to use our app:</p>
<pre>${TOS}</pre>
Example: tos-document.txt
1) An apple a day keeps the doctor away!
2) No Smoking!
3) ...
In your php script you do something like this:
<?php
$template = file_get_contents('main-layout.tpl');
if (isset($_GET['requestedpage'])) {
// Parameter given!
$requestedPage = $_GET['requestedpage'];
} else {
// No page parameter. Assume "home".
$requestedPage = "home";
}
$username = "Monty"; // get from session data
if ($requestedPage == 'home') {
// -- begin handler code for page "home" --
$title = "Start Page - Welcome";
$content = file_get_contents('welcome.tpl');
$tos = file_get_contents('tos-document.txt');
$content = str_ireplace('${TOS}', $tos, $content);
// -- end handler code for page "home" --
} else if ($requestedPage == 'aboutus') {
...
} else {
$title = "Page Not Found - Error";
$content = file_get_contents('error404.tpl');
$content = str_ireplace('${PageThatWasNotFound}', htmlentities($requestedPage), $content);
}
$output = str_ireplace('${Content}', $content, $template);
$output = str_ireplace('${Title}', htmlentities($title), $output);
$output = str_ireplace('${Username}', htmlentities($username), $output);
die($output);
?>
Using such a separation of the template and the data to insert, you can later modify your layout / template without having to touch your php scripts. For example, if you want to modify your header or footer shown on all pages, you have a single point of change as you can modularly assemble your site from several template-bricks.
To keep the php source above readable, while your source is becoming larger, you can put all the handler codes into separated php files. You'd include them by include or require into your main source file.
But watch out: You have to escape all placeholder values that might come from user inputs - regardless, if you get them from a database or directly from $_GET or $_POST (-> XSS vulnerabilities). All input is evil!
You cannot use a php function or variable outside of a PHP block. However, it is possible to store a value in a php variable then use it in a tiny PHP block.
For example:
<?php
// ...
$foo = 42;
// ...
?>
Then
<html><body>
<p>Answer is <?php echo $foo; ?></p>
</body></html>
or
<html><body>
<p>Answer is <?= $foo; ?></p>
</body></html>
You could put your php in a separate file, and then use include or require.
do_stuff.php:
<?php
// some calculations
echo "stuff";
?>
Then in your html...
index.php:
<html>
<body>
<?php include 'do_stuff.php'; ?>
</body>
</html>
About include
The best way is to use some template engine like smarty or twig. If you do not have time to learn you can for now just write code at the top and when you want to use some calculations in i.e you use .
<?php
// calculations
$foo = 'foo';
?>
<html>
<body>
<div><?=$foo?></div>
</body>
</html>
And when you start to use this kind of 'separation' (php code in the top of the file) and html at the bottom and you will use this shortcut version of the echo function, you will easily transform into using template system.
The goal should not be keeping php away from html code, the goal should be keeping business logic from presentation logic. One of the ways to do this is utilising a Model-View-Controller layout, or you could use one of many other paradigms. The main point of this approach is making changing one part independent of the other: imagine creating a separate mobile or json front end, that does all the exact same logic, but outputs it completely differently. If the business logic and presentation logic are completely entangled, you will have a hard time, probably needing to both reproduce or blatantly copy code, as well as creating two different branches that need to be kept in-sync, making maintaining it a nightmare.
I`m using right now this sort of frame, its sort of like the frame MrSnurb made, but then in HTML in stead of php. what do you think about this framework guys?
<?php
if(isset($_GET['page'])) {
$page = $_GET['page'];
}else{
$page = "home";
}
?>
<!DOCTYPE html>
<html>
<head>
<title> Younited - <?php echo $page; ?></title>
<meta charset="utf-8">
<link rel="stylesheet" type="text/css" href="css/style.css">
<script src="http://code.jquery.com/jquery-latest.min.js"></script>
<script src="js/slides.min.jquery.js"></script>
</head>
<body>
<div class="container ronden">
<?php
include "partials/header.php";
include "partials/menu.php";
?>
<div class="content">
<?php
if (file_exists("partials/pages/".$page.".php")) {
include "partials/pages/".$page.".php";
}
else{ echo "<p>De pagina <b>".$page."</b> bestaat niet.</p>";
}
include "partials/sidebar.php";
?>
</div>
</div>
<?php
include "partials/footer.php";
?>
</body>
</html>
Use some template engine like smarty. To create template of your html code and push there varibles.
Related
I'am really very new to PHP.
I have this code:
<?php cms_loop('500');?>
<div class="item">
<p class="contents"></p>
</div>
<?php cms_loop_end('500');?>
I want to output everything between cms_loop and cms_loop_end functions.
I do it this way:
function cms_loop($id){
ob_start();
echo ob_get_contents();
}
and
function cms_loop_end(){
ob_end_flush();
}
But that's not working. Any help appreciated
Below you can find the working code:
<?php
/**
* Start buffering
* #param $id
*/
function cms_loop($id){
ob_start();
}
/**
* Output everything buffered
*/
function cms_loop_end(){
ob_end_flush();
}
?>
<?php cms_loop('500');?>
<div class="item">
<p class="contents">Hello from buffered content</p>
</div>
<?php cms_loop_end('500');?>
Please note that I removed the echo ob_get_contents(); from your cms_loop() function.
Demo: https://onecompiler.com/php/3wuscawt7
(There is an option to run without account)
I'm assuming you're trying to achieve some kind of template rendering as you apparently trying to render some piece of HTML for later use. For that to happen, PHP needs to be aware of that piece. In your example, though, both PHP and HTML co-exist side by side without either side having any knowledge about the other. Your HTML isn't part of PHP's realm yet.
Let's change that.
The piece of HTML you've given is often called a partial, i.e. something that's meant to be part of something bigger. Like a sidebar being a conceptual part of an index.html file, but not a physical one unless included:
<!DOCTYPE html>
<html>
<head>
</head>
<body>
<h1>Welcome!</h1>
<!-- Partial -->
<?php include_once('sidebar.html') ?>
</body>
</html>
So let's take a similar approach and factor out the HTML into its own file first:
<div class="item">
<p class="contents"></p>
</div>
partial.html.php
Now we need to find a way to transfer this piece of HTML into the realm of PHP. The simplest approach would be to read it and assign it to a variable:
$html = file_get_contents('partial.html.php');
Let's get back to your function for a second, because now you could do:
function cms_loop($html){
echo $html;
}
I have taken $id off of the list of the function's parameters, mostly because of the following reasons:
you don't read nor write to a database yet
if you did, this would be the wrong place
you don't use any variables in your template, so there's no need to pass any in
Though let's ponder the last one a bit. Wouldn't it be nice if we could pass data into our template, for example to dynamically change the classes we have assigned to both HTML elements?
It would most definitely be nice, and it's possible, too - what we need for that is just a little bit of output buffering. But first, let's change our template to meet our new needs:
<div class="<?php echo $class_outer ?>">
<p class="<?php echo $class_inner ?>"></p>
</div>
So we'll have to define both values up front. But we might end up with a lot more template variables once we get the hang of it, so let's best use an array as a container to store our current and any future values:
$data = [
'class_outer' => 'item',
'class_inner' => 'contents',
];
Next, we'll need some function to render our template with the values we just defined, so it'll need two parameters: The path to the template file and our data array. Also, we want it to return our rendered template. That said, it'll probably look like this:
function render(string $template_path, array $data): string {
if (!is_file($template_path)) {
return false; // Or some better error handling
}
// Let's have some sugar in our templates: Import all indexes
// of our data array as variables into the current scope so
// they can easily be accessed by the template we're about to render.
//
// In other words, we now have two new variables:
//
// - $class_outer (extracted from $data['class_outer'])
// - $class_inner (extracted from $data['class_inner'])
//
// Cf. https://www.php.net/manual/en/function.extract.php
extract($data);
// Start output buffering
ob_start();
// Render template
include $template_path; // By including it, it has access to all
// variables defined in the current scope, i.e.
// inside this very function - like the variables
// we just extracted from $data
$rendered = ob_get_contents(); // Assign all output to a variable, so we can return it.
// End output buffering
ob_end_clean();
return $rendered;
}
Now, we can call that like:
$rendered = render('templates/partial.html.php', $data);
I would like to know if it is correct to print long html through php classes with echo instead of just print it in a normal way, for example do the following:
Supose i have an user class
User.php
class User {
private $name, $age;
public function __construct($name, $age) {
$this->name = $name;
$this->age = $age;
}
public function printProfile($name, $age) {
echo '<div class="panel panel-profile">
Name: '.$this->name.'<br />
Age: '.$this->age.'<br />
</div>';
}
}
And my profile.php would look something like
profile.php
<html lang="en">
<head>
<?php
require_once __DIR__ . "/Head.php
$head = new Head();
$head->printPanel();
?>
</head>
<body>
<?php
require_once __DIR__ . "/Header.php
$header = new Header();
$header->printPanel();
?>
<div class="content">
<?php
require_once __DIR__ . "/User.php
$user = new User();
$user->printProfile();
?>
</div>
<?php
require_once __DIR__ . "/Footer.php
$footer = new Footer();
$footer->printPanel();
?>
</body>
</html>
So.. I know it's possible but i don't know if is it correct to do that, am i making a proper use of the code? will influence the processing speed?
I like this way because i can reduce the code in all the pages, and just by changing the class it modify all the code. I also know that i could make something like
<?php require_once __DIR__ . "/header.php ?>
And include all the code there without making a class
header.php
<header>
some stuffs
</header>
But i don't really like this because it is not object-oriented.
Sorry about my english as you may have noticed i'm not really good at it.
Turns out, object orientation isn't everything. If you can do just as much procedurally, do it. In your case, for a simple website, you can get away with storing all of your chunks in a separate file, say, Chunks.php. Use one function for each of the pieces you want to add. You don't need 20 different classes with constructors for each element on the page. Just use static methods.
As for code style, put all your requires at the top so your page doesn't crash half way through rendering:
<?php require_once __DIR__ . "/Chunks.php ?>
<html lang="en">
<head>
<?php Chunks::printHead(); ?>
</head>
<body>
<?php Chunks::printHeader(); ?>
<div class="content">
<?php Chunks::printUserProfile(); ?>
</div>
<?php Chunks::printFooter(); ?>
</body>
</html>
Simple, easy to read, and does exactly what you expect without 30 different 20-line files clogging up your view.
Using echo to output the html to the screen is more typical today.
PHP echo and print Statements echo and print are more or less the
same. They are both used to output data to the screen.
The differences are small: echo has no return value while print has a
return value of 1 so it can be used in expressions. echo can take
multiple parameters (although such usage is rare) while print can take
one argument. echo is marginally faster than print.
You can read more about that here
You should add the require imports to the top of the page. which is what most people do.
Thanks! Your answers have been very useful, i'll begin using more statics methods.
I've been doing some simples websites, with javascript, jquery, html and php but i'm about to start a larger project and i wanted to clarify some stuffs.
You said In your case, for a simple website, ... but what about a larger website? the same applies?
This question already has answers here:
How to dynamically change a web page's title?
(20 answers)
Closed 8 years ago.
I would like to change the title of the HTML page based on the content, but im including only the content below the header part, so i have to change the title from this included php. To explain:
<html>
<header><title>I would like to change</title></header>
<!--CONTENT-->
<?
include "pages/some_page.php";
?>
</html>
How could i do that? Anyone can help in this?
You cant do that without a nasty hack.
What you should do is perform all your logic BEFORE you output html. A simple example follows:
<?php
//index.php
//perform logic and set variables before any html
$page = isset($_GET['menu'])?$_GET['menu']:'home';
switch($page){
case 'home':
$title = ' welcome to myco.ltd';
$content = 'pages/home.php';
break;
case 'about':
$title = 'about us';
$content = 'pages/about.php';
break;
case 'contact':
$title = 'get in touch';
$content = 'pages/contact.php';
break;
}
//the following html could be in a separate file and included, eg layout.php
?>
<html>
<head>
<title><?php echo $title;?></title>
</head>
<body>
<!--menu and other shared html here-->
<?php include $content;?>
<!-- shared footer stuff here-->
</body>
</html>
This is essentially a VERY barebones router script, an essential component of any framework. I would highly recommend you consider a lightweight framework rather than write everything from scratch. http://fatfreeframework.com/home would be a great start
The function below will let you change document title, meta keywords and meta description. You may use it anywhere in your application.
Just be sure to turn on output buffering using ob_start() before the function is called. I prefer including it at the top of application, just after all global settings are loaded.
function change_meta_tags($title, $keywords, $description){
$output = ob_get_contents();
if (ob_get_length() > 0) { ob_end_clean(); }
$patterns = array("/<title>(.*?)<\/title>/", "/<meta name=\"keywords\" content=\"(.*?)\" \/>/", "/<meta name=\"description\" content=\"(.*?)\" \/>/");
$replacements = array("<title>$title</title>", "<meta name=\"keywords\" content=\"$keywords\" />", "<meta name=\"description\" content=\"$description\" />");
$output = preg_replace($patterns, $replacements, $output);
echo $output;
}
Use javascript in some_page.php .
<?php echo "<script>document.title = '".$dynamicTitleVariable."';</script>"; ?>
Pending what you are trying to base the content off of, this could easily be done via an MVC-style setup. In your controller, you would generate the title based off of content that could be grabbed and pass this through to the view as a variable. Then, in your view have the title be dynamically set:
<html>
<head>
<title>
<?php echo $title; ?>
</title>
</head>
</html>
This should also work fine with SEO capability, as crawlers will be able to interpret this far better than they would JavaScript.
My website consists of many products that are each contained in a div with the id content block. The link, image, background, description and price are all loaded from a mySQL table. My original plan was to save the below html code as a string and loop over the rows in the mySQL table filling the string I created with php/mySQL values.
I was wondering if I am going about this the right way, or is there a better way to create html code from php variables?
<div id="contentblock" style="background-image:url(images/$BACKGROUND.png);">
<div id="picture"><img src="$IMAGELINK"/></div>
<div id="description"><p>$DESCRIPTION</p></div>
<div id="price"><p class=price>$PRICE</p></div>
</div>
Firstly PHP is a template engine - in my experience template engines that layer ontop of PHP are only good for the simplest of cases and are easily outgrown.
Secondly the original code is as good as any method. At risk of stating the obvious to make it better abstract it into a function;
function output_block($BACKGROUND, $LINK, $IMAGELINK, $DESCRIPTION, $PRICE)
{
echo "<div id='contentblock' style='background-image:url(images/$BACKGROUND.png);'>
<div id='picture'><a href='$LINK'><img src='$IMAGELINK'/></a></div>
<div id='description'><p>$DESCRIPTION</p></div>
<div id='price'><p class=price>$PRICE</p></div>
</div>";
}
If you want to make it much better then adopt a framework, an entire admin config page is show below. All of the HTML glue is provided by the framework - the following code is real, but really to illustrate how a framework can provide a lot of the grunge work for you.
In the example below if I want to edit a single entity I'd change the TableViewEdit into a FormView and provide an instance of an entity rather than an iterable list.
$entity = new CbfConfig(); // Database entity
$page = new AdminWebPage("Site Configuration"); // Page for output
/*
* build the view
*/
$vil = new ViewItemList();
$col = &$vil->add(new ViewItem("description","Description"));
$col->get_output_transform()->allow_edit(false); // this field cannot be editted
$col = &$vil->add(new ViewItem("value","Value"));
$v1 = new TableViewEdit($entity, $vil,"admin_values"); // present as standard editable table
/*
* output the page
*/
$page->begin();
$iterable_list = CbfConfig::site_begin();
$page->add_body($v1->get_output($iterable_list,'admin_config'));
$page->end();
Id just have all my html code outside of php tags, then whereever I need a variable from php do as follows
<div id="description"><p><?php echo $DESCRIPTION; ?></p></div>
You can loop around non php code too. For example
<?php
for($i = 0; $i < 10; $i++) {
?>
<div id="description"><p><?php echo $i; ?></p></div>
<?php
} //end for loop
?>
Obviously this is just an example.
well if im without a template engine for somereason i usually do something like:
function partial($file, $args = array()) {
extract($args);
ob_start();
include($file);
return ob_get_clean();
}
Really, there are 3 ways of doing this. Use whichever is easiest for you in the context that you are using it in.
<?php
while(($row=mysql_fetch_assoc($result))!==false)
{
echo "<div>{$row['fieldName']}</div>";
}
?>
<?php
while(($row=mysql_fetch_assoc($result))!==false)
{
echo '<div>'.$row['fieldName'].'</div>';
}
?>
<?php
while(($row=mysql_fetch_assoc($result))!==false)
{
?>
<div><?= $row['fieldName']; ?></div>
<?php
}
?>
I have seen the following thread but it's a bit beyond me...
How can I change the <title> tag dynamically in php based on the URL values
Basically, I have a page index.php (no php in it just named to future proof - maybe now!). It contains numerous lightbox style galleries which can be triggered from an external link by a variable in the URL - e.g. index.php?open=true2, index.php?open=true3, etc.
I would like the index.php title tag - to include existing static data + append additional words based on the URL variable - e.g. if URL open=true2 add "car gallery", if URL open=true3 add "cat gallery", if URL has no variable append nothing to title.
Can anyone assist? I have been searching but either missed the point of posts or it hasn't been covered (to my amateaur level).
Many thanks. Paul.
At the top of your php script put this:
<?php
# define your titles
$titles = array('true2' => 'Car Gallery', 'true3' => 'Cat Gallery');
# if the 'open' var is set then get the appropriate title from the $titles array
# otherwise set to empty string.
$title = (isset($_GET['open']) ? ' - '.$titles[$_GET['open']] : '');
?>
And then use this to include your custom title:
<title>Pauls Great Site<?php echo htmlentities($title); ?></title>
<title>Your Static Stuff <?php echo $your_dyamic_stuff;?></title>
<?php
if( array_key_exists('open', $_GET) ){
$title = $_GET['open'];
}else{
$title = '';
}
?>
<html>
<head>
<title><?php echo $title; ?></title>
</head>
<body>
The content of the document......
</body>
</html>
http://www.w3schools.com/TAGS/tag_title.asp
http://php.net/manual/en/reserved.variables.get.php
PHP can fetch information from the URL querystring (www.yoursite.com?page=1&cat=dog etc). You need to fetch that information, make sure it's not malicious, and then you could insert it into the title. Here's a simple example - for your application, make sure you sanitise the data and check it isn't malicious:
<?php
$open = "";
// check querystring exists
if (isset($_GET['open'])) {
// if it does, assign it to variable
$open = $_GET['open'];
}
?>
<html><head><title>This is the title: <?php $open ?></title></head>
PHP has lots of functions for escaping data that might contain nasty stuff - if you look up htmlspecialchars and htmlentities you should find information that will help.
Some of the other answers are open to abuse try this instead:
<?php
if(array_key_exists('open', $_GET)){
$title = $_GET['open'];
} else {
$title = '';
}
$title = strip_tags($title);
?>
<html>
<head>
<title><?php echo htmlentities($title); ?></title>
</head>
<body>
<p>The content of the document......</p>
</body>
</html>
Otherwise as #Ben has mentioned. Define you titles in your PHP first to prevent people from being able to directly inject text into your HTML.