The third WooCommerce drop of 2012 has arrived and it’s a big ‘un! Dynamic Pricing, 6 gateways and a chance for more developers to get involved in the WooCommerce project.

There have been a few grumbles about the relentless Payment Gateway onslaught, and this week is no different with six new gateways (we know you love them really). But we’re also extremely excited to launch Dynamic Pricing, developed by Lucas Stark.

Payment integration is one of the single biggest barriers to some users choosing WooCommerce. Established companies rarely want to change banks / service providers so if we don’t have a gateway which suits a users business, they can’t choose WooCommerce – which we think is a crying shame! So while they may not be so exciting, they’re absolutely vital to the ongoing growth and development of WooCommerce as an eCommerce platform.

Dynamic Pricing

Easily apply bulk discount rules to specific products/user roles

WooCommerce Dynamic Pricing solves pricing scenario problems we’ve had enquiries about since version 1.0. It gives you a powerful system for creating four different types of bulk discounts and price adjustments. The add-on has been designed to give store owners flexibility in controlling prices that no other eCommerce solution offers.

• Advanced Product Pricing
• Advanced Category Pricing
• Simple Category Pricing
• Simple Role Based Pricing

Lucas has pulled out all the stops and delivered an extremely comprehensive product which is, for me, one of our most exciting to date!

View this WooCommerce extension

Attention Developers! Join the ninja clan!

With WooCommerce’s incredible growth, our third party developer community has evolved to the point where some weeks (this one included) all the extensions we deploy have actually be built by our collaborators. We’re extremely proud of the relationships we’ve built and that so many talented people have taken the initiative to approach us about building WooCommerce products. They’re all a big contributing factor in the momentum WooCommerce has generated.

We’d like to nurture that community further now so we’re encouraging more developers to get involved. You can read all about how it works and submit your interest over here.

1. Join the ninja clan
2. Sell WooCommerce extensions you build with us
3. ????
4. PROFIT!!!!

Apply to become a WooCommerce collaborator

Skrill

Skrill (otherwise known as Moneybookers)  is one of the world’s largest online payment providers currently being used by over 100,000 merchants.

View this Payment Gateway

Pagamento Digital

Pagamento Digital is a popular Brazilian payment provider. This plugin allows your store offer Pagamento Digital as a payment method.

View this Payment Gateway

PagSeguro

PagSeguro is a Brazilian gateway, but accepts foreign transactions. With this gateway your WooCommerce store can offer PagSeguro as a payment method.

View this Payment Gateway

WorldPay

WorldPay’s affordable online payment gateway enables your business to accept all major payment methods and credit and debit cards, including Diners, MasterCard, Visa, Amex, Maestro and JCB.

View this Payment Gateway

Payment Express

Payment Express is a Visa and MasterCard certified solution, developed by DPS, which facilitates electronic payments seamlessly from multiple access points.

View this Payment Gateway

FirstData

For an ever-changing marketplace, First Data’s online payment solutions enable you to easily provide customers with more payment options and safer transactions for a more satisfying shopping experience. At the same time, you’ll be able to increase revenue, reduce costs and minimize risks—to realize your full business potential.

View this Payment Gateway

Just in case you missed it

Last week we launched a brand new WooCommerce documentation suite and public forum – well worth checking out if you haven’t yet done so!

Over the past few months we’ve been settling into our new head office here in Cape Town South Africa, where 7 of us work from. Only three doors down from our old one that we outgrew in August last year… It has certainly taken a good amount of time to design, decorate and renovate the office, but we are finally happy with the end result.

A couple weeks ago a good friend of mine, the multi-talented Mr Andrew Schär offered his film skills to showcase our new offices and our day-to-day activities. He’s done a stellar job of documenting WooHQ in an epic cinematic style. We really appreciate his time and effort in trying to make us look good, and really recommend his services.

Best viewed fullscreen and in HD.

Andy has written a blog post on his new site detailing the process and technical details of his SLR videography experiment.

Our next challenge – documenting all 17 team members spanning the world!

Our first business theme in 2012 is a beauty! We wanted to let Chris Rowe have another chance at out-designing his previous top seller at WooThemes; Simplicity. So it goes without saying that we have high hopes that Whitelight will be our most popular business theme to date. In addition to being a very clean and great design, here are some of the reasons we think this theme will be big…

Responsive is the way forward!

Whitelight follows in the footsteps of our previous new releases and is fully responsive, meaning it works on any browser, be it on your computer, iPad or mobile device. The featured slider is full width and responsive, and also has an alternative normal width option if you prefer that.

The alternative normal width featured slider

Modular homepage for increased flexibility

We’ve also made an effort to make the homepage modular, so you can easily add or remove the sections you want, and also order them through a widgetized area.

Modular custom homepage

WooCommerce compatibility from the start

Whitelight also has a WooCommerce child theme which enables full compatibility with WooCommerce and adds a custom module to hightlight latest additions to your shop on the homepage.

WooCommerce compatible through child theme

That’s not all the features of Whitelight, so be sure to head on over to the theme listing page and also check out the demo!

Child Theme Features

