Drupal Commerce category page

Question

I've put together a Drupal commerce site using a theme called Expressa. Will readily admit I'm not an expert with Drupal.

On my category (item-type) page I get just text - no sign of the image I uploaded when I added the product. Simply a list of products in that category.

When you click on one of the products you see the product's picture that I uploaded.

From what I can tell both pages use the same file to display the products - node-product-display-tpl.php.

To be a little more specific on the category page there's this:

<div class="row">  
<div class="span5">
<div class="product-display-image">
</div>
</div>
</div>

On the product page this changes to

<div class="span5">
<div class="product-display-image">
<div class="commerce-product-field commerce-product-field-field-image field-field-image                        node-47-           product-field-image">
<div class="field field-name-field-image field-type-image field-label-above">
<div class="field-label">Image:&nbsp;</div><div class="field-items">
<div class="field-item even"><img typeof="foaf:Image" src="http://edge.ppgdev.com/oo/sites/default/files/styles/large/public/ocrm.jpg?itok=JLlUNLG8" width="600" height="450" alt="" />
</div>
</div>
</div>
</div>
</div>
</div>

Any help restoring the picture(s) to the item type page appreciated. Got a feeling I've changed something inside Drupal. Mainly because both use the same file and the code calling in the image is there. So my guess is somewhere in the depths of Drupal I've deactivated product images on the item-type page. It's just I've spent 12 hours looking for this setting and found diddly squat so far.

Here's the theme maker's page looking like I want mine to look like:

http://refaktorthemes.com/expressa/item-type/bags

It seems very simple on paper but I'm struggling to find this particular setting.

Thanks in advance for any help.

Answer 1

In Drupal Commerce (and Drupal), node display (which fields are visible ? where ? which formatter is used ?) is set using Display Suite (most of the time, it's the case with Commerce Kickstart) : Structure -> Content types -> [content type] -> Manage Display.

Then you have to select a display mode in top right (full content, product list...), and choose what to display (and how) for this content type and this display mode.

In Drupal commerce, you have product display nodes, which are plain old Drupal nodes and have a product reference field, and products which are not nodes but entities, with mandatory fields : price, SKU. A product display node can reference multiple products (think about T shirts : different colors and sizes). A product is basically a thing that can be sold (with a unique SKU, a price, and most of the time a picture), while a product display node is a wrapper which allows to display one or more products (variations of a products).

So when managing the way products appears on your site, you have to check the display settings for the product display node (product reference field must be visible, using a formatter like "rendered entity", where you can choose a display mode which will be used to display the product entity within the product display node) AND the display settings for the product itself : is the image field (it must be on the product entity since typically it changes across variations) visible for the display mode that is used on your listing page (this display mode should be called "product listing by category" for instance) ?

So when a product is displayed, two sets of display settings are playing together : one for the product and one for the product display node.

You can review the display settings for product display node here : admin/structure/types/manage/your-product-display-content-type/display

You can review the display settings for product here : admin/commerce/products/types/your-product-type/display

(the content type your-product-content-type has a product reference field, which can reference a product of the your-product-type type).

If image should be displayed reviewing the display settings, look at the formatter used, then try to find the view which is used for this page and check its configuration (should be the view on the /category/% URL, or something like this). It must be set to display nodes using a certain display mode, so check the display settings for this display mode.

I hope this can help, the Drupal Commerce way of dealing with products, variations and displays is not really straight forward, I struggled myself with this for a while, but it is very flexible.

Good luck with it