Column layout grid view - product name under image

Hi,

I have recently installed the column layout grid module. However, the product names are shown under the images. Does anyone know how to put the names back to the top of the images? Please advise. Thanks in advance.

Hi all,

Has anyone got any idea on how to do this? I think the file that controls this is in /includes/modules/YOUR_TEMPLATE/product_listing.php I could locate 2 possible place (see below text) which I should edit (as indicated in bold text). Can someone point me to the right direction please? Thanks in advance.

switch ($column_list[$col]) {
case 'PRODUCT_LIST_MODEL':
$lc_align = '';
$lc_text = $listing->fields['products_model'];
break;
[FONT COLOR="RED"]case 'PRODUCT_LIST_NAME'[/FONT]:
$lc_align = '';
if (isset($_GET['manufacturers_id'])) {
$lc_text = '[FONT COLOR="RED"]<h5 class="itemTitle"><a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'products_id=' . $listing->fields['products_id']) . '">' . $listing->fields['products_name'] . '</a></h5>[/FONT]<!--<div class="listingDescription">' . zen_trunc_string(zen_clean_html(stripslashes(zen_get_products_description($listing->fields['products_id'], $_SESSION['languages_id']))), PRODUCT_LIST_DESCRIPTION) . '</div> -->' ;
} else {
$lc_text = '[FONT COLOR="RED"]<h5 class="itemTitle"><a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), ($_GET['cPath'] > 0 ? 'cPath=' . $_GET['cPath'] . '&' : '') . 'products_id=' . $listing->fields['products_id']) . '">' . $listing->fields['products_name'] . '</a></h5>[/FONT]<!--<div class="listingDescription">' . zen_trunc_string(zen_clean_html(stripslashes(zen_get_products_description($listing->fields['products_id'], $_SESSION['languages_id']))), PRODUCT_LIST_DESCRIPTION) . '</div> -->';
}
break;
case 'PRODUCT_LIST_MANUFACTURER':
$lc_align = '';
$lc_text = '<a href="' . zen_href_link(FILENAME_DEFAULT, 'manufacturers_id=' . $listing->fields['manufacturers_id']) . '">' . $listing->fields['manufacturers_name'] . '</a>';
break;
case 'PRODUCT_LIST_PRICE':
$lc_price = zen_get_products_display_price($listing->fields['products_id']) . '';
$lc_align = 'right';
$lc_text = $lc_price;

// qty box with add to cart button
if (PRODUCT_LIST_PRICE_BUY_NOW == '2' && $listing->fields['products_qty_box_status'] != 0) {
$lc_button= zen_draw_form('cart_quantity', zen_href_link(zen_get_info_page($listing->fields['products_id']), zen_get_all_get_params(array('action')) . 'action=add_product&products_id=' . $listing->fields['products_id']), 'post', 'enctype="multipart/form-data"') . '<input type="text" name="cart_quantity" value="' . (zen_get_buy_now_qty($listing->fields['products_id'])) . '" maxlength="6" size="4" /><br />' . zen_draw_hidden_field('products_id', $listing->fields['products_id']) . zen_image_submit(BUTTON_IMAGE_IN_CART, BUTTON_IN_CART_ALT) . '</form>';
} else {
$lc_button = '<a href="' . zen_href_link($_GET['main_page'], zen_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $listing->fields['products_id']) . '">' . zen_image_button(BUTTON_IMAGE_BUY_NOW, BUTTON_BUY_NOW_ALT, 'class="listingBuyNowButton"') . '</a>';
}
}
}
$the_button = $lc_button;
$products_link = '<a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), ($_GET['cPath'] > 0 ? 'cPath=' . $_GET['cPath'] . '&' : '') . 'products_id=' . $listing->fields['products_id']) . '">' . MORE_INFO_TEXT . '</a>';
$lc_text .= '<br />' . zen_get_buy_now_button($listing->fields['products_id'], $the_button, $products_link) . '<br />' . zen_get_products_quantity_min_units_display($listing->fields['products_id']);
$lc_text .= '' . (zen_get_show_product_switch($listing->fields['products_id'], 'ALWAYS_FREE_SHIPPING_IMAGE_SWITCH') ? (zen_get_product_is_always_free_shipping($listing->fields['products_id']) ? TEXT_PRODUCT_FREE_SHIPPING_ICON . '<br />' : '') : '');

      break;
    case 'PRODUCT_LIST_QUANTITY':
      $lc_align = 'right';
      $lc_text = $listing->fields['products_quantity'];
      break;
    case 'PRODUCT_LIST_WEIGHT':
      $lc_align = 'right';
      $lc_text = $listing->fields['products_weight'];
      break;
    case 'PRODUCT_LIST_IMAGE':
      $lc_align = 'center';
    if ($listing->fields['products_image'] == '' and PRODUCTS_IMAGE_NO_IMAGE_STATUS == 0) {
      $lc_text = '';
    } else {
      if (isset($_GET['manufacturers_id'])) {
      $lc_text = '<a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), 'products_id=' . $listing->fields['products_id']) . '">' . zen_image(DIR_WS_IMAGES . $listing->fields['products_image'], $listing->[FONT COLOR="RED"]**fields['products_name']**</FONT>, IMAGE_PRODUCT_LISTING_WIDTH, IMAGE_PRODUCT_LISTING_HEIGHT, 'class="listingProductImage"') . '</a>';
      } else {
      $lc_text = '<a href="' . zen_href_link(zen_get_info_page($listing->fields['products_id']), ($_GET['cPath'] > 0 ? 'cPath=' . $_GET['cPath'] . '&' : '') . 'products_id=' . $listing->fields['products_id']) . '">' . zen_image(DIR_WS_IMAGES . $listing->fields['products_image'], $listing->fields['products_name'], IMAGE_PRODUCT_LISTING_WIDTH, IMAGE_PRODUCT_LISTING_HEIGHT, 'class="listingProductImage"') . '</a>';
      }
    }
      break;
  }