• 
  

  WooCommerce Ready

  All WooCommerce features are accounted for and have been scrupulously styled to match the parent themes aesthetic.

• 
  

  Woo Approved

  Developed in-house by WooThemes designers and developers, this product ensures guaranteed compatibility with our market leading eCommerce plugin; WooCommerce.

• 
  

  Awesome Support

  As with all of our products, after your purchase you’ll gain access to our acclaimed premium support.

Unique Features

• 
  

  Fully Responsive Design

  The design will scale to fit on all browser widths/resolutions and on all mobile devices. Go ahead and scale your browser window and see the results.

• 
  

  Featured Slider

  A custom homepage featured slider to showcase your important content, all powered by the fully responsive FlexSlider, which makes it usable on mobile devices. There is also a normal width slider option in addition to the full width as seen in the demo. You can put images or videos in the slider posts, and link the slider posts to another page or website.

• 
  

  Custom Homepage

  In addition to the featured slider, the theme has an optional Intro Message area and also a customized widetized homepage where you can add and re-order the included custom modules (Features, Portfolio, Blog Area, WooCommerce) with the Woo Module widget.

• 
  

  Powerful portfolio management

  The portfolio section of Whitelight is powered by it’s own custom post type with a summary of your portfolio viewable on the homepage module and then it’s own portfolio page template to house the rest.

• 
  

  WooCommerce Goodness

  Whitelight is compatible with WooCommerce through the Whitelight WooCommerce child theme. Read all about the benefits of WooCommerce here.

• 
  

  Custom Typography

  You can customize the typography in the theme to suit, and there is full support for Google Fonts in the font selector. By default it is using the Signika font.

• 
  

  Custom Widgets

  In addition to the widgetized homepage and the custom module widget, the theme has 1 widgetized sidebar and up to 4 footer widgetized areas, and as always comes with custom Woo Widgets (Ad Space, Blog Author, Video/Embed, WooTabs, Subscribe & Connect, Search, Flickr and Twitter).

• 
  

  Styling Options

  The theme includes a variation of alternative styles which you can preview in the demo, and also has styling options for background color/image and setting link and button color.

Version 1.4 is perhaps not a massively exciting release for the end-user, but for developers it’s a biggy. We’ve re-written large chunks of code, made all round refinements to the plugin for our plans going forward, and optimised performance levels. Of course we’ve added some more bells and whistles too, but a lot of the changes are under the hood.

New Functionality

• Support for multiple and stacked (compound) taxes
• Multiple taxes shown in order total tables

Compound taxes can now be added and are worked out on the fly on checkout.

• Option to re-order shipping methods
• Category widget improvements – ‘order by option’ and an option to show current children only
• Added local pickup and local delivery shipping methods (thanks Patrick Garman)
• International shipping method (based on flat rate)
• Locale options for country address formatting and checkout fields
• Random products widget, thanks to Geert De Deckere

Front-end + Theming Optimizations

For designers and developers using WooCommerce you’ll find 1.4 specifically useful for a number of reasons:

• Improved default theme
• Moved many shortcodes (contents) to template files for easier customisation
• Added a simple, basic method of adding woocommerce support to themes using a woocommerce.php file based on page.php containing woocommerce_content()
• Coupon entry form on checkout (optional)
• If there is limited stock, quantity input plus button won’t go higher
• ‘Chosen’ selects for country/state select inputs (optional) – a great script for improving usability

UI improvements with select boxes.

Backend + Integration

• Admin interface improvements

The product data has had a clean up and is now presented in neat tabs.

• Piwik tracking – requires http://wordpress.org/extend/plugins/wp-piwik/
• Option to ‘Delete all variations’
• Tweaked visibility settings and made them more clear
• Added address meta to users panel
• Added address data to edit users screen
• Enabled product custom fields panel

Geek stuff

If you choose to not read any of the below, read this – we’ve made many minor fixes and improvements.

More payment gateway extensions

Last, but certainly not least we have 2 more payment gateway extensions available as of today, with some big extensions in the pipeline nearly ready.

MercadoPago

The MercadoPago gateway plugin allows to offer your clients any payment method supported by MercadoPago, including credit card, Pago Fácil / Rapipago and much more. MercadoPago is the payment gateway behind MercadoLibre, the largest e-commerce provider in Latin America.

Moneris Gateway

Moneris processes more than 3 billion credit and debit card transactions a year, for over 350,000 merchant locations across North America.

Moneris is primarily used by Canadian merchants looking to accept Visa, Mastercard, Discover, and AMEX through a wide variety of options.

An all new user guide

Along with the release of WooCommerce 1.4 today also see’s the release of our new plugin documentation and user guide, efficiently housed in a Wikeasi theme installation. It’s a work in progress that we plan to constantly update, but already it’s a huge improvement over our existing user guide and codex pages.

The Wikeasi powered WooCommerce docs.

A WooCommerce public forum

After careful deliberation we have also decided to open a forum available to all WooCommerce users who freely register on the WooCommerce page to download the plugin. This forum will be supporting the growing community BY the community. We cannot guarantee any support to be provided by our ninjas, however we will be closely monitoring the threads for bugs, feature requests and general recommendations. We have a lot of active, passionate, and helpful WooCommerce users who would love to interact with likeminded individuals. Perhaps you’ll even meet someone in the forums to work on a WooCommerce extension or a client project together? You never know.

