Tough designing and PHPing at the same time

Do you have a question? Post it now! No Registration Necessary.  Now with pictures!

Threaded View
1. I'm designing a PHP-based page that has a lot of design stuff in it. It's  
very tough to mix the HTML and PHP and have it be readable. The site isn't  
overall so complicated, there's just a lot of graphics. Is there some  
commercial way to design the page in a design program, then to use the  
designed page as a skeleton, or "template" or "fill in" page as a pre-cursor  
for a real HTML page? For instance, I could replace the designed graphic  
with a different graphic at runtime, or could switch off the href hyperlinks  
to a different place. This would be really cool, and I wouldn't be so  
hampered in my code.

2. What PHP editors exist out there which will do "intellisense" parameter  
fill-ins? I'm aware of DreamWeaver, but it's got it's minuses. Any other  
apps I should try out?


Re: Tough designing and PHPing at the same time

eric rudolph wrote:
Quoted text here. Click to load it

This is how I do it:

1. design a page in Photoshop or something like that

2. spend some time deciding how to transform images into HMTL, what is going  
to be text, what images will stay as images, etc.... This is the CRUCIAL  

3. Create template in HTML, and validate it using xhtml or html strict (the  
stricter the better).

4. take out common elements from HTML and put them into a separate file as  
functions.  I call this file _snippets.php and it may include functions like

function ender ($note) {
 $v = '</div></div>.<p id="finalnote">
return $v;

I usually have three functions in the _snippets.php file
a. starter with all the header info
b. ender with all the standard html at the bottom of the page
c. menuer, which contains a menu.  I usually use the replace function to  
highlight the current item in the menu by passing the file name to the  
menuer function.

5. create individual php pages that look like this:
//connect to database, etc...
//lots of php
echo starter($title, $subtitle, $icon, $color);
echo menuer($filename, $submenu);
<!-- Content for the individual page here -->

echo ender($note);

In that way I can
a. change the whole site at once in the _snippets.php file.
b. easily edit the content of the individual php pages without having any  
structural elements in the way
c. All javascript is in one or more javascript files
d. All styles are in a stylesheet.

Personally, I find this a really powerful way to create a website and even  
though I only use Notepad2 (similar to Notepad, but with a few powerful  
functions and colour coding). I dont loose track of things, because I  
minimize the amount of coding to the bare minimum and I know exactly where  
is what because I created it and not some program that often adds lots  

- Nicolaas  

Re: Tough designing and PHPing at the same time

Quoted text here. Click to load it
Quoted text here. Click to load it

you could try some of the many php templating solutions like Smarty for

  Or even better you could try my TemplateTamer, that combines template
engine with IDE to work effectively with php and templates, and gives you
for each page 2 separate files, html template, and php file that contains
presentation logic in clean php..


Re: Tough designing and PHPing at the same time

Quoted text here. Click to load it
Create your own template system - easy to do and you have complete control  
over it.

1. Create a stylish looking page in the designer of your choice.  Replace  
key parts of the page with template tags (i.e. or ). -  
Save as template.htm
2. Define your tags (i.e. Get $pagetext from a database, include a file that  
defines $mainmenu)
3.  Read the template.htm into a string called $output and replace all the  
template tags with the string values you have defined. (I have show a simple  
script to do this below)
4. Output the final version (echo $output;)

That's it!


Replace script...

$pat = array("/}/s",
$rep = array("$pagetext",
// replace all occurences of search patterns with according replacements
$output = preg_replace($pat, $rep, $output);

Site Timeline