Is there a view helper to add comments (not conditional comments) to the HEAD section of the page. I am using a layout approach.
On a couple of the view helpers supplied with Zend Framework you can use captureStart() and captureEnd() to grab comments. Not what it is designed for, but it works.
eg (in a view script):
<?php $this->headScript()->captureStart(); ?>
<!--some comment-->
<?php $this->headScript()->captureEnd(); ?>
Then in your layout echo $this->headScript() in the head.
This is just proof of concept. Most of the head view helpers will throw an error if you try this. It only works with headScript and headStyle. Of the two I would use headStyle as good practice these days is to have the styles in the head and scripts in the footer. Ideally you can write your own view helper to do this specifically.
Related
I wish to have a codeigniter application with 3 templates.
a template for displaying a login view, or an error view.
a template with header body navigation
a template with header body sidebar footer
now I can build the codeigniter application, but I can't find a simple template system to accomplish this task. There are many recommendations for libraries available, but they lack implementation details.
Suggestions and guidance would be appreciated.
You can user CodeIgniter Template.
http://williamsconcepts.com/ci/codeigniter/libraries/template/index.html
Download here the library and also you have a full documentation.
With this library, you can use more than one template, and you can manage it easy and separate in groups.
It's quite simple once you get your head around it.
You need to create a view file for each of the things you've listed above, so you'll want something like this (folder/file wise):
views/page-login.php
views/page-error.php
views/header.php
views/footer.php
Then from your controller you will load one of the page views.
Within the page view you can then load the elements you require, so header and footer with the page specific code between them.
So for example your login page could be:
<?php $this->load->view('header'); ?>
<h1>Login</h1>
<p>Please login to my website.</p>
<?php $this->load->view('footer'); ?>
This is fairly simple.
A quick example:
In your controller you can put
//a test variable
$data["foo"] = 'bar';
$data["page"] = 'a_page'; // this will make sure it loads the views/pages/a_page.php in your template
$this->load->view('templates/login',$data);
And in your views/template/login.php you can put:
<!-- your login template html -->
<html>
...
<!-- include the view you want inside your login template -->
<?php $this->load->view('pages/'.$page);?><!-- As you can see it loads /views/pages/a_page.php -->
<?php echo $foo;?> //This will echo Bar
</html>
or:
<?php $this->load->view('template/login_header');?>
<?php $this->load->view('pages/'.$page);?>
<?php $this->load->view('template/login_footer');?>
views/pages/a_page.php will also know $foo.
This loads another view (views/pages/a_page.php) in your template.
This way you can create all the templates you want, and include your view in those templates.
TIP: Handling headers & footers this way get's unmanageable pretty quickly. And it's still better to use template libraries. Try Phil sturgeon's library
Has anyone managed to integrate HTML5 Boilerplate in the YII PHP Framework (specifically the folder structure and build process)?
Boilerplate recommends using the #import when adding styles to the head.
<style>#import(/example.css);</style>
Yii uses the ClientScript model to add
<link type="text/css" src="/example.css" />
Use the Yii::app()->clientScript Model to register the file. Yii allows you to register script files as needed, per controller or per view. Therefor your http requests can be minimal. I would suggest registering the required scripts/css in the main layout and add other scripts as they are needed with the
Yii::app()->clientScript->registerScriptFile();
Yii is based on the MVC model. The V is for view. The view foldes contain the html elements your model and controller will adjust based on data types. Inside the view folder Yii uses the layout folder to define layouts.
$this->layout = 'main';
That line will look for:
Protected -> views -> layout -> main.php
The layout folder should contain main, _htmlHead, _header and _footer. The renderPartial will be used for render the different layout parts. It's like a php include for HTML. The second param of $this->render or $this->renderPartial is used to pass data to the view. For example nav data:
$this->renderPartial('_footer', array('nav'=>array('/link/'=>'Link Name')));
In the _htmlHead register the needed elements using the Yii::app()->clientScript. If you want to use a different version of jQuery then use the ScriptMap model, don't register jQuery twice. Yii's coreScript, validation and paging are based on jQuery.
$cs = Yii::app()->clientScript;
$cs->registerCssFile('/css/base.css');
$cs->registerScriptFile('/js/base.js', CClientScript::POS_END);
/* Load Script at END of DOM tree: CClientScript::POS_END */
http://www.yiiframework.com/doc/api/1.1/CClientScript
In the past I've used the config.php file in Yii to set an assetsLocaion parameter. If I move my assets it won't break the site.
Yii::app()->clientScript->registerScriptFile(Yii::app()->param->assetsLocation.'/js/example.js');
The basic layout of the boilerplate will be defined in the layout/main.php. Check out the theme documentation: http://www.yiiframework.com/doc/guide/1.1/en/topics.theming
Layout File Might look like this:
<!doctype html>
<?php $this->renderPartial('//layouts/_Htmlhead); ?>
<body>
<div id="container">
<?php $this->renderPartial('//layouts/_header); ?>
<div id="main" role="main">
<?php echo $content; ?>
</div>
<?php $this->renderPartial('//layouts/_footer); ?>
</div>
<?php $this->renderPartial('//layouts/_footerScripts); ?>
</body>
</html>
Check my Yii BoilerPlate and Bootstrap Integration
https://github.com/drumaddict/YiiApp
A simple Yii HTML5 Boilerplate theme is available at https://github.com/neam/yii-html5-boilerplate
There is a very detailed Wiki article by Antonio Ramirez titled:
YiiBoilerplate - Setup a professional project structure in seconds
http://www.yiiframework.com/wiki/374/yiiboilerplate-setup-a-professional-project-structure-in-seconds/
Sources for this setup:
https://github.com/clevertech/YiiBoilerplate
What about
https://github.com/clevertech/YiiBoilerplate
I think they Uses HTML5Bilerplate
Most HTML in a large website is duplicated across pages (the header, footer, navigation menus, etc.). How do you design your code so that all this duplicate HTML is not actually duplicated in your code? For example, if I want to change my navigation links from a <ul> to a <ol>, I'd like to make that change in just one file.
Here's how I've seen one particular codebase handle this problem. The code for every page looks like this:
print_top_html();
/* all the code/HTML for this particular page */
print_bottom_html();
But I feel uncomfortable with this approach (partially because opening tags aren't in the same file as their closing tags).
Is there a better way?
I mostly work with PHP sites, but I'd be interested in hearing solutions for other languages (I'm not sure if this question is language-agnostic).
I'm not a php programmer, but I know we can use a templating system called Smarty that it works with templates(views), something like asp.net mvc does with Razor.
look here http://www.smarty.net/
One solution at least in the case of PHP (and other programming languages) is templates. Instead of having two functions like you have above it would instead be a mix of HTML and PHP like this.
<html>
<head>
<title><?php print $page_title ?></title>
<?php print $styles ?>
<?php print $scripts ?>
</head>
<body>
<div id="nav">
<?php print $nav ?>
</div>
<div id="content">
<?php print $content ?>
</div>
</body>
</html>
Each variable within this template would contain HTML that was produced by another template, HTML produced by a function, or also content from a database. There are a number of PHP template engines which operate in more or less this manner.
You create a template for HTML that you would generally use over and over again. Then to use it would be something like this.
<?php
$vars['nav'] = _generate_nav();
$vars['content'] = "This is the page content."
extract($vars); // Extracts variables from an array, see php.net docs
include 'page_template.php'; // Or whatever you want to name your template
It's a pretty flexible way of doing things and one which a lot of frameworks and content management systems use.
Here's a really, really simplified version of a common method.
layout.php
<html>
<body>
<?php echo $content; ?>
</body>
</html>
Then
whatever_page.php
<?php
$content = "Hello World";
include( 'layout.php' );
Sounds like you need to use include() or require()
<?php
include("header.inc.php");
output html code for page
include("footer.inc.php");
?>
The header and footer files can hold all the common HTML for the site.
You asked for how other languages handle this, and I didn't see anything other than PHP, so I encourage you to check out Rails. Rails convention is elegant, and reflects #codeincarnate 's version in PHP.
In the MVC framework, the current view is rendered inside of a controller-specific layout file that encapsulates the current method's corresponding view. It uses a "yield" method to identify a section where view content should be inserted. A common layout file looks like this:
<html>
<head>
<% #stylesheet and js includes %>
<body>
<div id="header">Header content, menus, etc…</div>
<%= yield %>
<div id="footer">Footer content</div>
</body>
</html>
This enables the application to have a different look and feel or different navigation based on the controller. In practice, I haven't used different layout files for each controller, but instead rely on the default layout, which is named "application".
However, let's say you had a company website, with separate controllers for "information", "blog", and "admin". You could then change the navigation for each in a clean and unobtrusive manner by handling the different layout views in their respective layout files that correspond to their controllers.
You can always set a custom layout in the controller method by stating:
render :layout => 'custom_layout'
There are also great helper methods built into Rails so you don't have to rely on $global variables in PHP to ensure your CSS and Javascript paths are correct depending on your development environment (dev, staging, prod…). The most common are:
#looks in public/stylesheets and assumes it's a css file
stylesheet_link_tag "filename_without_extension"
#looks in public/javascripts and assumes it's a js file
javascript_include_tag "jquery"
Of course, each of these sections could be expounded upon in much greater detail and this is just brushing the surface. Check out the following for more detail:
http://guides.rubyonrails.org/layouts_and_rendering.html
What you suggested works OK. As long as print_top_html and print_bottom_html stay in sync (and you can use automated tests to check this), then you never need to worry about them again, leaving you to focus on the real content of the site -- the stuff in the middle.
Alternatively, you can combine print_top_html and print_bottom_html into a single call, and send it HTML code (or a callback) to place in the middle.
I use the partials system of Zend_View (very similar to Rails). A partial is essentially a small HTML template that has its own variable scope. It can be called from inside views like:
<?php echo $this->partial('my_partial.phtml', array( 'var1' => $myvar ));
The variables that get passed into the construct get bound to local variables inside the partial itself. Very handy for re-use.
You can also render a partial from inside normal code, if you're writing a helper object where you have more complex logic than you'd normally feel comfortable putting in a view.
public function helperFunction()
{
// complex logic here
$html = $this->getView()->partial('my_partial.phtml', array('var1' => $myvar ));
return $html;
}
Then in your view
<?php echo $this->myHelper()->helperFunction(); ?>
Im learning a lot about how MVC frameworks work by looking around and studying existing ones. It seems that every framework I see has a layout where each method in each controller has its own template file. So there will be a login template, a logout template, register, so on and so on.
My question is, how and why would you create a template for the entire page all within one file. Lets say you wanted to show the login form on more than one page, wouldn't you have to create the login form for each template that you want it to display on? Doesn't that go against the don't repeat yourself rule (DRY)?
The way i've been doing things so far is I've been creating liitle chunks of templates and then combining them to create each page. So instead of doing something like this,
$title = 'Blah Blah Blah';
$user = 'Jon Miller';
include 'index.phtml';
<html>
<head>
<title><?php echo $title; ?></title>
</head>
<body>
<h3><?php echo $user; ?></h3>
<form>login form</form>
</body>
</html>
I've been doing this
$title = 'Blah Blah Blah';
include 'header.phtml';
$user = 'Jon Miller';
include 'user.phtml';
include 'login_form.phtml';
include 'footer.phtml';
header.phtml
<html>
<head>
<title><?php echo $title; ?></title>
</head>
<body>
user.phtml
<h3><?php echo $user; ?></h3>
login_form.phtml
<form>login form</form>
footer.phtml
</body>
</html>
As alway, I would just like to know the proper way to do it, along with how and why...It just seems to go against the DRY rule.
Thanks
You should check out the concepts of 'layouts' and 'view helpers'. While I've linked to the Zend Framework version of those concepts, other MVC frameworks (and the MVC concept) should have them as well.
The basic idea is that your page 'view' - for example the login form - is included into your site 'layout' - the general template that is used throughout your site. When you request a different controller, with a different view - for example a user profile - that view is also included in the same layout.
To include something like a login form on all pages, a view helper can be used. That view helper could display the current user, or display a login form, depending on the login status. View helpers may be included in the layout, or included by the specific controller (as long as MVC framework allows some kind of named render segments).
The two step 'include' method works better than linear inclusion of parts (including header, then content, then footer - what you're doing now) because your templates do not have to split HTML tags. The Zend Guide has a good visual example of view templates in a layout.
One word: Organization. Separating each part of the page will allow each of them to be viewed/edited separately. This simple concept is very beneficial. For example, anyone in the team that want to handle login process can easily figure out that they have to edit login_form.phtml and they can be sure that editing login_form.phtml will less likely to unintentionally interfere with other functionalities.
As of the best practice, here is how I do it (not exactly but similar).
$Title = 'Blah Blah Blah';
$User = 'Jon Miller';
$ThemeName = "MyGreenPage";
$Contents = array("User", "Login_Form");
function Include($FileName) {
if (file_exists($FileName))
include $FileName;
}
MyGreenPage.phtml:
<html>
<head>
<title><?php echo $title; ?></title>
<?php
foreach($Contents as $Content)
Include("$Content.pcss");
?>
<?php
foreach($Contents as $Content)
Include("$Content.pjs");
?>
</head>
<body>
<?php
foreach($Contents as $Content)
Include("$Content.phtml");
?>
</body>
</html>
User.pcss:
/* Some styles needed by User */
User.pjs:
/* Some script needed by User */
User.phtml:
<h3><?php echo $user; ?></h3>
Login_Form.pcss:
/* Some styles needed by Login_Form */
Login_Form.pjs:
/* Some script needed by Login_Form */
Login_Form.phtml:
<form>login form</form>
Let me remind you again that this is not that exactly what I do (what I do use OOP) so this may not exactly run as is and you may need to edit it.
The most common way to do HTML templating with PHP, is to use one of these popular templating engines :
Smarty
Twig
Latte
Mustache
Alternatively, you can just put placeholders in your HTML that look something like <% variablename %>. Just load your HTML, do a regex do find all placeholders and replace them with the corresponding variables.
Alternatively, you can load your HTML, parse it as a DOM document and then modify your DOM. I created the library DOM Query to be able to do this with a jQuery-like syntax, but you could use vanilla PHP or one of several other libraries as well.
Alternatively, you can do some HTML templating in frontend with JavaScript. If you want to do HTML templating both on frontend and backend, you might want to consider using Mustache, because Mustache templates can be used both in frontend (with JavaScript) and in backend (with PHP).
For this project I am working on, all views are XSL templates. Instead of passing variables to the view, I generate all the XML in the controller and transform it with the view.
I like this structure because I can keep all my templates in one file, and arrange them anyway I want. It's also a standard template language which is very flexible and has tons of documentation. This has been working out really well so far.
A really good example of this structure is the WoW Armory website (view the source).
So I had a question on general organization of code for the Zend framework with regard to the layout.
My layout is basically this:
(LAYOUT.PHTML)
<div id='header'>
<?= $this->Layout()->header ?>
</div>
<div id='main'>
<?= $this->Layout()->main ?>
</div>
<div id='footer'>
<?= $this->Layout()->footer ?>
</div>
and so on and so forth. Now, in order to keep my code in my header separate from the code of my main and the code of my footer, I've created a folder for my view that holds header.phtml, main.phtml, footer.phtml. I then use this code to assign the content of header.phtml into $this->layout()->header:
(INDEX.PHTML)
$this->Layout()->header = file_get_contents('index/header.phtml');
$this->Layout()->main = file_get_contents('index/main.phtml');
$this->Layout()->footer = file_get_contents('index/footer.phtml');
That was working great, but I've hit a point where I don't want main to be static HTML anymore. I would like to be able to insert some values with PHP. So in my Controller in indexAction, I want to be able to load from my database and put values into index/main.phtml. Is there a way to do this without restructuring my site?
If not is there a way to do it so that I can have:
The ability to put code into different sections of my layout, such as Layout()->header, Layout->footer.
Separate these pieces into different files, so that they're easy to find and organize, like my index/footer.phtml, index/main.phtml etc.
Not have to put that code into quotes unnecessarily to turn it into a string to pass it to Layout()->header etc.
Thank you guys so much for your help.
-Ethan
Here is an idea:
Assign layout()->header the filename instead of the contents.
Put your code in this file
In your layout file, include() or require() the layout->header().
Since your layout headers/footers are now parsed, you can use them just like a view.
The ->header in $this->layout()->header is response segment. You can render parts of response using $this->_helper->viewRenderer->setResponseSegment('header'); in an action.
If you use
$this->layout()->header = $this->render('index/header.phtml');
It will even use the view, therefore keeping all your variables defined when rendering the header.
I would suggest using something like
<?php echo ($header = $this->layout()->header)?
$header : $this->render('headerDefault.phtml'); ?>
in your layout file - it will render a default header from the layout folder if the view script doesn't override it.
Have you tried looking at view helpers. They are a way of structuring view logic into reusable and modular code. In this case you would use a view helper to generate each of your required segments. So your example view script would look like
$this->Layout()->header = $this->header();
$this->Layout()->main = $this->main();
$this->Layout()->footer = $this->footer();
The benefit of using view helpers over include and require statements is that all of the file handling and name resolution is handled by the framework. The manual has more information on how to set up the paths and usage examples etc.
helpers are good. Another option is like the above, putting filenames in header/footer - put the template names and use $this->render($this->layout()->header)), etc etc. This is just like the include/require above, but more consistent.