The reason for the price increase, apart from the obvious being inflation after keeping our prices constant since 2007, is that we now support a portfolio of 123 themes, the mothership that is WooCommerce, and have a team of staff of 18.

Existing active club members monthly subscription costs will not be increased

After much deliberation and number crunching the good news for active club members is that we are grandfathering you into the new pricing, meaning you will not be experiencing any prices hikes and will remain on the same monthly charge as you have been previously. Your monthly membership fees will remain the same until you cancel your membership.

The new club membership pricing.

Disclaimer: This is a long post, but we guarantee you it’s worth the read. This is a big theme release!

Today sees the release of a theme that us at WooHQ are hugely excited about – partly because we have a few musicians within the team who are passionate about creating something they’d personally want to use, and partly because of the innovative modules and thinking that has gone into it’s development. We present to you “Unsigned”.

Unsigned was initially designed by our friend Ryan Downie, given the brief to design a modern version of one of our older, popular themes Backstage, all the while keeping it hugely versatile in it’s usage, for individual artists/musicians, as well as bands – spanning all genres of music. A rather difficult brief, but one that we feel Ryan mastered.

Matt was tasked with it’s development, whilst Mike given the design to slice, dice and convert into a WooFramework powered theme. As a musician and former band manager and promoter, Matt approached Unsigned from that angle- what would a musician, band manager or promoter want out of the theme?

The Unsigned homepage, as customized on our demo. And boy can you customize it, thanks to complete widget and theme option control!

One of the major advantages of Unsigned is that the artist has full control over the technical nature of their exposure. Whether aware of it or not. The functionality has been developed to anticipate the needs of the artist without them needing to add any extra code. This same approach is working hand in hand with our modular coding approach, making the code both smooth for the customer and swiftly maintained by us. The Unsigned homepage is almost completely controlled by widgets and a comfortable amount of theme options, making it hugely flexible (something a couple users expressed interest for yesterday).

A run down of the various Unsigned modules

Let’s jump straight into the various theme modules as there is a lot to cover.

Custom post types power Unsigned, and the Events module has a particularly clever one.

Events Module

Woo – Events caters for the management and listing of events (gigs, festivals, etc). Events can be grouped into categories (club, concert, gig, festival, etc) and tours. These are both custom taxonomies.

An event’s status (upcoming, right now, past) is determined by it’s start and end date/time. It’s also possible to select one of these types for display in the Woo – Events admin, making it easier to view snapshots of your events calendar.

The events module and the widget that controls it. Simple.

Woo – Events comprises 3 widgets as well as a custom “Tours” page template. The widgets are for listing events, tours and tour dates for a specific tour. The events widget has options to display all events, upcoming events, past events, events happening right now, events happening this weekend and events taking place in the current week. The “Tours” page template serves as an archive for listing tours listed on the website. These link to tour detail pages where the events for that tour are listed.

Venue listing, as well as links to online ticket sales and an optional price display are available per event.

Discography Module

Woo – Discography is where the artist manages their album releases. Albums can be sorted into categories and comprise a cover image, unique catalog ID and a release date.

Each album has an audio player facility, which uses tracks that are uploaded directly when adding or editing an album. The tracks can be re-ordered and managed using native WordPress lightbox windows.

The album widget placed on the homepage, and it's controls.

If WooCommerce is installed, each album displays an option to link the album to a product. If there is a link made, an “Add to cart” button for that product will be displayed alongside the album on it’s detail screen, as well as in the Woo – Albums widget. View the shop page here.

An album page with WooCommerce enabled allowing you to sell your albums.

Woo – Discography contains two widgets: the Woo – Albums widget, to list either all albums or albums in a specific category, and the Woo – Album Player widget, to list and play tracks from a specific album using an HTML5 audio player.

Photos Module

Woo – Photos is where the artist manages their photo galleries. Galleries can be sorted into categories and comprise a cover image and photo management section.

The photo management section is a clear and easy to use box in the admin that allows for the quick uploading, management (re-ordering, etc) and inclusion of images in the gallery. This is then applied on both the gallery detail screen and the Woo – Photos widget.

Woo – Photos comprises two widgets: Woo – Photos and Woo – Galleries. Woo – Photos displays either all photos with a limit count, or X number of photos from a specific gallery. Woo – Galleries displays a list of the photo galleries available, either in a specific category or across all categories.

Videos Module

Woo – Videos is where the artist manages their embedded videos from YouTube, Vimeo, etc. Videos can be sorted into categories and comprise an optional posterframe and an embed code field.

Woo – Videos consists of a single Woo – Embed widget which, similarly to our standard widget, displays videos from a specific video category or all videos, allowing for the quick switching between videos.

Band Module

Woo – Band Members is where the artist manages their band member profiles. This section consists of a “mugshot” image and a “role” field, for the band member’s role in the band (eg: guitarist).

Woo – Band Members also consists of a single “Band Members” page template, which lists the band members in the order they are set to display in. This can be re-arranged via the “order” field when adding/editing a band member.

