All I wanted to do is create a shortcode that will print (or echo or return – whatever you want to call it) the post ID of the current post.

So I would type something like: [mypostid]

and when the post was saved it would display just the post ID like: 1234

I tried using ‘the_ID’ and ‘get_the_ID’ and even $id, but none of those things worked.

I couldn’t find a straightforward answer to this question so I’m going to share the solution here. It’s really simple!

How to display the post ID in a shortcode:

You can put the code for this function in to the functions.php file of your theme, or preferably, add it to a plugin (details below). With a plugin you won’t lose the functionality of your shortcode if/when you change your WordPress theme.

*It’s a good idea to make a general Custom Functions plugin that is specific to your website and you can use it to house all these little extra functions that you will accumulate over time.

Here’s the basic code for the post ID shortcode:

//[thepostid]
function thepostid_func( $atts ){
         global $post;
         return $post->ID;   
}
add_shortcode( 'thepostid', 'thepostid_func' );

And below is the code to make a plugin out of this function. You should add this code to a plain text file called something like ‘my-custom-functions-plugin.php’, then either upload it to ‘wp-content/plugins/my-custom-functions-plugin/’ via FTP or, add the my-custom-functions-plugin.php file to a .zip file and upload it using the upload feature on the WordPress ‘Add New’ plugin page.

<?php
/*
Plugin Name: My Custom Functions
Plugin URI: http://yourwebsiteaddress.com
Description: A custom site functions plugin for yourwebsiteaddress.com
Version: 1.0
Author: Your Name Here
*/
 
//[thepostid]
function thepostid_func( $atts ){
         global $post;
         return $post->ID;   
}
add_shortcode( 'thepostid', 'thepostid_func' );

So, once you’ve added the code to your theme or plugin, you can simply type [thepostid] in to any post or page and voila! – the post ID will be displayed.

Thinking maybe it was a one off server error I checked some other posts – they were all 404 too! Scary!

Assuming it might be caused by a plugin I had recently deactivated (I’ve been making an effort to clean up my plugin usage lately), I immediately went to the Plugins page and there I noticed a highlighted note about WP Super Cache being deactivated because I needed to save the settings.

I had recently updated WP Super Cache and I must have been in a hurry because I didn’t notice this note at the time.

I re-configured the settings and activated WP Super Cache and thankfully – no more 404 errors!

I think my posts were probably out of action for about a week so this could be very damaging to active blogs (luckily this was on one of my less active websites).

If you’re seeing all of your posts getting 404 errors and you’ve recently updated or installed WP Super Cache, you could be seeing the same error – so go ahead and check your settings!

“Unable to create directory uploads/2013/04. Is its parent directory writable by the server?”

I immediately went to my FTP program and changed the permissions on the uploads directory to ’777′ – this didn’t fix it.

So I started googling to see if this was a known error and how it could be fixed. Other people were having the error and it was suggested that people go (in the WordPress admin panel) to Settings > Media and change the setting so that files are not stored in date based folders.

Doing this made me realise what the actual error was – I had changed hosting servers a few months previously so the file path was no longer right! I had forgottten about the change and expected WordPress to just keep working as normal.

In the ‘Store uploads in this folder’ section of the Media > Settings page I updated the setting to my new server path:

home/myaccount/public_html/mynewpath/wp-content/uploads

and all is well

(*Update: As of WordPress version 3.5 there is no longer a ‘Store uploads in this folder’ option in the admin panel. There is a handy plugin from ‘RVOLA’ here that should do the trick: wp-original-media-path/ and some other suggestions in the comments below)

I thought I’d make a quick post about this here on my blog just in case it’s helpful to anyone else who has this problem. Hey we all forget things from time to time!

Dogs for adoption

Although I have fond memories of working on this design, the main issue that bugs me about it now is the logo being on the right hand side of the page. This is a web rule I would be extremely hesitant to bend nowadays!

The site was created using Quick.CMS software which allowed the animal rescue owner to easily update and manage all the content from the admin panel.

It’s incredibly simple to do and I’ve found for most of my recent projects it’s been much more helpful to have 3 columns of information on the home page instead of just the 2.

So without further ado, here’s…

How to add another widget area to the Twenty Twelve front page template in a child theme

You only need to add (or edit) 3 files to make this change, and they are:

functions.php
sidebar-front.php
style.css

First, we’ll add the following code to functions.php to register our new widget area (also known as a sidebar).

If you already have a functions.php file in your child theme you want to add this code anywhere between the opening <?php and closing ?>. If you don’t already have an functions.php file in your child theme, create a new file and put the code below between an opening <?php and closing ?> and upload it to your child theme directory.

*Change ‘my-child-theme’ to your child theme directory name

1
2
3
4
5
6
7
8
9

	register_sidebar( array(
		'name' => __( 'Third Front Page Widget Area', 'my-child-theme' ),
		'id' => 'sidebar-front-third',
		'description' => __( 'Appears when using the optional Front Page template with a page set as Static Front Page', 'my-child-theme' ),
		'before_widget' => '<aside id="%1$s" class="widget %2$s">',
		'after_widget' => '</aside>',
		'before_title' => '<h3 class="widget-title">',
		'after_title' => '</h3>',
	) );

Next, we’ll add the code that displays your widget area on the front end of your site. Copy sidebar-front.php from the Twenty Twelve theme and add it to your child theme, then above this line:

1

</div><!-- #secondary -->

add this code:

1
2
3
4
5

	<?php if ( is_active_sidebar( 'sidebar-front-third' ) ) : ?>
	<div class="third front-widgets">
		<?php dynamic_sidebar( 'sidebar-front-third' ); ?>
	</div><!-- .third -->
	<?php endif; ?>

