Resolve Shopp Plugin Categories not Displaying Correctly

Shopp is an easy to use and powerful shopping cart for WordPressI’ve worked with numerous estore services and WordPress Shopping Cart Plugins. Of the WordPress Plugins I like Shopp for the extensive documentation and forums provided. In addition with Shopp it is simple to customize the various PHP files and templates included with Shopp.

Shopp Category 404 Errors

Shopp is not perfect however and occasionally the unexpected occurs. For example I’m currently setting up an Online store for a customer and the product category Pages return an HTML 404 “Page not found” error when using pretty hyperlinks and the latest Blog Posts are returned when using the default WordPress hyperlinks. Weird!

Shopp provides a WYSIWYG icon to add categories or products ... but it doesn't always work.The customer requires that the category views work (i.e. so that people can view all products in a specific category) so the problem must be resolved. As the Website I’m setting up is fairly static a workaround to this is to create a Page and then add a Category shortcode to the Page. In thory this is very simple as we should be able to click the “insert a category or product from Shopp …” icon in the TinyMCE editor (a.k.a. WYSIWYG editor) to add a category but alas this doesn’t work on the new Site I’m building (see image to the left for how the options don’t appear in the ‘pop-up’ window).

Get Category Page to Display Correctly

Fortunately Shopp includes a [category] shortcode so it’s possible to insert a category using the shortcode in place of the “insert a Category …” icon. BUT, this method does have some unintended consequences for the uninformed; your Page may display with all sorts of unwanted bullets and unformatted content. What to do? Well to resolve this problem just insert the HTML below into the HTML (not visual) tab of the the TinyMCE editor and replace the category id with the category id of your choosing.

<div id="shopp" class="category list">[category id="9"]</div>