how to layout php within html?

poissys

im trying to layout a webpage, i already have a standard html template, that i use on every page of my website.
However i want to embed the results of my php functionality neatly within the html template that i wish to use. heres link to want i want to do

thanks

Cantab.

Looks to me like that "Search/User Login" yoke is taking up an entire row.

You can either implement the entire page as an HTML table (I don't think this is best practice anymore) or use CSS for laying out everything.

I'd suggest using a standard CSS template. Have a look at http://www.glish.com/css/ -- in particular, the "holy grail".

Bluefrog

I would no longer use tables for basic page layout. Tables should be for tabular data but I concede that they are useful for forms layout too. I take this approach.

I run up my basic layout template in XHTML This would contain header, left menu, main content, right menu and footer areas - a really basic layout. I use divs controlled with CSS for this. At this point I would have a bunch of templates I have used before that would cover most layouts - reuse is all if you want to do this commercially.

Then I add the template to a PHP class - specifically to a method of the class which basically outputs that layout with the page elements of the various areas such as header, footer etc pulled in as includes.

The page class would also contain member variables for standard data accross the entire site like the site name, company name, contact info, database connection strings etc and it also has a method to load in the main content of each page.

Then for each page of the site that I require I just have to instantiate the class with the appropriate arguments such as page title, meta tag values and the location of the main content include and finally I call the page output method.

This approach gives good consistent layout and the quickest development time possible. I could have opted to use a templating system like Smarty but I prefer to know the complete codebase and on each site build I would improve it somewhat.

To see it in action check out:
http://www.milliganplace.com
http://www.greenpasturesdonegal.com
http://www.rossfineart.ie
http://www.runwaymedical.com
http://www.runwayhomecare.ie
http://www.jobfinder.ie

The equivalent idea in ASP.NET would be master pages though this site preceds them as it was built with .NET 1.1:
http://www.realbeers.ie

Adam

Bluefrog wrote: »

I would no longer use tables for basic page layout. Tables should be for tabular data but I concede that they are useful for forms layout too. I take this approach.

I run up my basic layout template in XHTML This would contain header, left menu, main content, right menu and footer areas - a really basic layout. I use divs controlled with CSS for this. At this point I would have a bunch of templates I have used before that would cover most layouts - reuse is all if you want to do this commercially.

Then I add the template to a PHP class - specifically to a method of the class which basically outputs that layout with the page elements of the various areas such as header, footer etc pulled in as includes.

The page class would also contain member variables for standard data accross the entire site like the site name, company name, contact info, database connection strings etc and it also has a method to load in the main content of each page.

Then for each page of the site that I require I just have to instantiate the class with the appropriate arguments such as page title, meta tag values and the location of the main content include and finally I call the page output method.

This approach gives good consistent layout and the quickest development time possible. I could have opted to use a templating system like Smarty but I prefer to know the complete codebase and on each site build I would improve it somewhat.

To see it in action check out:
http://www.milliganplace.com
http://www.greenpasturesdonegal.com
http://www.rossfineart.ie
http://www.runwaymedical.com
http://www.runwayhomecare.ie
http://www.jobfinder.ie

The equivalent idea in ASP.NET would be master pages though this site preceds them as it was built with .NET 1.1:
http://www.realbeers.ie

I don't mean to nitpick but the image of Milligan Place on the home page is ridiculously large! In file size I mean, as opposed to proportions. On dial-up and it took a good 20 seconds to load! :eek:

OT, good advice for the OP, but when I read the title and the post I took him not to mean how to layout the page as a whole, but more the practice of outputting resultsets through php i.e. echoing the query results into divs/tables/etc.

I could be wrong though!

stevenmu

poissys wrote: »

im trying to layout a webpage, i already have a standard html template, that i use on every page of my website.
However i want to embed the results of my php functionality neatly within the html template that i wish to use. heres link to want i want to do
thanks

Normally what you'd do is break your page down with <div> tags. You'd have a div for each section of your page, one for your header, one for your left navigation bar, one for your footer and another for your main content. It's in the main content div that you would embed your php code to display the content that changes from page to page. e.g.

<HTML>
<HEAD></HEAD>
<BODY>

<DIV id="header">header image goes here</DIV>
<DIV id="leftnav">left nav links go here</DIV>
<DIV id="maincontent">
   embed your php code here
</DIV>
<DIV id="footer">footer image goes here</DIV>

</BODY>
</HTML>

There are standard names you can give each of your divs as a best practice, but I can't remember what they are, maybe someone else will chip in with them, but that's the basic way you should be constructing your templates and adding in PHP code. You may of course need to add in php code in other places too, for e.g. if you might need to redirect you would put that check at the very top, or you might want to display a login status in your header so you'd add php code into your header div for that.

Webmonkey

Like Steve said there ^

Also you could implement a column to handle the issue with the search thing as follows:

(Havn't tested it)

<html>
<head>
<style>
#maincontent
{
   width: 800px;
}

#maincontent #leftcolumn
{
	width: 240px;
	padding:20px;
	float:left;
}
#maincontent #rightcolumn
{
	width: 480px;
	padding:20px;
	float:right;
}
</style>
</head>
<body>

<div id="header">header image goes here</div>
<div id="leftnav">left nav links go here</div>
<div id="maincontent">
  <div id="leftcolumn">
        Put your search code in here
  </div>
  <div id="rightcolumn">
	 embed your php code here
  </div>
</div>
<div id="footer">footer image goes here</div>

</body>
</html>

Might be of help.

Bluefrog

Mirror wrote: »

I don't mean to nitpick but the image of Milligan Place on the home page is ridiculously large! In file size I mean, as opposed to proportions. On dial-up and it took a good 20 seconds to load! :eek:

Glad I'm not using dial-up then or even worse - Three. How come sentences beginning with 'I don't mean to nitpick' always seem to end up nitpicking

In any case, you're completely right about the image - it's a disgrace, I'm a disgrace - hanging my head with shame - sigh....

Adam

Well funnily enough I am using an o2 modem, but where I live I can only get GPRS signal. Better than nothing, but only just!

dzy

Bluefrog wrote: »

Glad I'm not using dial-up then or even worse - Three. How come sentences beginning with 'I don't mean to nitpick' always seem to end up nitpicking

In any case, you're completely right about the image - it's a disgrace, I'm a disgrace - hanging my head with shame - sigh....

I love the marketting photos

dzy

I take a very simple MVC approach. My model is a set of functions to read and write to the database. I divide the functions up into different files - one file per database table or if a few tables are closely related I might put all functions for those tables in one file.

My controllers are my front-end files in the public directory - the target of the request. They read any parameters from the request, perform any validation and then call functions in the model.

Finally, any data to display is retrieved from the model and a template file is included. The template file is just HTML with little bits of PHP to write out any data. I might separate out some parts of the template into separate files if they occur in more than a few pages and just include them from each individual page.

And thats it.

Webmonkey

an OOP approach is a lot nicer - only when you understand OOP fully though. I've done a few apps in OOP with PHP5 now and very impressed of the power and flexibility.

machalla

Smarty might have the answer.

That at least gives you some separation of the php code from your presentation layer.

Not a full mvc style but better than throwing a load of php code into what should be a template file.

dzy

I've found that it doesn't really matter if I implement the pages, models, views etc. as objects or as a set of static functions. I suppose the one thing I could say for using objects is you won't have as many variables in the global namespace. I think its really just a matter of preference and whatever programming model you are most comfortable using.

dzy

machalla wrote: »

Smarty might have the answer.

That at least gives you some separation of the php code from your presentation layer.

Not a full mvc style but better than throwing a load of php code into what should be a template file.

I tried Smarty and didn't find that I got much benefit from it. The syntax is cleaner looking than PHP. But really, thats the only advantage I found.

Bluefrog

dzy wrote: »

I love the marketting photos

Most likely they're looking perplexed at the image size on the homepage of the site

Bluefrog

A lot of the time in PHP the tasks you are doing are fairly straight forward and you won't see a huge difference in ease of use and productivity between maintaining a bunch of functions and structuring them in classes as methods but it does get you thinking in a pretty helpful way for when more complex tasks come along. It also promotes consitent naming conventions which can save you a lot of time adapting one class to do something new. Having your functions structured is also handy. like a filing system.

One place I really like it is in the seperation of the data layer from the business logic layer.