Then upload your new sidebar-front.php to your child theme directory.

Now, we’ll add some code to the stylesheet to tell the theme how the widget area should look. In the default Twenty Twelve stylesheet we have one widget area to the left and one to the right, instead we want three in a row.

This code is added in the media-queries section so that it displays the three areas in a row on wide browsers but remains a single column when viewed on mobiles and other small devices (with this new third column being displayed underneath the original 2).

*Note about Internet Explorer and CSS media queries:
All versions of Internet Explorer prior to version 9 DO NOT support media queries. To get around that you can use twenty twelve’s handy IE stylesheet, stored in css/ie.css – copy that folder and file to your child theme then add the CSS code below to that file, but without the first 2 lines and without the closing ‘}’

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17

/* Minimum width of 600 pixels. */
@media screen and (min-width: 600px) {	
	.template-front-page.two-sidebars .widget-area .front-widgets, 
	.template-front-page .widget-area .widget:nth-child(even),
	.template-front-page.two-sidebars .widget-area .front-widgets + .front-widgets {
		float: left !important;
		width: 30.3% !important;
		margin-left: 1.5% !important;
		margin-right: 1.5% !important;
    }
	.template-front-page .widget-area .widget:nth-child(odd) {
		clear: none !important;
	}
	.template-front-page .widget-area .widget:nth-child(3n+3) {
		clear: right;  
	}	
}

Now go to your widgets page in your admin panel and add some widgets to see how it looks. Have fun!

If you find any issues with the code or need any help do feel free to leave a comment below.

I designed and developed the website, built on Quick.CMS software, and designed the promotional logo/flyers/posters etc. for the festival.

This one is all about volunteering with animals and it’s a ‘stepping-stone’ site which will hopefully help to raise the profile of the target organisation – Rescue Helpers Unite.

Blogging & Search Engines

By posting regularly at the VolunteeringWithAnimals.co.uk blog, I hope we can ensure that we appear on the first page in google for our desired keywords and terms. It’s a tough market as there are a lot of sites out there about volunteering with animals.

But it’s not all about search engine rankings – I also hope to make the site a valuable resource for anyone interested in volunteering, where they can find out more about animal transporting, animal fostering, homechecking, fundraising etc. Most of the pages include a comment area where people can ask questions and give us feedback too.

A picture is worth a thousand words

Most of the images (or perhaps all of the images now that I think about it) used on the site are genuine volunteers photo’s that have been submitted by them for use in promo materials. There are some great photo’s that I hope will really be of help in getting people interested in the subject – much more so than stock photo’s which, whilst being an invaluable resource, can sometimes give off an air of ‘phoney-ness’ (that may be a made up word).

Price was also an issue when it comes to photo’s. For pro-bono charity projects, it’s much better to be able to use good quality, genuine and FREE photo’s of volunteers, rather than some boring stock photo.

Design – less is more

The design for Volunteering With Animals is simple and easy to navigate, and includes some of the colours from the ‘Rescue Helpers Unite’ palette, complementing but not completely emulating the colours used on the main website/forum.

The basic design on this site isn’t anything that’s going to blow people’s socks off, but that wasn’t the intention. The focus is on the content with this one.

The site will include posts about charity website designs, website hosting, domain names, free email newsletters, free forums, social networking for charities, free photo galleries and videos, plus lots of other bits and bobs.

After working on lots of charity website projects over the last few years I’ve come across loads of really useful, free or low cost tools and ideas, and I wanted to be able to share my experiences and suggestions with as many charities as possible.

Often I see organisations paying more than they need to for cost-effective websites and hosting etc. and by keeping these costs low, charities can use more of their hard-earned fundraising income for the purpose of their charity.

Websites For Charity is still in the early phases but over the coming months I’ll be adding more content and I hope that over time the site will grow in to a valuable resource with a wide range of topics covered.

I was given a basic brief and some screengrabs of other sites they liked the look of and off I went. I thoroughly enjoyed working on the site and I think the finished design came out quite close to how they were hoping it would  (well it’s 3 years on and they’re still using it so hopefully that’s a good sign!).

It was a site built on a basic CMS (quick.cms) with a minimal design with lots of whitespace, focusing the users attention on the content. I think it adequately fit with and portrayed their ‘brand’ to the public.

So, following on from that project 3 years ago, earlier this year the Friends of Akitas Trust contacted me again to see if I’d be interested in working on an updated version of their site, something more modern and with more features.

Of course I jumped at the chance. I’ve volunteered for the Trust previously by transporting Akitas to their foster homes on a few occassions, so I know they are a great rescue and that makes working on their web design projects even more enjoyable to me, because I know I can produce something that will be of benefit to them and ultimately the dogs they are caring for, plus I get to incorporate images and info on dogs in to the site. As a huge dog lover myself this combines my passions – animals and web design – so I really enjoy my work.

The idea for the new site was again to keep the design minimal (white background) and make use of their signature colour, a striking red from their logo.

The site is now close to complete, built on WordPress which I consider to be the best choice for most sites due to it’s versatility and ease of use, but especially for charity sites who can really benefit from the ‘free’ price tag.

After the site is up and running online I will get some screengrabs posted here for all to see (together with some more items from my portfolio which is noticeably lacking on this site), but I won’t show off until it’s ‘live’ as I wouldn’t want to spoil the suprise

Got an animal rescue or charity web design project you’d like me to work on? Feel free to leave me a comment or contact me. Thanks!