Their band biography is added via the content area. View the biography page here.

Homepage slider

As has become a favourite within our themes, Unsigned includes Woo – Slides. This module displays a large background image on the homepage, as well as a slider content area above the content on the homepage. When navigating through the slider, the background image fades to the appropriate image.

These images are added using the slider image field.

Soundcloud integration

Woo – SoundCloud is a bridge between Unsigned and SoundCloud. When a username is specified, the system connects to SoundCloud and retrieves the user’s tracks and playlists.

These two content types are outputted via a Woo – SoundCloud – Playlist widget for specific playlists and a Woo – SoundCloud Tracks widget to display individual players for specific tracks.

This data is cached for a month to avoid speed issues and high load. It is possible to force-refresh this data via a “Refresh SoundCloud Data” button, made available under the “SoundCloud” tab in “Theme Options”.

Changing to a light style is as simple as flicking a switch. As is changing the logo. Transforming the look.

Adding a different background image, and using some different homepage widgets further demonstrates the theme's flexibility. All done in 5 minutes...

Spend another 5 minutes with the theme and can you imagine the possibilities? You have to view the theme listing for more information on all the functionality packed into this theme. Trust us!

Let us know what you think! Any feedback is welcome in the comments below.

P.S. Thanks to Captain Stu for letting us feature them and their awesome music in our demo.

Unique Features

• 
  

  Fully Responsive Design

  The design will scale to fit on all browser widths/resolutions and on all mobile devices. Go ahead and scale your browser window and see the results.

• 
  

  Custom Homepage

  The homepage is one hugely flexible layout powered by widgets and theme options  that allow you to enable/disable each and every module. You can really create whatever layout you like, highlighting only your most important information to grab your site visitors attention.

• 
  

  Events Module

  Caters for the management and listing of events (gigs, festivals, etc). Events can be grouped into categories (club, concert, gig, festival, etc) and tours. An event’s status (upcoming, right now, past) is determined by it’s start and end date/time. It’s also possible to select one of these types for display in the Woo – Events admin, making it easier to view snapshots of your events calendar.

• 
  

  Discography Module

  Discography is where the artist manages their album releases. Albums can be sorted into categories and comprise a cover image, unique catalog ID and a release date. Each album has an audio player facility, which uses tracks that are uploaded directly when adding or editing an album. The tracks can be re-ordered and managed using native WordPress lightbox windows. You can then link WooCommerce products to albums allowing you to sell your albums easily on your site!

• 
  

  Photos Galleries Module

  Photos is where the artist manages their photo galleries. Galleries can be sorted into categories and comprise a cover image and photo management section. The photo management section is a clear and easy to use box in the admin that allows for the quick uploading, management (re-ordering, etc) and inclusion of images in the gallery. This is then applied on both the gallery detail screen and the Woo – Photos widget.

• 
  

  Videos Module

  Videos is where the artist manages their embedded videos from YouTube, Vimeo, etc. Videos can be sorted into categories and comprise an optional posterframe and an embed code field.

• 
  

  Featured Slider

  As has become a favourite within our themes, Unsigned includes Woo – Slides. This module displays a large background image on the homepage, as well as a slider content area above the content on the homepage. When navigating through the slider, the background image fades to the appropriate image.

• 
  

  Soundcloud Integration

  Woo – SoundCloud is a bridge between Unsigned and SoundCloud. When a username is specified, the system connects to SoundCloud and retrieves the user’s tracks and playlists. These two content types are outputted via a Woo – SoundCloud – Playlist widget for specific playlists and a Woo – SoundCloud Tracks widget to display individual players for specific tracks.

• 
  

  WooCommerce Goodness

  Unsigned makes full use of WooCommerce allowing bands.musicians to sell their albums and other merchandise. We’ve painstakingly married the theme and plugin to provide a seamless front-end experience. Every single one of WooCommerce widgets has been lovingly styled to match the beautiful design, as has each key component of the plugin such as the product categories, product descriptions, cart, checkout and user account sections. Read all about the benefits of WooCommerce here.

• 
  

  Custom typography

  You can customize the typography in the theme to suit, and there is full support for Google Fonts in the font selector. By default it is using the Bitter font.

• 
  

  Custom widgets

  The theme has a Homepage widgetized region (on install it comes pre-populated with the default modules that you can then overwrite), 1 widgetized sidebar and up to 4 footer widgetized areas. In the demo we’ve used our powerful sidebar manager to then overwrite the default sidebar widgetized region with a unique sidebar for the homepage. This is entirely possible for you to do with any widgetized region. This theme comes with a wealth of custom Woo Widgets like an Album, Events, Galleries, Photos, Soundcloud, and videos widgets, as well as the usual custom Woo Widgets (Ad Space, Blog Author, Embed/Video, WooTabs, Subscribe & Connect, Search, Flickr and Twitter). WooCommerce also includes an array of custom widgets.

• 
  

  Styling Options

  The theme includes a default dark style, as well as light style which you can preview in the demo, it and also has styling options for the transparency of modules, background color/image and setting link and button color.

Open up your theme’s functions.php and add this simple function:

