Image by: vizzzual-dot-com

In building CMS sites for clients, some may require that you offer certain files to be downloaded off their site. A PDF for example, or perhaps wallpapers or other media. Most browsers, correctly, will display these items inline as a new page or tab however for these purposes you need to force the browser to download the item, not display it. Here’s how it’s done.

The Code

Your .htaccess file is the key to getting this done, and here’s the code you need to add:

AddType application/octet-stream .csv
AddType application/octet-stream .xls
AddType application/octet-stream .doc
AddType application/octet-stream .avi
AddType application/octet-stream .mpg
AddType application/octet-stream .mov
AddType application/octet-stream .pdf

You can of course add as many other filetypes to this list as you may require, but you can get the principle from this example.

The basics

You’re basically going to setup a number of if/else statements in your template where you want your header image to appear. The final statement will be an else statement so that if none of the above rules apply, it’ll degrade so that you’ll always have a header image on your page.

You’re going to create a custom field that has the name of the image that you want to use as a header image. You don’t have to add the full path to the image. Since you’re uploading your custom image in the WordPress uploader, it’ll always end up in the same folder and so the path to the image will be entered in the template.

The how-to

So firstly create your image, and upload it to your page.

Then add a custom field called “header” and put the name of the file as the value of the field.

Then open up your template where you want your image to appear and add the following PHP – tailored to work as you need it to…

<? if (get_post_meta($post->ID, 'header', true)) { ?>
	<img src="<? bloginfo('url'); ?>/wp-content/uploads/<? echo get_post_meta($post->ID, 'header', true) ?>" alt="<? bloginfo('name'); ?>" />
<? } else { ?>
	<img src="<? bloginfo('template_directory'); ?>/images/header.jpg" />
<? } ?>

So what you’ve now done, is tell the template to check if the custom field “header” has a value. If it does, then use that value to display your image. However, if the custom field is empty, then it’ll degrade to the second default image that you specify.

And presto: you can now use your WP admin to control header images on each page. This is also a good way to do it because now your client can update/add his header images on his own without having to bug you.

The Template Method

Whenever WordPress needs to display ‘posts’, it uses the single.php template. What we’re going to do, is use the single.php file simply to redirect WP to the template it needs to use.

Firstly, remove all the content from your current single.php file and paste it in (for example) ‘template-blog.php‘. Then create a second file that you’ll use as your uniquely styled template, lets say ‘template-other.php‘.

Then add the following to your single.php file.

<?php
if (in_category('20')) {
   include(TEMPLATEPATH . '/template-other.php');
} else {
   include(TEMPLATEPATH . '/template-blog.php');
}
?>

The above code, is pretty simple to understand. You’re saying that if, the post being viewed is in category ’20′, then use the template specified, otherwise revert to the other template ’30′.

Simple!

You can also string multiple of such statements together using the elseif PHP command, like so:

<?php
if (in_category('20')) {
   include(TEMPLATEPATH . '/template-other.php');
} elseif(in_category('30')) {
   include(TEMPLATEPATH . '/template-unique.php'); 
} else {
   include(TEMPLATEPATH . '/template-blog.php');
}
?>

There’s another method that this can be done.

The Custom Field Method

I’m a big fan of WordPress custom fields and this is another great method you can use to easily assign templates to specific post categories.

What we’re going to say, is ‘if the custom field ‘wide’ exists, then use the specified template, otherwise use the other template. Here’s how it works:

<?php
if (get_post_meta($post->ID, 'wide', true)) {
   include(TEMPLATEPATH . '/template-other.php');
} else {
   include(TEMPLATEPATH . '/template-blog.php');
}
?>

Then when writing/saving your post, all you need to do is add a value of ‘yes’ to the template custom field that you’ll create called ‘wide’ and presto, your single.php file will spot the presence of the custom field and use the specified template.

You can of course also use both the above methods within your template if you want to, for example, add or remove certain areas from your page. You can do this by using if/else statements within your template. Like so:

Hopefully, this’ll give you some more ideas as to how you can further tweak your WP.

Choose a page on their site that you know will be kept throughout the life of their site – Perhaps an ‘about us’ page. Create custom fields for each of their contact details, maybe:

• Telephone: 012 345 6789
• Fax: 012 345 6789
• Email Address: info@site.com

Then, use your special query to call the custom field for each of those

<div id="contactdetails">
	<ul>
		<li>Telephone: <? echo get_post_meta(2, 'telephone', true) ?></li>
		<li>Fax: <? echo get_post_meta(2, 'fax', true) ?></li>
		<li>Email: <a href= "mailto:<? echo get_post_meta(2, 'email', true) ?>"><? echo get_post_meta(2, 'email', true) ?></a></li>
	</ul>
</div>

Note that in this example, ’2′ is the page_id of the about us page. Change this number to whatever the ID is of the page that you use to keep this information.

What are they?

Custom fields are essentially extra fields attached to a post. There’s the key which is the ‘name’ of your extra field. Then there’s value which is pretty self explanatory – its the value of the key that you’ve inserted. You can add any number of values to one specific key, and you can add as many key/value combinations as you like.

Ways of using Custom Fields

Lets say that you’re starting an accommodation listing site, and you have 3 or 4 images for each listing that you’d like to show.

• Upload the first image
• Enter the key ‘images’
• Paste the path to the uploaded image as the value of this key
• ‘Add Custom Field’
• Repeat as many times as necessary

Now you have an array of values assigned to the key ‘images’. Now in your single.php template, you want to show these images. No problems. What you’re going to do, is create a loop that will repeat for as many images as you’ve uploaded. Like so:

<? $images = get_post_meta($post->ID, "images", false); ?>
<? foreach($images as $image) {
echo "<img src=\"".$image."\" /><br />";
} ?>

Alternatively, lets say that you want to have a thumbnail for each entry in your archive.php template. You can combine some crafty CSS with a PHP query to bring in 1 of the images in the ‘images’ array and presto!

Here’s how to display your image:

<div class="thumb">
	<a href= "<?&phpMyAdmin=01d7dd3a1764f33b9145cd20ad99db24 the_permalink(); ?>" title="<? the_title(); ?>"><img src="<? echo get_post_meta($post->ID, 'images', true) ?>" alt="<? the_title(); ?>" /></a>
</div>

*NOTE: The alt tag uses the_title() function which will name your image according to the page/post that its on.

and the CSS:

.thumb {
width:80px;
height:80px;
display:block;
overflow:hidden;
}

The CSS is required because the image that you uploaded is probably larger than what you’d want as a thumbnail. So the overflow:hidden command in the div thats wrapping the image will cut if off to a size that’ll suit you better.