Increment Numeric Part Of String

Have you ever needed to increment the number which is part of a string. For example if you have an invoice number with the format und001 and want to be able to automatically create the next invoice number of und002 you need to be able to increment the number.

PHP has a built-in way of incrementing either a number or a string simply by placing ++ at the end of the variable.

// Number
$i = 1;


// echo 2
echo $i;

But you can also do this for letters, PHP will increment the variable to the next letter in the alphabet.

// Letter
$a = 'a';


// echo b
echo $a;

Therefore if we have an invoice number of und001 then to get the next number all we have to do is use the ++ syntax to get the next number.

// Invoice
$i = 'und001';


// echo und002
echo $i;

The problem comes if you have a different format such as 001und or invoice-001-und where the invoice number isn't at the end of the string. You need to then search the string for the number of the invoice and set the increment by one. This is where preg_replace_callback function comes in handy, by searching for digits and replacing the number with a plus one.

function increment($matches)
        $length = strlen($matches[1]);
        return sprintf("%0".$length."d", ++$matches[1]);

$invoice = 'invoice001und';

$invoice =  preg_replace_callback( "|(\d+)|", "increment", $invoice);

echo '<p>'.$invoice.'</p>';

This takes the string, searches for digits inside the string and passes these digit values into the function increment in here we return the digit matched plus 1 and return the new number. Now we can increment a number anywhere inside a string.

In a previous tutorial we saw how you can recreate the All Posts table in the WordPress admin area by using the WP_List class in WordPress.

It talks about creating your own table and populating it with any data that you need. It talks about how you can customise the table to behaviour in anyway that is needed by adding different columns to the table, assigning sortable columns to the table, pagination and searching the data, just like you can in the All posts table.

But in this previous tutorial only explains how to create sortable columns on a new table, in this tutorial we are going to look at changing an existing table to apply new sortable columns.

To edit the columns and change them to be sortable we need to use a filter and return is a set of column IDs of what columns we want to be sortable. The filter we need to use is manage_edit-{$this->screen->id}_sortable_columns.

add_filter( 'manage_edit-{$this->screen->id}_sortable_columns', 'manage_sortable_columns');

The below code snippet will change the author column on the posts screen to be sortable.

class Pu_Manage_Sortable_Columns
    public function __construct()
        add_filter( 'manage_edit-post_sortable_columns', array($this, 'manage_sortable_columns'));

    public function manage_sortable_columns( $columns )
        $columns['author'] = 'Author';

        return $columns;

Now you will see that the author column is sortable which is noticeable by the sort arrow appearing next to the Author title on the hover event. Clicking on the author title will now sort the table data by the Author name.

Here is a useful function I use in many of my applications, it will take a URL and see if it's prefixed with a protocol, if it's not then it will add the default prefix to the start of the string.

This function will search for http://, https://, ftp:// and ftps://, if none of them are in the string then we add the prefix to the start of the string.

By default the prefix is set to http:// but you can pass in a second parameter to change the default prefix protocol to anything you want. Read more...

Google web fonts is a huge library of free web friendly fonts you can easily use on your website. The fonts are loaded in to your website with Javascript and display by using font-family property in your CSS file.

<link href='' rel='stylesheet' type='text/css'/>
font-family: 'Oswald', sans-serif;

There are currently over 650 fonts in the library and they are continuing to add more.

Google has an API developers can use to load the font list into your website, allowing users to select a font to use from accessing the API. All your calls to the Google APIs need to be registered with an API key, you can create your own API keys from the developer console.

Google Developer Console

When you have built your site on an open source project like WordPress one of the benefits you get is continuous updates and improvements to the core code.

WordPress aims to release a couple of versions per year, when there is a new version of WordPress available to download there will be a notification bar at the top of your admin area. This notification bar will let you know that your WordPress version is out of date and that you need to update the core code.

WordPress Releases

It is highly recommended that whenever there is a stable release of WordPress to update as soon as possible, just so you are always running the latest code with the latest security updates. Read more...

If you want to instantiate a class in PHP the class must be loaded into your application before you can use it. There are 4 ways you can load a class into your application include, include_once, require or require_once. But when you use this you must define all of the classes that you want to use in your application.

Another option is to use an autoload function which will be called when your application attempts to instantiate a class which isn't loaded.

< ?php
function __autoload($classname) {
    $filename = $classname . ".php";

    if(file_exists( $filename ))

$class = new MyClass();
$class2 = new OtherClass();


There are lots of times when you need to share code snippets, a good example is when you are troubleshooting a problem and need to ask for help. Instead of just explaining the problem you have to someone it's 1000 times easier to show them what the problem is.

I get a couple emails a day from people asking for help with problems they are having with CSS or Javascript. An example would be something like I can't get your code snippet to work...what is the problem? There is no way I'll be able to help with a question like that because I can't see what is wrong or don't know if they have made any changes to the code.

If you are asking help with your code some people will just paste the code to you in an email or on a forum, this is a bit more helpful as I can take this code, run it and see if I can find out what's going wrong. But this relies on me having all the exact code that they're using, which might be lost while copy and pasting code from their editor, to an email, to my editor.

The best way of asking for help with your front-end code is to be able to share your exact code. But this is hard to do as most development problems should occur on your local machine with all the code on your local computer. The solution to this is to use web editor that allows you to share your code and the result, something like jsFiddle or CodePen.

  • Go to jsFiddle or CodePen
  • Enter the HTML, CSS and Javascript.
  • Hit run to test you can recreate the problem.
  • Save to a URL
  • Share the URL

This way the person you are sharing with can see the exact code you are using and can see the same problem you are trying to solve.

Here are some of the services you can use for free to share your code.


jsfiddle jsFiddle


CodePen CodePen



JS Bin

JS Bin JS Bin


dabblet Dabblet

PHP has a few in-built magic method __get(), __set(), __sleep(), __toString() etc. These functions are all really useful but they are not used very often in your day-to-day development, but one magic method is really useful this is the __autoload() function.

This function is automatically called each time you try to instantiate a class but the class can not be found.

When you normally call a class to use in your code you will do something like this. Read more...


Do you have a good way of organising and storing all your different code snippets?

Because I use sublime text 3 as my code editor I used to just store all my code snippets as a snippet in sublime, this was fine if your are always working on one computer but what if you code on multiple computers? You won't be able to take all these code snippets with you.

I've started to change this and have been adding to my profile on Gist and using this to store my code snippets, the benefit of using this means that I can have access to all my snippets from any computer I use. Read more...

Here is a technique about how you can absolute center position an element on the horizontal and vertical in CSS.

Center Images Horizontally

To center something on the horizontal in CSS it's quite easy all you need to do is set the width on the element and apply an auto margin-left and margin-right on to the image. The browser will work out the exact margin on both the right and left side of the image. This will position the image in the center of the parent element just by using the width and the margin properties.

<img src="example.html" alt="Center Images" />
img {
     margin: 0 auto;