// add the function to the init hook
add_action( 'init', 'woo_add_googlefonts', 20 );

// add a font to the $google_fonts variable
function woo_add_googlefonts () {
	global $google_fonts;
	$google_fonts[] = array( 'name' => 'Lustria', 'variant' => ':r,b,i,bi');
}

Here we have added a font name called Lustria, and after adding this it will show up in your options panel.

The new font in the typography option

WordPress theme development has, over the years, become a much more involved industry than it was during years past. Themes have gotten more intelligent, more feature rich and, to sum up, far more robust in their offering. It is not uncommon today for a theme to, for example, include an advanced theme options screen for tailoring a theme without code, or a selection of custom-developed widgets to showcase content is a specific manner or of a specific type.

As with scaling in any context, expanding one’s offering is vital to maintaining the status quo and “keeping up” with industry competitors. At WooThemes, this expansion is generally handled within the WooFramework (the engine that powers all of our 120+ themes) by creating and adding features such as a shortcode generator (along with a wide collection of popular shortcodes), a collection of popular social widgets, SEO settings via WooSEO and a system to create custom sidebars via the Sidebar Manager. This expansion is also, at times, handled using our popular “Theme Options” screen, where settings specific to your WooTheme of choice are controlled.

As one can imagine, adding theme option after theme option could easily get out of hand, creating a long list of settings you’d need to run through to customise your theme. This brings us to the question we posed during a development discussion at WooHQ last year- “are theme options always the answer?”.

The approach

This question has caused us to take a slightly different approach to our theme options and how we approach them. Rather than going through and adding options as we see fit, we’ve taken a stance on adding options as sparingly as possible. This allows us to analyze the theme in full and decide which settings require specific theme options and which settings are, for want of a better word, redundant. Certain settings may not apply in all contexts or to all users of the theme, while others (such as, for example, the ability to activate or deactivate a specific section of the theme’s functionality) is something that applies in all cases.

Along with this approach, we’ve taken a slightly different angle in terms of how the functionality itself is developed. By creating small components and bundling related functionality into either a single file (for small components) or a class (and object) for larger components, we are able to focus on each component individually, ensuring that the specific component in question is approached from the most accurate context.

A practical example

Lets take our Wikeasi theme as a practical example of how we’ve applied these principles.

The Wikeasi default homepage layout

Wikeasi is a WordPress theme based around the creation of a wiki system, built on WordPress. Wiki’s themselves tend to lean towards specific functions such as a table of contents, revision management and display and being able to create bibliography or source references. Wikeasi handles all three of these functions, as well as many more.

In our approach to Wikeasi, we left the theme options to the very end, right after all the functionality was developed, tested and firmly in place. With revision or reference management, for example, it’s quite easy to get carried away and add theme options for every possibility. Is this the answer to an attractive and ultimately, more usable, product? We don’t believe so, no. Fewer theme options allowed us to focus in and ask, “what would I, as a user of this theme, want to change and setup?”. The majority of theme options in Wikeasi (organised into component-specific sections) allow for the activation/deactivation of the specific component and possibly a short notice explaining a feature of that specific component. This means it’s possible to get in and out of the theme options screen quickly, having easily setup and customised your theme without being overwhelmed with theme options.

Enabling The Table of Contents

Other functionalities, such as the customisation of a component’s output, for example, are handled using carefully placed WordPress filters. Using filters, it’s possible to customise the theme to your needs with a short snippet of code, rather than a complex theme option that, perhaps, 8 out of 10 users won’t benefit from.

Has this approach worked?

Yes, it has.

This approach can also be seen within WooCommerce and other popular WordPress plugins. For example, why create a whole interface to add tabs to the “Product Details” box in the WooCommerce admin, when a simple WordPress action hook will produce the same result with a leaner code base?

How do we know this? The numbers speak for themselves.

Wikeasi is, according to PressTrends, powering some 528 websites currently. The number of support queries Wikeasi has received in our forums is roughly 11% of that. We can, therefore, ascertain that this approach works. Scale back on unnecessary theme options in favour of a code-based solution.

Lets not forget the fact that Wikeasi is a feature-rich theme.

Hold on, are we losing functionality?

Quite the contrary. This approach affords greater functionality and flexibility, without the limitation of a theme option. For example, what if we wanted to turn the filter bar in Wikeasi off on a specific section where it was displayed previously (for example, on search results)? With the theme options approach, this would need to be a selection of theme options to enable/disable the filter bar in various cases… this is boxing you in as the user. By changing our approach ever so slightly, we’ve just opened up a whole spectrum of new possibilities.

The “golden age” of theme options is over

To sum up, our approach to theme development is evolving and changing as the industry develops. Minimising theme options used in themes, coupled with careful consideration of a component’s application in the theme and a selective placement of WordPress filters, allows for a richer theme setup experience for our users while still adding a level of flexibility that is possible to hone in on, should you wish to do so.

WordPress itself is about making publishing easy for the end user. Why not echo that ideal within your theme or plugin? Make the initial setup process easy. If the user wishes to delve deeper, add the functionality to allow them to do so.

