Making the Site

Pete and I decided to use WordPress for the new version of our site, after the super minimal previous version.

I spotted that the new version of WordPress gave a new thumbnail feature that I was very keen to utilise:

http://markjaquith.wordpress.com/2009/12/23/new-in-wordpress-2-9-post-thumbnail-images/

I was interested in using the Thematic Theme Framework, but also wanted to add custom typography, via the new CSS Fontface feature, beautifully explained in the article linked to below:

http://nicewebtype.com/notes/2009/10/30/how-to-use-css-font-face/

Particularly great is the @font-face kit generator, linked to in the article. As for font conversion, after downloading X11 for OS X, I downloaded the superlative and free font utility, FontForge.

I used this post to learn how to remove the side bar from the site for non-front pages, and the following code to generate the front page:

<?php
/*
Template Name: HellicarAndLewis Front Page
*/

global $options;
foreach ($options as $value) {
 if (get_option( $value['id'] ) === FALSE) { $$value['id'] = $value['std']; }
 else { $$value['id'] = get_option( $value['id'] ); }
 }
?>
<?php get_header() ?>

 <div id="container">
 <div id="content">

 <?php thematic_navigation_above();?>
 
<?php get_sidebar('index-top') ?>

<?php thematic_above_indexloop() ?>

<?php
$my_query = new WP_Query('category_name=Selected&posts_per_page=-1');    

while ($my_query->have_posts()) : $my_query->the_post();  // Start the loop:
// This is just what we decide to show in each post ?>
<div id="post-<?php the_ID() ?>">
 <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
 <?php thematic_postheader(); ?>
 </a>
 <div>
 <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
 <?php the_post_thumbnail();  // we just called for the thumbnail ?>
 </a>
 <?php the_excerpt();  // we just called for the excerpt ?>
 <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
 <p>Read more...</p>
 </a>
 </div>
 <?php thematic_postfooter(); ?>
</div><!-- .post -->
<?php
endwhile; // loop done, go back up?>

<?php thematic_below_indexloop() ?>

<?php get_sidebar('index-bottom') ?>

 <?php thematic_navigation_below();?>

 </div><!-- #content -->
 </div><!-- #container -->

<?php thematic_sidebar() ?>
<?php get_footer() ?>

And the category pages for Blog and Project posts:

<?php
/*
Template Name: HellicarAndLewis Projects Page
*/
global $options;
foreach ($options as $value) {
 if (get_option( $value['id'] ) === FALSE) { $$value['id'] = $value['std']; }
 else { $$value['id'] = get_option( $value['id'] ); }
 }
?>
<?php get_header() ?>

 <div id="container">
 <div id="content">

<?php the_post() ?>

<?php thematic_page_title() ?>

<?php rewind_posts() ?>

 <?php thematic_navigation_above();?>

 <?php
 $my_query = new WP_Query('category_name=Project&posts_per_page=-1');    

 while ($my_query->have_posts()) : $my_query->the_post();  // Start the loop:
 // This is just what we decide to show in each post ?>
 <div id="post-<?php the_ID() ?>">
 <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
 <?php thematic_postheader(); ?>
 </a>
 <div>
 <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
 <?php the_post_thumbnail();  // we just called for the thumbnail ?>
 </a>
 <?php the_excerpt();  // we just called for the excerpt ?>
 <a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>">
 <p>Read more...</p>
 </a>
 </div>
 <?php thematic_postfooter(); ?>
 </div><!-- .post -->
 <?php
 endwhile; // loop done, go back up?>

 <?php thematic_navigation_below();?>

 </div><!-- #content .hfeed -->
 </div><!-- #container -->

<?php thematic_sidebar() ?>
<?php get_footer() ?>
This entry was posted in Blog. Bookmark the permalink. Post a comment or leave a trackback: Trackback URL.

One Comment


  1. Fatal error: Uncaught Error: Call to undefined function ereg() in /home/jglewis/webapps/oldhandlwp/wp-content/themes/thematic/library/extensions/comments-extensions.php:84 Stack trace: #0 /home/jglewis/webapps/oldhandlwp/wp-content/themes/thematic/library/extensions/discussion.php(9): thematic_commenter_link() #1 /home/jglewis/webapps/oldhandlwp/wp-includes/class-walker-comment.php(180): thematic_comments(Object(WP_Comment), Array, 1) #2 /home/jglewis/webapps/oldhandlwp/wp-includes/class-wp-walker.php(146): Walker_Comment->start_el('', Object(WP_Comment), 1, Array) #3 /home/jglewis/webapps/oldhandlwp/wp-includes/class-walker-comment.php(140): Walker->display_element(Object(WP_Comment), Array, '5', 0, Array, '') #4 /home/jglewis/webapps/oldhandlwp/wp-includes/class-wp-walker.php(371): Walker_Comment->display_element(Object(WP_Comment), Array, '5', 0, Array, '') #5 /home/jglewis/webapps/oldhandlwp/wp-includes/comment-template.php(2094): Walker->paged_walk(Array, '5', 0, 0, Array) #6 /home/jglewis/webapps/oldhandlwp/wp-conte in /home/jglewis/webapps/oldhandlwp/wp-content/themes/thematic/library/extensions/comments-extensions.php on line 84