New style hooks for WordPress Theme Developers in WP e-Commerce 3.7.5

The latest version of Instinct’s WordPress e-commerce plugin uses the WordPress body_class filter to add classes to the HTML body tag.

WP e-Commerce 3.7.5 adds the following styles to the body tag:

  • wpsc
  • wpsc-home
  • wpsc-single-product
  • wpsc-single-product-id
  • wpsc-category
  • wpsc-category-id
  • wpsc-group-id
  • wpsc-shopping-cart
  • wpsc-transaction-details
  • wpsc-user-account

These extra classes will give you more flexibility when designing themes for WP e-Commerce.

Where are these classes included?

Included in every WP e-Commerce page.

Included on the main WP e-Commerce shop page.

wpsc-single-product & wpsc-single-product-id
Included on single product pages. The wpsc-single-product-id class allows you to set css rules for a single product based on the product id.

wpsc-category & wpsc-category-id
Included on category and individual product pages. The wpsc-category-id class allows you to set css rules for different categories. As these classes are also applied to single product pages, if a product appears in more than one category you could style a product page differently depending on which category you click through from.

Included on category and single product pages. The group id is set based on the group in which the current category resides.

Including on the shop cart checkout page.

Including on the transaction details page displayed after a successful purchase.

Including on the WP e-Commerce user account pages.

Ideas how to use these classes in your WP e-Commerce theme…

  1. Style a special product differently using wpsc-single-product-id.
  2. Style products in a sale category to display differently using wpsc-category-id.
  3. Create a group for brands with brands as sub-categories and differentiate this view from your standard product categories using wpsc-group-id.

Ben Huson