“Just add a theme option” is a phrase that is steadily becoming somewhat of a “curse word” at WooHQ. Why stick to using theme options when we could do so much more by slightly changing our approach to the code itself?

WordPress actions and filters have been a long-running standard within WordPress itself. Why not hone in on that and take full advantage of the functionality possibilities it offers?

Keep an eye out for this one, folks. The days of “just add a theme option” are slowly moving behind the WordPress community.

Simplify. Work out the kinks. Re-focus.

That’s our plan for 2012, discussed in meticulous detail over the past couple weeks during Magnus’s visit to Cape Town. Exactly what that entails remains top secret for now. What we hope will increase happiness levels amongst our users is our quest to make our support structures more efficient. Working out the kinks.

With 123 themes and 123 theme docs, and other support resources including a knowledgebase, FAQs, a support forum, tutorials and a video library catering for over 130,000 users it’s very much a daunting work in progress that we are tackling one resource at a time. Below details some of the work going on behind the scenes recently.

Talking 2012 strategy with our latest board member - Adii Junior.

Email

Mid last year we implemented Assistly, a customer service system, to manage our pre-sales and administration email. Previously, we simply used Google Mail and thanks to IMAP between myself, Adii and Ryan we managed to keep the mailbox under control and synchronised. We still use Google Apps to deliver our mail, but thanks to Assistly we now have a sexy, fast interface to use, we can assign mail easier, track response times and draw all sorts of interesting reports on customer interactions, resolve email threads, as well as manage our social media channels, like Twitter, without worrying about numerous staff members replying to the same tweets. There are a wealth of other facilities we are yet to tap into, but hope to explore soon.

Capacity wise we now have Ryan in the United States, Sven in China, and Adii overseeing the inbox here in South Africa – covering all time zones helping us deal with the 150+ emails we receive and keep our response times impressively fast, averaging under 3 hours.

Reports gathered thanks to Assistly.

Support Forums

With the launch of our own custom membership system late last year we re-developed our forums. In the short term that meant lots of small bugs and hassles as we took the database structure of bbPress, stripped the unnecessary code and built on top of it. In the longer term it is now meaning we have far more flexibility in terms of how our forum threads are presented, managed, answered and assigned.

The team can now assign topics

Previously we used Lighthouse to track bugs/feature requests and assign to our developers/designers, but that meant logging into another system and no direct automated correlation between a user reported issue and it’s fix. We now have the assignment of threads and conversion into bug reports automated within our forums.

We also have various admin views for quick access to support threads that need attention, and a ninja leaderboard to help encourage the team when they aren’t performing as well as the rest of the team know they are capable of, so we  can pat team members on the back and reward them when they are doing well, and keep track of their targets they have to meet each month.

Useful forum tools and stats available for the team.

We’ve also implemented strict controls on who can post on a user’s thread – only the support ninjas and the user who started the topic. This may seem impractical to some, reporting the same query again, but it helps us keep track of what is resolved, with only the original poster able to open the thread again. Having a closed forum also avoid answers that might be wrong or off topic from other members, which in return ensures that we can deliver proper support from our WooNinjas.

Only topic author can reply to a topic.

A user also needs to wait for a support ninja to reply before they can comment on a thread again. They can of course edit their post, but by limiting further replies allows the support queue to stay in order. Our ninjas try to reply to the oldest posts first and as soon as a follow up post is added to the mix it goes to the back of the queue again = unhappy customer.

After posting, members are asked to wait to avoid bumping threads.

These revisions may sound rather minor, but they’ve had significant results on support levels. We are still struggling with overwhelming numbers of support queries at the moment, but have hired a new support ninja we hope to introduce soon, as well as headhunting a more senior support manager which we have no doubt will help increase capacity and customer happiness levels even further.

Videos

Some of the WP101 titles available to all our users in the support section of the site.

Video tutorials are an important part of our support resources, a more visual learning experience. We’ve recently updated our video library with our good friend Shawn Hesketh’s latest WordPress101 series that can be used by our users to train their clients, or even themselves. The WordPress101 series is geared for WordPress 3.3 so is up-to-date and hugely helpful in getting to know the WordPress system.

And there you have it, a small glimpse into the recent behind the scenes happenings at WooHQ in trying to ensure happy customers, and the often hard graft that entails.

First, lets find a nice home icon. If you go to IconFinder you can search for “home” and find many nice ones. We’re going to use this one, so download that and upload to your site. Use Media->Add New and copy the URL to the image after uploading.

Next step is to use Firebug to inspect a menu item, so you can find the ID of the list element.

Right click the menu item and inspect element to find the ID to use later.

Once we have the ID we can start adding some CSS to custom.css in your theme through Apperance->Editor.

#menu-item-290 {
     margin-left: 10px;
     width: 32px;
}
#menu-item-290 a {
     background: url("http://cdn2.iconfinder.com/data/icons/gnomeicontheme/24x24/actions/redhat-home.png") no-repeat scroll 0pt 0pt transparent;
     text-indent: -99em;
}

The first style targets the main list element, and sets the width to 32px so it’s the same width as the image, and just moves the image 10px to the right.

The second style targets the link or anchor inside the list element, and sets the background of that anchor to the icon. To hide the text we simply move it off the screen with negative text indent.

