I decided to convert to Shaun Inman’s simple URL shortener Lessn, which is a self hosted script available for free! Now I have this handling my links and have managed to not only integrate it with my WordPress install but I can also track my views via Mint, here’s how…

Setting Up Lessn

1. Create a new database on your Web Host
2. Download Lessn here and unzip the files.
3. Open config.php and amend to include your database details, a login username and password and save the file.
4. Upload the full lessn folder via FTP.
5. Visit http://domain.com/lessn/-/ to start shortening URL’s*

*Please note that the lessn folder can and probably should be renamed to something shorter. For example, I use /s/-, which gains me an extra 4 letters. Make sure you rename the folder before step 5.

Setting Up WordPress To Work with Lessn

Now we have Lessn working and you have a self hosted method for creating short URL’s not relying on anyone else, we can integrate it with WordPress thanks to the WP-Lessn plugin by Jay Robinson. This plugin simply creates a short URL using Lessn when a post is published and saves it to a custom field that can then be displayed on your post page wherever your wish.

1. Download the plugin here.
2. Upload wp-lessn directory to /wp-content/plugins/ directory.
3. Activate the plugin.
4. Go to the WP Lessn submenu underneath the Plugins menu.
5. Enter the location of your Lessn installation (eg. http://domain.com/lessn/-/).
6. Enter your Lessn API key, which can be found on your Lessn homepage (see image below).
7. Click Save

Now, fingers crossed if everything has been setup right then when you save your next post you will find a custom field type called wp_lessnd_url just under the trackbacks section on your edit post page.

Integrating Lessn Into Your Post Pages

Next step is to use this within your site to allow users to tweet your post using the shorter URL. To do this we will need to first add a Tweet This button or link to your single page template linking it straight to Twitter like this…

<a href="http://twitter.com/home?status=STATUS TO GO HERE" title="Tweet this post">Tweet This Post</a>

Notice where I have put STATUS TO GO HERE, this is where we will need to add the post title and the short url that users can then Tweet straight to Twitter. To add the title this is pretty straight forward, we just use the_title template tag that comes with WordPress, like so….

<a href="http://twitter.com/home?status=<?php the_title(); ?>" title="Tweet this post">Tweet This Post</a>

Next step is to add the short URL that users will see on Twitter and be able to click to see the post. Now we call the wp_lessnd_url to display this but we also need to add a backup incase there isn’t a short URL setup for this post. For this backup we will use the_permalink template tag. Using a simple if statement, this is how we achieve it…

<a href="http://twitter.com/home?status=<?php the_title(); ?> <?php if(get_post_meta($post->ID, "wp_lessnd_url", true)) { echo get_post_meta($post->ID, "wp_lessnd_url", true); } else { the_permalink(); } ?>" title="Tweet this post">Tweet This Post</a>

Thats all thats to it! I know bit.ly links are nice and compact but for me, been able to shrink from…

http://designwoop.com/2010/04/show-me-whatcha-got-html-5-vs-flash-showcase/

To this…

http://designwoop.com/s/3a

Mean’s I can still promote my brand Design Woop but still allow room for the post title in my Tweets. Now when I click on the Tweet This button that I created previously I get taken to Twitter and the post title and short URL are already there and I can just hit Tweet! Boom!

Have Mint?

If you also have Mint installed on your site then you can install Shaun Inmans Lessn Pepper to allow tracking of each URL.

Let me know if you have any trouble installing Lessn Pepper as I won’t be going over it in this post. Any other questions or problems then leave a comment below.

Here are some related posts:

• How To Make Your Theme WordPress 3.0 Compatible
• How to Add Twitter @anywhere in WordPress
• HOW TO: Integrate Google Buzz Into Your WordPress Blog
• Tutorial: Display your Latest Tweet on your Website
• Working with Custom Fields in WP

jQuery Growl

Visit Source: http://labs.d-xp.com/growl/

Growl the popular software for Mac (and Windows now) has now been made into a neat little jQuery plugin allowing you to alert your users in the same manner the Growl software does.

Showcase of Buttons in Web Design

Visit Source: http://vandelaydesign.com

Vandelay Design posted this great article showcasing many button styles in web design. A great bookmark for inspiration when your struggling to come up with some of your own!

35 Beautiful E-Commerce Websites

Visit Source: http://www.smashingmagazine.com

Another showcase here this time E-Commerce websites. Smashing Magazine posted this beast displaying 35 beautiful E-Commerce websites. Another great bookmark!

60+ Free Clean, Simple Minimalist WordPress Themes

Visit Source: http://www.tripwiremagazine.com

Trip Wire posted this article showcasing 60+ free WordPress themes, mostly minimalistic in style. If your new to Web Design but want to start blogging etc then this is a great place to start looking for a sweet WordPress theme.

30+ PSD Files (Books, Notebooks, Magazines)

Visit Source: http://ledesigne.com

LeDesigned (A blog I recently started subscribing to as they are constantly pumping out great articles daily) posted this awesome article and a great resource containing 35+ PSD Books, Notebooks and Magazine files.

Superb Jquery CSS Image Effects and Tooltips Tutorials

Visit Source: http://www.designzzz.com

Designzzz pulled together this amazing post of jQuery plugin/effects. If your like me and always trying to find them cool plugins you’ve previously come across in the past but can’t remember where you saw them well this is one to bookmark!

20 Fonts Ideal for Big and Powerful Headings

Visit Source: http://webdesignledger.com

Another great post from Web Design Ledger to finish of the post! This post looks at 20 fonts that are ideal for big and powerful headings! Franchise and Nevis are my favourites!

Right thats it for this week, as I am off on holiday so got lots to do but next week I will have plenty for you!

Here are some other posts:

• Lost Finale Explained Well!
• WP .XML Test Data Import
• Tutorial: Display your Latest Tweet on your Website using SimplePie
• Tutorial: Display your Latest Tweet on your Website
• (Nerd)Press Theme Released

Beginning

To begin with and before I even touched my Self Conclusion (SC), I logged into my web hosting account and setup the new domain, created my new database and installed the latest copy of WordPress. Once this was done, I ran through the WP installation.

Next I logged into my current database that SC was using and backed the whole lot up exporting it to a .sql file. Although WP offers an Export/Import function I have had difficulty with it on previous occasions and there is also a limit on what file size you can import. Finally, take a full backup of your WP files which will include any custom themes, images, plugins, etc.

Uploading

Now take these backed up files and upload them to the new WP installation keeping the locations the same (for eg. If you have images in the root of your directory they will need to be in the root of your new directory). You don’t need to log into the WP admin area yet because once you transfer over the old database it will sort out all the users/posts/active plugins etc the whole lot just like you are used to from your existing domain. Once all the files are in place, log into your new database and drop all the tables in the database then import the sql from the old site that you have previously saved. This should import all your tables for you and populate them with all your settings.

Here is where the first tricky bit comes in. Whilst you are still in the database open the table wp_options and update the siteurl to the new URL (as shown in the picture below) of your website and save it.

Now login to your new URL WP admin area (http://www.domain.com/wp-admin/) using your old username and password that previously worked on the old site. Once you are logged in you should see all your posts, comments, plugins, etc.

Head to Settings page and make sure WordPress address (URL) and Blog address (URL) are both correct to the new URL. Once they have been changed should they need to then your blog should be up and running (nearly).

Configuring

Hopefully you have made it this far with me and no errors at which point we will need to check through each of the posts to make sure there arn’t any links pointing to the old URL. Thankfully there is a plugin which will do this all for you! The plugin Velvet Blues Update URLs is available for download here. Upload the plugin and activate it and follow the instructions. Its basically like a search and replace tool and very simple.

Whilst I am talking about plugins, it might be worth mentioning that if you are running Google Sitemap plugin that you will need to tell it to recreate your sitemap as it will still be using the old one with all the wrong URL links.

Redirecting using .htaccess

Now you have your new blog up and running as if it were the old one but with a new shiny URL you will need to make sure any users from the old site get redirected to the new URL. There are many ways in which this can be done but as I have alot of bookmarked links and posted my links in many places I needed to ensure that any link from selfconclusion.co.uk would redirect to my new URL and keep the same structure (for eg. http://selfconclusion.co.uk/test would go to http://designwoop.com/test).

After searching around I came across a great post from Nish Vamadevan over at fnode.com where he explains how to do this. On the root directory of your old domain, you will need to create a .htaccess file and put the following inside….

# BEGIN WordPress
RewriteEngine On
RewriteCond %{HTTP_HOST} ^www.olddomain.com
RewriteRule (.*) http://www.newdomain.com/$1 [R=301,L]
# END WordPress

This should hopefully do the trick! Make sure you change the domain names to your and give it a full test and make sure but for me it was spot on so thank you Nish for your great post!

Final Tidying Up

Were almost there now, just a few bits to sort out if you use feeds or analytics then this will also apply to you. Obviously both your analytics script and your feed links will be wrong as they will be pointing to your old URL. For me, I use Google Analytics and all I needed to do was log into my account and ammend the profile to the new address. With Feedburner, again I logged into my account and updated the address, I was too scared to change my feed URL incase I was to lose my subscribers so for now it is still called selfconclusion but I will look into this someday soon!

Right that should be it! I hope this has been helpful for you, if you have any problems then post a comments and I will do my best to assist you!

Here are some related posts:

• WordPress Fat-Loss Diet to Speed Up And Ease Load
• Best Resources for Learning WordPress Development
• Integrating Lessn with WordPress to Create Future Proof Short URL’s
• 40 WordPress-Powered Websites With Awesome Designs
• How To Make Your Theme WordPress 3.0 Compatible

My original aim was to get this out much earlier and for anyone following my progress on the theme, well, you may have thought it was never gonna be released! I guess I have been nervously putting off the release, with it been my first theme for release I have been worrying about the kind of response it was going to get from everyone. Lucky enough, to date, I have had 110 downloads via this link (cheeky plug right there), and I am delighted to say that feedback has been wicked! Thank you for your kind words and feedback and thanks to the few Twitter peeps who nicely tested the theme out before its release!

So…whats next for (Nerd)Press?

Well good question! I am going to hold off for a little while just see how the feedback continues, and wether or not any bugs appear, then the aim is to start integrating more features such as Gravatar support as well as several other more popular WordPress themes. I also am going to tweak a whole bunch of different color schemes, something which was actually recommended to me that I thought would be a great idea. If you have any color specific versions you would like to see then please leave your comments for me, as well as any features you would like to see / think (Nerd)Press is currently missing.

(Nerd)Press on Twitter

Thats right, (Nerd)Press has its very own Twitter account which can be found at http://twitter.com/nerdpress so make sure you follow me to find out the updates as and when they happen. You can also contact me at http://twitter.com/stugreenham.

Thats all I’m going to say for now, but thank you again to anyone who has downloaded my theme and / or left me feedback! If you have yet to try out the theme then make sure you visit http://nerdpress.co.uk for more details as well as a working live demo of the theme itself!

Update
Version 1.02 has been released, fixing one or two minor issues/bugs, please upgrade from http://nerdpress.co.uk if you have experienced any issues. Thanks again!

Here are some other posts:

• Lost Finale Explained Well!
• WP .XML Test Data Import
• Tutorial: Display your Latest Tweet on your Website using SimplePie
• Tutorial: Display your Latest Tweet on your Website
• (Nerd)Press Theme Released

Hopefully if your reading this you have some understanding of how WordPress works, and fingers crossed you are aware of the WP Loop that pulls your posts to display on your site. If you are not familier with the Loop then this page will be very usefull to you in your quest to conquer WordPress (http://codex.wordpress.org/The_LoopClick).

You can define a custom field for each post and set its value to be anything, for example, a URL of an image you want to display, a URL of a site you wish to link to, or just some random text. Okay, this may not make sense yet, but the easiest way to explain, is to show you how I use the Custom Fields on Self Conclusion.

So first things first, where do I use these ‘Custom Fields’ on my site? Well when you visited my blog you will have noticed the featured section of at the top of the page just below the Twitter section. This currently displays three posts, along with an image, and a short excerpt of what it contains. Custom Fields are used here to display the Image for that particular post. You may be wondering why can’t I just call the images I want to display manually and change them as and when I write a new feature post? Well this method isn’t as effecient removes some of the dynamicness (not sure if that is a word by the way) of your site. Lets face it, we use WP to allow us to manage our content better!

How do we do it then Stu? Well it is really easy, first you need to assign a custom field, in my case a link to a thumbnail image that I want to display above the post title and excerpt.

In the Custom Field section you have two options that require your attention, the Key and the Value. The Key can be anything, but its a good idea to keep it fairly simple as you need to call it later on, try call it something relevant. Think of the Key value as a variable name, so for this example I will call it post_image because suprise suprise I am going to be using it to display the post image! (clever I know). In the Value field you need to put whatever it is you want to display, in this example a URL which links to an image. Once you have filled in both parts, click on ‘Add Custom Field’.

Next we need to ammend the WP loop to include this new field on your site. Before I implemented an image to my feature posts, I just had the Loop pulling the Title and the Excerpt, and my code looked like this…

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

<div class="feature">

<p class="feature-title"><a href="<?php the_permalink() ?>" rel="bookmark"
title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></p>

<p class="feature-preview"><?php the_excerpt(); ?></p>

</div>

<?php endwhile; ?>

We need to add a bit of code for the custom field. The key part is the get_post_meta part, because this calls the custom field and outputs what you set in the WP Admin area, in this case it will output http://designwoop.com/images/posts/image1.jpg. Notice the post_image, this needs to be set to the name of your custom field which you should have set earlier. Finally, we need to place the code around an image src tag to ensure the image is displayed on the page, see below…

<img src="<?php echo get_post_meta($post->ID, "post_image", true); ?>"
alt="Permanent Link to <?php the_title(); ?>" />

Very simple indeed! Now when I add this bit of code into my WP Loop you get the following…

<?php if ( have_posts() ) : while ( have_posts() ) : the_post(); ?>

<div class="feature">

<img src="<?php echo get_post_meta($post->ID, "post_image", true); ?>"
alt="Permanent Link to <?php the_title(); ?>" />

<p class="feature-title"><a href="<?php the_permalink() ?>" rel="bookmark"
title="Permanent Link to <?php the_title(); ?>"><?php the_title(); ?></a></p>

<p class="feature-preview"><?php the_excerpt(); ?></p>

</div>

<?php endwhile; ?>

Here is what you see on screen in my case…

Well thats about it for now, but let me know if this has come in handy for anyone. It really is a simple process and so easy to implement on your website. If you have used custom fields on your WordPress site then leave a link in the comments.

Here are some related posts:

• WP .XML Test Data Import
• Integrating Lessn with WordPress to Create Future Proof Short URL’s
• How To Make Your Theme WordPress 3.0 Compatible
• HOW TO: Integrate Google Buzz Into Your WordPress Blog
• WordPress Fat-Loss Diet to Speed Up And Ease Load

I use Lorem Ipsum to generate text to bulk out my design and give me a more realistic feel of how it will look live, which is great. When I come to integrating the site into the WordPress CMS I end up left with a kind of ‘blank canvas’ containing just the default ‘Hello World’ post! Having to continuously create fake posts/categories/tags/comments to check it all works within WP is well, Very Frustrating :(

For anyone else who has the same problem as me, this ones for you. Download the .XML linked below and import this into your WordPress installation and problem is sorted, the .XML will import the following:

• 5 Pages, with full content
• 10 Posts, with content, including Tags, Categories and Excerpt
• 21 Unique Tags
• 11 Unique Categories
• 10 Unique Comments, including several from the ‘Tester’ user (Administrator)
• 7 Default Links
• 1 Post (under category ‘Bullet List’) contains a Bullet List
• 1 Post (under category ‘Numbered List’) contains a Numbered List
• Various Lengths on each posts content and title

If you are not familiar with Importing an .XML file into WordPress then follow this quick guide (based on the 2.6 version of WP)

1. Unzip the .XML from the downloaded archive
2. Log into your WP administration area (http://www.sitename/wp-admin)
3. Select Manage from the main menu
4. From the Manage sub-menu, select Import
5. You will be provided with a list of Blog types you wish to import from, select WordPress from the bottom of the list
6. Next select Browse
7. Locate to the .XML you downloaded from the link below, select Okay
8. Finally, select Upload File and Import

Any problems let me know, but should be fairly straight forward! Finally here is the download link:

Download: WordPress XML Import | Help spread this post by Digging It

Here are some related posts:

• Working with Custom Fields in WP
• Integrating Lessn with WordPress to Create Future Proof Short URL’s
• How To Make Your Theme WordPress 3.0 Compatible
• HOW TO: Integrate Google Buzz Into Your WordPress Blog
• Finally.. A Sync between Google and iPhone