How to style Misty Look

How to get rid of “Comments are off” and “Comments are closed”

As nice as the WordPress Community Features are, some of us aren’t using them. And as such, we can dispense with those messages. To do so, we need to amend a couple of files – the first one is index.php:

<p class="postmetadata"><?php _e('Posted in','ml');?>
<?php the_category(', ') ?> | <?php comments_popup_link(__('No Comments &#187;','ml'), __('1 Comment &#187;','ml'), __('% Comments &#187;','ml'),'',__('Comments Off','ml')); ?></p>

This code calls several php functions to which arguments are passed within the ‘single ticks’. See the last one that says ‘Comments Off’? Change that to ” and no message will be displayed on your front page anymore.

If you click on a single post however, the message “Comments are closed” will still be displayed. To eradicate that, have a look at the comments.php file:

<!-- If comments are closed. -->
<p><?php _e('Comments are closed.', 'ml'); ?></p>

Same thing again, change ‘Comments are closed.’ to ” (i.e. nothing in those ‘single ticks’).

Image Captions

By default, Misty Look displays the File Name instead of its Caption when you’re viewing a standalone image. Since Richard has a lot of pictures on his site, we had to change that. The file responsible is called attachment.php – about half way down there’s this bit of code:

<div class="entry">
<p class="<?php echo $classname; ?>"><?php echo $attachment_link; ?><br /><?php echo basename($post->guid); ?></p>
<?php the_content(); ?>

The second line generates the file name so let’s comment this out first (or delete it). Next we need to find a way to display the image caption underneath the image. The easiest way to do this is to have a look at a Theme that does this and borrow a bit of code – and nothing could be better than the default Twenty-Ten theme.

Put this bit of code right underneath the previous bit:

<!-- This is borrowed from Twenty-Ten -->
<p class="attachment"><a href="<?php echo $next_attachment_url; ?>" title="<?php echo esc_attr( get_the_title() ); ?>" rel="attachment">
<?php $attachment_size = apply_filters( 'twentyten_attachment_size', 900 );
echo wp_get_attachment_image( $post->ID, array( $attachment_size, 9999 ) ); // filterable image width with, essentially, no limit for image height.
?></a></p>
<!-- This generates the Caption -->
<div class="entry-caption"><?php if ( !empty( $post->post_excerpt ) ) the_excerpt(); ?></div>

Only the last line generates the caption, but the previous code formats the image nicely so we’ll leave it.

Now when someone clicks on a tumbnail image, the Title will be the image title, and underneath you’ll see the Caption.

Make the image wider

If you’re clicking on an image in a gallery, it may get displayed smaller than you may like. Let’s fix that! Have a look in your style.css file and add the following code at the bottom. The width tag – you’ve guessed it – will be the width of your image. Adjust it to your liking:

/* fix Image Width */
.smallattachment img {
width:600px;
height:auto;
}

Spacing Child Pages in the Sidebar

Something’s not quite right with the margins between pages and child pages. By default, a child page is displayed closer to its parent page than the next child page. It would be much nicer if the Parent Pages would be spaced out as they are, but that Child Pages receive less whitespace in between. Add the following code to the bottom of your style.css file to make it look lovely (thanks to Richard Allingham for this fix):

/* fix Child Pages */
#sidebar ul ul ul li {
margin: 0;
padding: 0;
}

Forget those Feeds

If you’re not a big fan of RSS Feeds, and you con’t feel th eneed to mention them, here’s how to get rid of them both. Have a look at your header.php file and find this code section:

<div id="feedarea">
<!-- remove Feed Display
<dl>
 <dt><strong><?php _e('Feed on','ml');?></strong></dt>
 <dd><a href="<?php bloginfo('rss2_url'); ?>"><?php _e('Posts','ml');?></a></dd>
 <dd><a href="<?php bloginfo('comments_rss2_url'); ?>"><?php _e('Comments','ml');?></a></dd>
</dl>
-->
</div><!-- end id:feedarea -->

I’ve commented out the areas you don’t need – you can delete the entire section if you like.

Eternal Happiness 😉