That’s it! The finished product will look like this:

The Home linnk replaced by a home icon!

From the outskirts it probably seems a little quiet compared to our usual lightening pace of WooCommerce development? Never fear though, inside WooLabs things are seriously heating up with a HUGE amount of time going into version 1.4, that will be one of our most noteworthy updates in our track history. That’s still a couple weeks away, with the exact release date kept mysteriously vague for now. We do however have something to tide you over. 4 exciting new extensions.

A teaser of what to expect in 1.4

As I’ve said it’s not ready yet, but you can start getting excited about it because of a number of reasons that include:

• A new default theme
• Much better and easier to use templating system for beginners
• Local and compound taxes
• Many code optimisations to improve loading time/memory

There’s loads more to it, but we can’t give away all the secrets now can we?

New WooCommerce extensions

This week sees an sms notification system for your online shop and 3 very different, equally powerful payment gateways.

 Clickatell SMS Notifications

Examples of delivery reports for orders

The Clickatell SMS Notifications plugin for WooCommerce allows you to keep you customers updated on the progress of their orders by sending them SMS notifications when their order statuses change. This extension requires a Clickatell Central API account in order to send SMS.

You can also send custom one time SMS messages by going into an order; you have the ability to send the customer a one time SMS message with whatever text you wish.

Developed by Gerhard Potgieter.

FeeFighters Samurai Gateway

This plugin allows you to take payments utilizing FeeFighters’ Samurai Payment Gateway.

Developed by Patrick Garman.

Amazon FPS Gateway

Gain your customers trust by allowing them to securely pay using their Amazon account. Amazon Flexible Payments Service (Amazon FPS) will allow you to accept payments via credit card, bank transfer, and even through your customers Amazon balance!

Developed by Patrick Garman.

PayPal Digital Goods Gateway

This extension offers in-context payment of digital products so buyers never leave your site to pay for an order. After a buyer has purchased once with your site, they can choose to not be required to log in to PayPal for future purchases – one-click PayPal payment, but only with the PayPal Digital Goods extension.

Developed by Brent Shepherd.

Hi, I’m Tom Dent a designer, wed developer and co-founder of Double D Creative a small Cheshire based design studio I run alongside my business partner Tom Denton… hence the name ‘Double D’. We’re not brother’s as someone once thought (very odd), but we’re good friends with a passion and eye for great design and have been creating creative, engaging and functional design for traditional and digital media since we started the company in 2006. We pride ourselves in the quality of our work and attention to detail.

I’ve been working with WooThemes’ themes for the past 3 years and am a huge fan of the functionality and ease of use that the themes allow and the freedom that they give me from a design perspective. FreshNews was my theme of choice until I dived into Canvas which opened up a new world of possibilities.

We were approached by a client who was starting up a new business called Red Hat No Knickers (nothing like that you mucky people!) which is a vintage clothing store that would sell hand picked unique items of clothing. We were briefed to create a logo, branding, marketing material and online store.

The difference with this store to many others is that RHNK would only have one of each product, so rather than having a stock inventory each time a item was sold, that was it – no more! What I needed to do was make it as quick, simple and easy for the client to be able to add new items to the store. I chose the Cart 66 e-commerce plugin (this was before WooCommerce had launched!) as I had used Cart 66 before for another client and I knew that it was an simple and easy system to update.

The client requested a minimal design so I set about creating the Photoshop artwork which was signed off so I could commence the build.

The Red Hat No Knickers homepage design.

The Red Hat No Knickers product page design.

The great thing with Canvas for me is the use of Child Themes, so I only need to work with the files that need editing, rather than having the whole theme structure to work through. Using the Hook manager also allowed me to add in code directly into the header/post etc rather than having to add it to the core file.

The Products Pages

This was setup so that the client could setup a product in Cart 66 and in the then drop in a short code to the main post with the product code number such as [add_to_cart item="1234"], this would then display the ‘Add to Cart’ button or show ‘Sold’ if the product had been sold.

The Red Hat No Knickers products page.

The main image on the page is controlled by the Canvas Custom settings and via Theme Options > Dynamic Images > Single Post – Show Thumbnail. This is selected with the alignment set to left and the dimensions set to 340px by 510px. I added in the below to to the loop-archive.php page to display the image to the correct dimensions on the archive page

woo_image( 'width=340', 'height=510', 'class="rhnk-main"');

So it looks like:

while (have_posts()) { the_post(); $count++;

		woo_image( 'width=340', 'height=510', 'class="rhnk-main"');
		woo_get_template_part( 'content', get_post_type() );

	} // End WHILE Loop

The rest of the images on the page are just a standard WP gallery, unfortunately the standard WP gallery style sheet is written into the post so it overwrites and values from the theme style sheet. I found the solution at this useful post which involved copying the gallery_shortcode to the themes (Child Theme) functions.php file. You can view the full code here. Then it was just a case of adding the following to the Canvas Child Theme’s style.css file.

.gallery{
height:90px;
margin:20px 0 0 0;
}
.gallery-icon img{
float:left;
padding:2px;
background:none;
width:60px;
height:60px;
border:1px solid #B95;
margin-right:5px;
}
.gallery-icon img:hover{
background:#B95;
}

