Covid-19 Coronavirus Measures

Following government advice, team Creatomatic are working remotely and our office remains temporarily closed during lockdown.

If you require any website updates then please call us on 01461 205437 or email [email protected] with your requests and we will get back to you asap.

We’re continuing to run a full service team throughout lockdown; and we’ll be happy to arrange remote meetings via Zoom/Skype/Google Meet as appropriate.

Contact Details
Emergency contact: [email protected]
Phone number: 01461 205437

Stay safe, folks.

Team Creatomatic x

Close window

Get in touch

Got a project in mind? We’d love to hear from you.
Use the contact form or drop us an email and we’ll get back to you as soon as we can.

Office open Monday to Friday, 9am – 5pm

Tel: 01461 205437
Email: [email protected]


(Out of hours support number: *01461 536 202

*Please note:
This number is for EMERGENCY out-of-hours support only – please email [email protected] in the first instance as this account is monitored regularly)

Creatomatic Ltd
80a High Street
Dumfries and Galloway
DG12 6DW

Company number: SC422843
VAT number: 184828370

One of our team will contact you within 24 hour of sending this form.
Home > Blog > How to > Easy WordPress sprites with CSprite
View all posts

Easy WordPress sprites with CSprite

People don’t like waiting, especially when it comes to loading websites. James, our lead developer has a solution.

James Hall


40% of people abandon a website that takes more than 3 seconds to load

You’ve probably heard that statement before. It’s taken from a report published in 2009 – so the chances are that user expectations are considerably higher as of 2014 – but it does make an important point: People don’t like waiting.

We want to on a site, access the information we need, and go back to our daily lives. If a site is taking to long to load or navigate, I will go back and click on the next site. I’m sure you will do this too. What’s worse is that search engines will  rank you lower down in their search results if your site loads slowly.

As a result, we’re constantly working on ways of reducing load times and slimming down content – which is why we’ve recently launched CSprite, our own image sprite generator plugin for WordPress.

What is an image sprite?

An image sprite is a set of icons or small images merged side by side into one single image. If you have a website with 20 graphics, your browser no longer needs to as the server for 20 images, just one! Image sprites are typically smaller than all the individual images put together too, which is an added bonus.

Take a look at the one Twitter uses (click to view a larger version):


The technical stuff

The most common way to use a sprite is to insert a placeholder div with a class and use CSS’s background and background-position to extract the single image. The only problem with this is that it slow and tedious to position images and get their type out coordinates – it makes it even more of a pain to make image changes too.

This is where CSprite comes in. Simply drop all the images into your theme’s ‘csprite’ folder and the plugin will generate a sprite for you, and set up all the CSS classes into WordPress.

Try CSprite now

Download it here.


More stories like this


View all posts