SupportPress has landed – a sweet support desk theme

Good news folks. SupportPress (created by myself and James Koster) is ready to download. It’s our second application style theme built in collaboration with WooThemes and I’m really excited to say that its finally available.

The theme provides you with a completely self-hosted help desk and knowledgebase solution, all built upon the WordPress core. It functions similarly to popular SaaS offerings such as Zen Desk and Tender.

Mobile devices love SupportPress

The front-end is coded with HTML5 and CSS3 (using LESS CSS to aid development and make theming easier), and the design is responsive making it work well on both desktop and mobile devices. As with FaultPress before, this feature has been very well received by the woo community.

Notable features of the theme include:

  • Support ticketing for clients; let your agents deal with support requests
  • Tickets are private; only the client and your agents have access to tickets
  • Knowledgebase functionality, complete with like/dislike buttons
  • Easily turn a ticket into a knowledgebase entry via a button
  • Unique landing pages for agents, clients and guests (plus signup)
  • AJAX powered searching of the knowledgebase and tickets from the dashboard
  • Blog/Alerts for notifying clients with news and announcements
  • Message section for agent communication
  • Responsive design for mobile viewing

Overall, myself and James are very pleased with how SupportPress has turned out and look forward to creating our next application theme 🙂

The demo for SupportPress can be found here, and if your thinking of buying it WooThemes are offering an 11% discount until July 11th by using the code ‘SUPPORTPRESS11′. Enjoy!

CSS3 scale and rotate animation (webkit only)

Have you tried hovering over my logo (up top) in webkit? The animation is a nice effect and is really easy to implement as a progressive enhancement.

#logo a:hover {
    -webkit-animation-name: rotateThis;
    -webkit-animation-iteration-count: 1;
@-webkit-keyframes rotateThis {
    0% { -webkit-transform:scale(1) rotate(0deg); }
    10% { -webkit-transform:scale(1.1) rotate(0deg); }
    100% {-webkit-transform:scale(1.1) rotate(360deg); }

The important part is the ‘keyframes’ chunk – this tells the browser what to animate, and at what point. In my example we start off (0%) with a non-scaled, non-rotated element. We then (at 10%) make it larger, and finally we make it finish (100%) fully enlarged and rotated 360 degrees.

So I decided to move my online home…

…and here we are. I’ve decided to simplify my online presence and change my domain from “Blue Anvil” to something more personal. I’ve spent a lot of time designing a minimalistic, more content focused site which is easier for me to update, and easier for you to find useful information.

You may have noticed that I’ve gone for the Tumblr style of blogging; allowing for full posts but also accommodating smaller updates such as code snippets, quotes, and links. As well as that I’ll be showcasing projects I’m working on (such as the projects I’m doing in collaboration with WooThemes) and any interesting freelance work I do.

Some of your will also appreciate that I’ve spent some time improving the documentation for my plugins, rewriting bits and giving the docs a much more organised format. These will be available from the projects page and will be added over the coming weeks. Handy!

Blue Anvil will stay live for archive purposes, but I’ll be switching off comments and moving important content over here. Thanks for reading and be sure to follow me on twitter or subscribe to the RSS feed for updates.