Intending the outputted HTML

**risoknop** · Dec 2, 2008 12:08

How do you do it?

I just cannot figure out how to write PHP code so that the outputted HTLM would be nicely indented.

This is my usual way of writing PHP in template files (I have created a dummy posts table with some random data):

PHP Code:


<div>

    <?php foreach ($posts as $post): ?>

    <h2><?php echo $post->title; ?></h2>

    <?php echo $post->content; ?>

    <?php endforeach; ?>

</div>

Which outputs:

Code:

<div>
        <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>        <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>        <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>
</div>

I would like something nicely indented like this:

Code:

<div>
    <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>
    <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>
    <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>
</div>

**galen** · Dec 2, 2008 12:23

Originally Posted by risoknop

Code:

<div>

    <?php foreach ($posts as $post): ?>

    <h2><?php echo $post->title; ?></h2>

    <?php echo $post->content; ?>

    <?php endforeach; ?>

</div>

the tab before the foreach is whats causing the extra index

PHP Code:


<div>

<?php foreach ($posts as $post): ?>

    <h2><?php echo $post->title; ?></h2>

    <?php echo $post->content; ?>

<?php endforeach; ?>

</div>

**Daniel0** · Dec 2, 2008 12:33

You needn't care about whether it looks nice when outputted. What matters is if it looks nice when you read it in your template files.

**SJH** · Dec 2, 2008 12:41

Originally Posted by Daniel0

You needn't care about whether it looks nice when outputted. What matters is if it looks nice when you read it in your template files.

I used to think that before I started developing large web applications. Trying to spot a bug when the source code is neatly indented is a godsend, trust me.

**risoknop** · Dec 2, 2008 12:42

Originally Posted by galen

the tab before the foreach is whats causing the extra index

PHP Code:


<div>

<?php foreach ($posts as $post): ?>

    <h2><?php echo $post->title; ?></h2>

    <?php echo $post->content; ?>

<?php endforeach; ?>

</div>

I know but then it looks bad in the template file.

**risoknop** · Dec 2, 2008 12:51

Well I have made this:

PHP Code:


<div>



    <h1>Test</h1>

    

<?php foreach ($posts as $post): ?>



    <h2><?php echo $post->title; ?></h2>

    <?php echo $post->content; ?>



<?php endforeach; ?>



</div>

Which outputs:

Code:

<div>
    
    <h1>Test</h1>
    

    <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>

    <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>

    <h2>Test Post</h2>
    <p>Some content here...</p><p>Some content here...</p><p>Some content here...</p>
    
</div>

Template file now looks bit ugly but I guess there's no other way. Compromise.

**Daniel0** · Dec 2, 2008 12:55

Originally Posted by SJH

I used to think that before I started developing large web applications. Trying to spot a bug when the source code is neatly indented is a godsend, trust me.

You can use a tool like tidy to tidy it up. Example:

Code:

degeberg ~ # echo "<div><h1>Test</h1><ul><li>item 1</li><li>item 2</li></ul></div>" > test.html
degeberg ~ # tidy -iq test.html
line 1 column 1 - Warning: missing <!DOCTYPE> declaration
line 1 column 1 - Warning: inserting missing 'title' element
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 3.2//EN">

<html>
<head>
  <meta name="generator" content=
  "HTML Tidy for Linux (vers 1 September 2005), see www.w3.org">

  <title></title>
</head>

<body>
  <div>
    <h1>Test</h1>

    <ul>
      <li>item 1</li>

      <li>item 2</li>
    </ul>
  </div>
</body>
</html>

You could also run something like mod_tidy on your development server.

**risoknop** · Dec 2, 2008 12:55

Originally Posted by risoknop

I know but then it looks bad in the template file.

And by the way that didn't work either. Seems like my editor needs and extra empty line in code to indent properly.

I'm using Komodo Edit 5.

User Tag List

Thread: Intending the outputted HTML

Thread Tools

Display

Intending the outputted HTML

Bookmarks

Bookmarks

Posting Permissions