The last thing to do was add in some social network buttons to the bottom of the page, this was easily done via the hook manager and adding the standard Facebook and Twitter buttons code to the woo_post_inside_after hook so that it would be executed at the bottom of the post and inside the Div tag.

Making it Responsive…

From reading the WooThemes case study by Kris Millsap on how he made Adii.me into a responsive theme I decided to get stuck into Less Framework.

Again using the hook manager I dropped in the following code to pick up the less framework file to the wp_head hook.

Some of the LESS Framework CSS used to get RHNK responsive.

The Red Hat No Knickers responsive design

I followed the same method as Kris, in working with Firebug and identifying the class or id that needed changing then amending the less framework file and as Kris mentions in his post it wasn’t as big a job as I’d anticipated, it still took a while to do though (around 16 hours).

Thank Woo for Canvas

I’m really happy with the results of my first development with Canvas and have already updated another site (getiton.org.uk a NHS site) with Canvas and I’m in the process of completing another, much more complex site as well.

When you have more than 100 themes, it is expected that some users will want to port features between themes. One of the most requested is the Twitter feed that you can see in the header of the Busybee theme. In this tutorial you’ll learn how to add a Twitter feed to the Canvas header using hooks.

The final result

A Twitter feed in the Canvas header

The finished code

add_action('woo_header_inside','woo_add_twitter_header', 10);
function woo_add_twitter_header() {
?>

<div id="twitter_header">
 <ul id="twitter_update_list_header"><li></li></ul>
 <?php echo woo_twitter_script('header', 'woothemes', 1); ?>
 <div class="fix"></div>
</div>

<?php
} // End woo_add_twitter_header()

What the code does

1. Instruct the “woo_header_inside” hook to look for and execute the “woo_add_twitter_header()” function.
2. Setup a wrapping DIV tag with an ID of “twitter_header” and the necessary markup for the Twitter script. The PHP code outputs the Twitter feed for the username woothemes (replace with yours).

Lastly, the CSS and the Twitter bird image

If you test the code right now, you should see the Twitter feed in your header above your logo. We don’t want it there so we must add some CSS to the “custom.css” file.

#twitter_header { float: right; padding-left:60px; background:url(images/twitter_bird.png) no-repeat left center; }
#twitter_header a.time { display:block; }

The CSS above adds the Twitter bird image as background to the left of your “twitter_header” DIV and also some padding or the image would be under your text. The last line moves the time to a new line.

You can grab the Twitter bird HERE. Add it to your theme “images” folder or, alternatively, replace “images/twitter_bird.png” with the full url to the image (example: http://your-site.com/twitter_bird.png).

We’d like to think that the early success of WooLabs (and in particular that of WooCommerce) isn’t so much of a surprise to our users – the people who have been downloading it, and extending it with our themes and extensions. After all it’s your support and continued feedback that has helped make WooCommerce what it is today!

45,000 downloads, 52 premium extensions, 16 premium parent / child themes and a growing number of additional free plugins on the WordPress.org repository have helped WooCommerce grow at an incredible pace since launching last September.

We’re delighted with that growth but with it comes additional strain applied to the team in keeping up with our own high standards. So to continue delivering WooCommerce goodness at the same pace and of the same quality we have since launch, the team needs to grow!

We’re looking for an enthusiastic, experienced WordPress developer to join us in ensuring WooCommerce continues one of the very best e-commerce plugins available for WordPress.

You can read all about the role and how to apply over on our jobs board.

Apply for the job!

A General WooCommerce update

The first WooCommerce drop of 2012 is definitely going to be worth the wait. If you’ve been following our 1.4 development branch on Github you’ll have seen a bunch of great features we’re building in. In addition to that, our 3rd party developer pool has grown significantly, and thanks to some efficiency enhancements we’ve made in that regard there are a bunch of exciting developments in the wings, which we can’t wait to launch.

But that’s not all… I’m not going to give away any more details, but 2012 is certainly shaping up to be an exciting year for the WooLabs!

Expect this feature rich dream theme for musicians and bands, designed by Ryan Downie later this month. You might even be able to sell your albums with it…

So 2012 has finally arrived and we are getting back into the swing of things at the speed of Woo…

Shelflife is our first 2012 theme, designed and developed in-house by the talented Mr Cobus Bester, a.k.a. Fresh01. Shelflife is a clean, e-commerce focussed theme with a homepage dedicated to featured, popular and recent products with dedicated spaces for mini-features and promotions powered by their own custom post types, as well as a widgetized sidebar and footer regions. Think of it as a hybrid business and e-commerce theme where your products can be as much or as little a focus as you desire with a dedicated shop page available too.

The shop page with it's dark, prominent sidebar.

It’s default styling is clean, with heavy contrast of blacks, greys and whites with a responsive layout adapting it’s display for your media type and browser width.

The homepage promotions module powered by it's own custom post type.

As you've come to expect with most our WooCommerce themes, the layout will adapt responsively according to different media types..

Let us know what you think! Any feedback is welcome in the comments below.