Updated April 19th 2009
If you are using the latest version of the WordPress Shopping Cart plugin, version 3.12.6, please read my latest post on the subject:
“Revised File for Fake Grid View”
The following post is helpful but the file to be downloaded was written for version 3.6.7.
I use wpsc when I mean WordPress Shopping Cart.
Here is a re write of an earlier post on “faking” Grid View(for wordpress shopping cart plugin).
My earlier post did not take into account, beyond styling the page with CSS, the functions in homepage_products_functions.php and how the output of this file varies from the real grid view product display.
So if you have purchased Grid View you should be able to use the Cart Icon button in the Post or Page editor to insert a wpsc category into a Post or Page and have it display just like Grid View,right? I thought so. But it doesn’t work that way.Inserting a single category into a page results in a page that looks a lot like grid view but acts quite differently.
Some key differences between using homepage_products and the grid view
Inserting a wpsc category into a Page(shortcode is for homepage_products) displays a thumbnail gallery of all products from one category and their product titles. If you use “Full” your page will not look like Grid View. If you don’t select Full you will get close to faking Grid View ( if you have the correct CSS to do so). But a Fake Grid View page has one little problem:the thumbnail image does not link to the single product display page(like in Grid View).Instead,it links to the thumbnail image.Which means a thumbnail image will pop up where a full size image should.
By making changes to homepage_product_functions.php I got what I wanted: an exact copy of the real Grid View.
Example:The Stone Street Press
The home page contains one product group.
The changes I made to homepage_products_functions also removes variations and add to cart buttons. I wanted my fake grid view to look as much like the real grid view and add to cart and variations also made the page look cluttered and we all know real grid view doesn’t show these bits…
edited:On later versions of this plugin, paid Grid View lets you choose what you show in the grid –mccormicky.
Download my edited homepage_products_functions.php
FTP to your plugin folder and rename,download for safe keeping the official version of the file you already have in the wp-shoppingcart plugin folder.
Rename homepage_products_functionsphp.txt to homepage_products_functions.php and upload to your wp-shoppingcart plugin folder.
Keep in mind this will not magically transform your shop to Grid View! It will only work on wpsc categories inserted into a page.And you will need to work on the CSS to fit your image sizes.
The store I worked on uses images with height of 200 and a width of 150 so the following CSS works fine for this store.For your store you’ll probably need to make adjustments to width and height and margins.
Paste into the shop theme’s css or your main theme’s css file:
[css].homepage_products{overflow:hidden;width:100%;position:relative;}
.homepage_products a.wpsc_product_title{color:#000!important;font:bold 11px arial!important}
.homepage_products .category_view_product{position:relative;width:150px;height:275px;float:left;
margin:8px 3px }[/css]
I edited the div to a class rather than an id so that multiple categories could be inserted in one page or post and the page would validate. Because we all know you can only use an id once in a page,right?
Disclaimer:
I should add please do not regard my work as a way to rip off the plugin developers.I did not intend it to be used for this purpose. Buying the Gold Cart allows you to have more product images per product and multiple payment gateways along with other privileges.Support the plugin if you can.I merely needed a way to improve my clients SEO and mirror the gold cart grid view layout we already have on the site.
Recent Changes:
Dec 9th 2008. Edited the to stop requiring themes/iShop/iShop.php.Obviously if you weren’t using the iShop theme you were going to get an error message. Commenting out this line has had no adverse effects.
Hi All,
I corresponded with Ms. Mccormicky about her grid view clone and she suggested I share with y’all, so here goes:
Hey mccormicky [says I],
Thanks for the update. I tried your new version, but I like the old one with the add-to-cart button right there (impulse sale!). So it’s the original homepage_products_functions.php and the css from your first post for me. I get four thumbnails across (at my screen res) and it looks nice. Maybe when I get the site live I’ll send you a link.
I have a question: You say “But a Fake Grid View page has one little problem:the thumbnail image does not link to the single product display page(like in Grid View).Instead,it links to the thumbnail image.Which means a thumbnail image will pop up where a full size image should.” As far as I can see, this is the behavior of the out-of-the-box free wpsc default products page. Any ideas as to how the code might be changed to display the full-sized image on the single product pages? I have mine set so that the width of the image on the single products page is the same as the full size image but I am dismayed that it’s just a blow-up if the half-size thumbnail there.
Oh, just a note: For some reason, to avoid a fatal error when using your edited homepage_products_functions.php version, I had to replace this:
foreach((array)$product_list as $product) {
< $wpsc_theme = wpsc_theme_html($product);
< if ($full_view == null) {
< $output .= “\n\r”;
foreach((array)$product_list as $product) {
> if(function_exists(‘wpsc_theme_html’)) {
> $wpsc_theme = wpsc_theme_html($product);
> }
To which Ms. Mccormicky responded:
Hi Chrys [says she]
Great information.I did not get that error but perhaps because on the sites that I use it I am running 3.6.7 and not 3.68 RC1,2 or 3.What version are you using?
[I’m using wp-e-commerce.3.6.8RC3 -Chrys]
I am concerned that removing this line:
$output .= “\n\r”;
will “break” the html.Unless you have taken care to remove the corresponding $output .= “”;
[Well, I just tested it for a few minutes and it did work, but that’s a very good point – Chrys]
Homepage_products is only for category views and does not apply to single pages…or are you asking how to alter product_display_functions.php?
I’ve found that what you mentioned is possible to achieve by altering the shop theme’s CSS and using your Settings>>Presentation to control the single thumbnail widths.At least this has been my experience.If you would like more info on this I can email you the shop theme css I am using successfully to get better single product images and the sizes I set for single products in Settings-Presentation.
Can I not have a link anyway to your in progress site? I am not that judegemental!
[I have the site hidden behind a curtain using the wet-maintenance plugin while it’s under construction and I’m building it for a client, otherwise I’d let y’all see it – Chrys]
Hey thanks for submitting the comment here.
Interestingly I seem to have only one site using RC 3 or 4… and not using the edits I mentioned because that site usually has no need for grid view(only has a few products to sell at a time).
I was extremely pleased that after upgrading to WP 2.7 and going from WPSC 3.6.7 to RC 3.6.8 3 or 4 there were 0, count em, 0 problems with the database upgrade, paypal payment getting sent to paypal (usually why I am reluctant to upgrade is because of probs with the payment gateways) or anything else.
The developers of this plugin need and deserve your support. I’ve donated before as well as telling my clients to buy the paid add ons. Just think where designers like you and me would be without this ever evolving plugin? Not that zen cart is bad (it’s actually better in some ways) but hot damn is is difficult for 1st timers to figure out!