Hi all,

I found the solution to this. It was much easier than I thought...didn't have to mess with the code at all. In case someone else is also looking for the solution to this, what you should do is go to
Admin->Config->Product Listing and change the sort order.

Thanks for this info, I just installed this myself. I love it, but I would like to know how to add some space to between the product listings. I am going to look into the code and see if I can figure it out. The descriptions almost run into each other. If anyone knows where in the code to make this change, I would appreciate this info.

Corbett

Hi cmessa,

I personally dislike the description showing in the product listing box as I have too many products and it makes it look too busy and untidy. You can also turn this off in admin > config > product listing. But if you would like to make changes, the file you should look at is
includes/modules/YOUR_TEMPLATE/product_listing.php

Search for description in that file to help you locate the related code. There should be quite a few <br> around which control the horizontal spacing between the product image, title, price, description and more info. Perhaps you can make tables to help keep things tidy. Good luck :)

Hi,

I managed to put the product title, price, more info in the right order I want in the product listing box. However, there is a gap between the title and price. Does anyone know how to remove/reduce it? I have had a look at the /includes/modules/YOUR_TEMPLATE/product_listing.php but I couldn't find any <br> that I can remove. Any suggestion? Thanks.

Thanks, I played around with it some and found out that it does look better without the descritpions. So I removed them. Thanks for the tip.

I also have the same problem that you have, a gap where the description used to be. I will take a look at the code but maybe if you remove the code for the description, it will not save a place for it?

Corbett

Hi Corbett,

Yes, you are right. To get rid of the space, remove the description code and also replace the <h5> tag with <b>. Let me know how you go.

I did not have any luck. Removing the code that I thought had the description did not eliminate the space. I removed some addition code in the same area and the space was gone, but I also lost an ending tag so everything was bold. I just decided to leave it like it is and live with it.

Corbett

Hi,

Did you remember to change both <h5> and </h5> to <b> and </b>respectively? You can have a look at my webpage and see if they are similar to yours. If u are still keen, you can post your code here, I can help you check.

I think the br you are looking for is in here:
/includes/modules/YOUR_TEMPLATE/product_listing.php

$lc_text = implode('<br />', $product_contents);

Hi,

I was wondering if there's an **easier **way to get the buy now button show under **each **product with Column layout grid view.

I really don't want to go in and mess with the code.

Thanks.

From memory, you should be able to turn it on in the admin.

dealbyethan.com:

From memory, you should be able to turn it on in the admin.

Not for **each **product. This is the only way. It makes sense too, because if you turned it on with the grid layout contrib, it'll show on top, bottom or both of the page.

However, if you turn it off, it'll list the buttons under **each **product.

This should've been included in the contrib documentation. I think.

dealbyethan.com:

Hi,

I have recently installed the column layout grid module. However, the product names are shown under the images. Does anyone know how to put the names back to the top of the images? Please advise. Thanks in advance.

I saw your site it's very cool. How do you made the image to right in product listing?

Hi,

I don't get what you mean. Please explain so I can help.

dealbyethan.com:

Hi,

I don't get what you mean. Please explain so I can help.

Sorry dealbyethan.com My english is not good. I saw your site and I like It's alignment. How do you make the description showed on new product listing and how do you remove the gab between name and price and more info in product listing

How do you make the description showed on new product listing and how do you remove the gab between name and price and more info in product listing.

In your admin, go to Configuration > New Listing and turn off the description. As with the gab, I think you might have to change the code in the related file. Back up your files before doing tests.