[PHP] Modify HTML Spacing

SpicyDuck · 13 Jan 2008 at 08:50

I hope someone here has a solution for a problem I'm having. I can't move forward with the project I'm working on otherwise, and I've been trying for about an hour.

I have a default Wordpress install, in which I'm creating my own theme. The very 'theme' of this theme, is that it's meant to be perfect in as many ways as possible. I love Wordpress, but I hate its default code indentation, as it makes things very messy.

What I am hoping to do, is find a method that will go through the generated source of a page before it is displayed, strip all instances of "\n" and "\t", then display it as normal.

I've found nothing online that is much help, except for one little function that goes at the top of the page:

Code:

<?php
	function htmlize($buffer) {
		return (preg_replace("!s*/>!", ">", $buffer));
	}
	ob_start("htmlize");
?>

This function simply finds all instances of "/>" and replaces it with just ">" at the end of a tag. That was made for somebody looking to make Wordpress validate to HTML Strict. Not something I want.

I've tried playing with it, to no avail thus far.

Another solution would be to create a script that edits Wordpress core files, removing all of the things I don't want. But that is a little messy, really.

I would also require that once the source has been stripped, further instances of line breaks and tabs would not be ignored, in any of the theme files.

marc2003 · 13 Jan 2008 at 09:27

Code:

<?php
	function htmlize($buffer) {
                $replace = array("\n", "\t");
		return str_replace($replace, "", $buffer);
	}
	ob_start("htmlize");
?>

might work?

SpicyDuck · 13 Jan 2008 at 11:04

That worked great and, after a few tweaks and fixes for certain problems (like the source displaying on one line), I made this:

Code:

<?php

	function htmlize($source) {
                $old = array("\n", "\t", " <", "> ", "/> ");
		$new = array("\n", "", "<", ">", "/>");
		return str_replace($old, $new, $source);
	}
	
	ob_start("htmlize");

?>

This all works fine now. The code is displayed line by line, with no errors, tag interference or default indentations.

The problem now is, if I edit the theme files and add a tab, or new line; this function also strips those. Hmm. I can't seem to think of a way past this one.

marc2003 · 13 Jan 2008 at 11:14

i suppose you could put in your own code for tabs, as an example

<tab>

and then replace that with proper tabs after removing all the other ones. hopefully you understand what i mean.

Code:

<?php

	function htmlize($source) {
                $old = array("\n", "\t", " <", "> ", "/> ");
		$new = array("\n", "", "<", ">", "/>");
		$source = str_replace($old, $new, $source);
                return str_replace('<tab>', "\t", $source)
	}
	
	ob_start("htmlize");

?>

bit of a dirty hack though...

SpicyDuck · 13 Jan 2008 at 11:29

Yeh, it is just a wee bit dirty.

Not an option I would consider really, but thanks all the same.

SpicyDuck · 13 Jan 2008 at 11:47

Another query while I'm trying to work this one out.

I'm trying to automatically insert a new line after a closing tag. But some tags close, such as </head>, </html>, etc. I only want to put a new line after a closing tag, but there are so many variables to consider.

Is there anything similiar to saying:

Put a new line after all tags that start with </ and end with >?

Using the function above. That'd be a great help.

SpicyDuck · 13 Jan 2008 at 11:56

Looks like the only way I can do this, is to take the function above and keep adding replacements and refining it. But another problem will come when I want to use more than one tab or line break.

But I really don't want to edit Wordpress' core files. Oh God, where art thou'?

marc2003 · 13 Jan 2008 at 12:10

what you need is regular expressions (like in your first post). i haven't a clue how to use them though.

but there are a few guys on here who know their stuff. hopefully one will pop by at some point.

besides, why all this effort just to make your html source look pretty?

SpicyDuck · 13 Jan 2008 at 12:24

marc2003 said:
what you need is regular expressions (like in your first post). i haven't a clue how to use them though. but there are a few guys on here who know their stuff. hopefully one will pop by at some point.

besides, why all this effort just to make your html source look pretty?

It's just this annoying thing I have, that the site needs to be perfect.

It's not just pretty code, but about researching every aspect of web development and putting it all into practice. SEO, Layout, Typography etc, and applying the most up-to-date research for maximum results.

I guess, it's just a test.

Augmented · 13 Jan 2008 at 13:08

The 'best practice' for code indentation and line-breaks in the source, in my opinion, is none at all. If you can get it all on one line, all the better for it.

There are no appreciable benefits from having prettyfied source code on a production site, but by reducing the amount of whitespace you will gain the benefit of smaller files = optimal bandwidth usage/maximum results. I'm rather anally retentive about code layout, indentation and the like, but on a production site 'perfect' is about best performance.

Beware of running your whitespace-stripping code above on <pre> elements, <textarea>s, <kbd>s and any other element that relies on whitespace to display correctly.

SpicyDuck · 13 Jan 2008 at 13:43

Thanks for pointing that out.

The site will just be a personal one, and it will act as a showcase (or an example) of what can be done. What you're saying is true but I feel that, as far as personal sites are concerned, there is a lot more room for adding little elements of beauty and structure.

That's just my opinion though and, as far as I'm aware, it's one that's shared within many development communities (regarding personal websites).