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?

wpsc
Included in every WP e-Commerce page.

wpsc-home
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.

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

wpsc-shopping-cart
Including on the shop cart checkout page.

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

wpsc-user-account
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