On a recent client project I needed client editable columns at the bottom of the WordPress front page. There seemed no logical way to do it within the TinyMCE editor without using a plugin and tables for layout (bah EVIL) so I decided to use custom fields and the following code. I am sure there are more robust and prettier ways of doing this but here is my solution.

  <?php if (is_front_page()) : ?>
    <ul class="featuredServices">
    <?php for ($i = 1; $i <= 3; $i++) : ?>
      <li class="<?php echo ($i == 3) ? "col-last" : "col"; ?>">
        <h3>
          <a href="<?php echo get_post_meta(get_the_ID(), "Col$i Link", $single) ?>">
            <?php echo get_post_meta(get_the_ID(), "Col$i Title", $single) ?>
          </a>
        </h3>
        <p>
          <?php echo get_post_meta(get_the_ID(), "Col$i Text", $single) ?>
        </p>
      </li>
    <?php endfor; ?>
    </ul>
  <?php endif; ?>

All the site editor has to do is edit the custom fields named Col1-3 Title, Text and Link and the code displays the data as an unordered list which can be styled as columns. An improvement would be do add the ability to do a varying number of columns as the number of columns is hard-coded into the theme but it wasn't necessarily for this project and would just have added another custom field to confuse the editor.

Please let me know what you think via the comments and if you have any suggestions for improving the code / doing it in a different way that would be great too.

- @Prydie