Code to display Featured Category with Description, Manufacture URL, BuyNow button

Hello,

I also have a requirement to display

Product Name
Product Image
Product Description
Product Manufacture URL
Product Price
Buy Now buttom/ Sold out button.

I have searched but din't find the solution / code any where in the thread (may be it would be there some where)

But, as I have achieved the functionality I wanted to share this so that others can use this. Let me know if any thing is wrong here. I am also a beginner to zencart (started before 4days :blush: )

So here is the code...

NOTE:: This is for the latest version 3.8

Go to /includes/modules/featured_products.php

May at line number 67 you will find a while loop

while (!$featured_products->EOF) {
$products_price = zen_get_products_display_price($featured_products->fields['products_id']);
..
...
..
..
}

REPLACE THE WHILE LOOP WITH THE CODE BELOW

while (!$featured_products->EOF) {
$products_price = zen_get_products_display_price($featured_products->fields['products_id']);
$products_desc = substr(strip_tags(trim(zen_get_products_description($featured_products->fields['products_id'], $_SESSION['languages_id']))),0,100).'…';
$vendor_name = zen_get_products_manufacturers_name($featured_products->fields['products_id']);//this is the manufacture name
$vendor_id = zen_get_products_manufacturers_id($featured_products->fields['products_id']);//this is the manufacture name
$vendor_link = '<a href="'.zen_href_link('index', 'manufacturers_id='.$vendor_id, 'NONSSL').'">'.$vendor_name.'</a>';
$buy_now_link = zen_get_buy_now_button($featured_products->fields['products_id'],'<a href="' . zen_href_link($_GET['main_page'], zen_get_all_get_params(array('action')) . 'action=buy_now&products_id=' . $featured_products->fields['products_id']) . '">' . zen_image_button(BUTTON_IMAGE_BUY_NOW, BUTTON_BUY_NOW_ALT) . '</a> ');

if (!isset($productsInCategory[$featured_products->fields['products_id']])) $productsInCategory[$featured_products->fields['products_id']] = zen_get_generated_category_path_rev($featured_products->fields['master_categories_id']);

$list_box_contents[$row][$col] = array('params' =>'class="back"' . ' ' . 'style="width:' . $col_width . '%;"',
'text' => (($featured_products->fields['products_image'] == '' and PRODUCTS_IMAGE_NO_IMAGE_STATUS == 0) ? '' : '<div class="d_imgbox"><a href="' . zen_href_link(zen_get_info_page($featured_products->fields['products_id']), 'cPath=' . $productsInCategory[$featured_products->fields['products_id']] . '&products_id=' . $featured_products->fields['products_id']) . '">' . zen_image(DIR_WS_IMAGES . $featured_products->fields['products_image'], $featured_products->fields['products_name'], IMAGE_FEATURED_PRODUCTS_LISTING_WIDTH, IMAGE_FEATURED_PRODUCTS_LISTING_HEIGHT) . '</a></div><p>') . '<a href="' . zen_href_link(zen_get_info_page($featured_products->fields['products_id']), 'cPath=' . $productsInCategory[$featured_products->fields['products_id']] . '&products_id=' . $featured_products->fields['products_id']) . '">' . $featured_products->fields['products_name'] . '</a></p>'.'By '.$vendor_link.'<p>'.$products_desc.'</p><p>' . $products_price.'</p><p>'.$buy_now_link.'</p>');

$col ++;
if ($col > (SHOW_PRODUCT_INFO_COLUMNS_FEATURED_PRODUCTS - 1)) {
  $col = 0;
  $row ++;
}
$featured_products->MoveNextRandom();

}

There is a css class too...

/--- Custom css by Dharam for image box/
.d_imgbox
{
float:left;
height:200px;
width:90px;
padding:5px 0px 0px 0px;
}

put the above css class in some of the css file you are using.

THATS all - you should get the result :cool:

Let me know if there is any problem. I am attaching my featured_products.php file for your reference.

If this information would be helpful for you, I can share the source code for all the blocks with you soon.

HAPPY ZENCARTING :clap::clap:

Regards
Dharam
[email protected]

**Forgot to tell that ..

this is for displaying the featured product - in the content area of the main page (HOME PAGE). **

Thanks for adding the solution that worked for you on Featured Products ... this is always a help to others to see alternative coding solutions ... :smile:

Thanks!

Do you know how to lessen the space between products and also between the product name and line of description?

a l e x a n d e r g i f t s . c a

Cheers,

Robbie

Just a note - Zen Cart v2.0 will have options for showing the prices, descriptions etc. in the listings boxes and listing pages and the ability to have customized layouts for both.

Cool, I read about 2.0 and how a lot of popular mods/effects and special coding will be built-in.

But till it's good to go sans bugs may be a while...any way to lessen the spaces till then?

R

I realized the issue only arose by using this mod, which I didn't even need because I only wished to display the name, description and price...all do-able through Admin.

R

And now I just remembered that the description does not show in Featured through standard ZC! :frusty: I read other posts to get around this, but couldn't control the length of the description text.

So this mod is back on my site, even though I'll likely only use the description and maybe the price, and I would once again like to adjust the spacing. (I blocked out // the lines of code for name, price, id and the two links.)

Cheers,

R

Are you having any problem now...

There is a css class where I have given a fixed height to the image block.

Let me know if I can help you out..

Now I have two issues, one as currently seen on the site and another when I try to center everything with one item per row, which I would like when there are just two items. Though let's start with what you now see.

I tinkered around some more and, going back to your original code for featured_products and stylesheet.css, I now have what's on the site at a l e x a n d e r g i f t s . c a where the item names and descriptions lap over the images.

The only adjustment I did to your files was block out // in featured_prods lines 68 and 70-73 for price, name, id and the two links.

In Admin, this is what I have under Config-Featured Listing:

Display Product Image 1101
Display Product Quantity 0
Display Product Buy Now Button 0
Display Product Name 1201
Display Product Model 0
Display Product Manufacturer Name 0
Display Product Price 0
Display Product Weight 0
Display Product Date Added 0
Display Product Description 150
Display Product Display - Default Sort Order 8
Default Featured Products Group ID 22
Display Multiple Products Qty Box Status and Set Button Location 0

Cheers,

R

giftmeister:

Now I have two issues, one as currently seen on the site and another when I try to center everything with one item per row, which I would like when there are just two items. Though let's start with what you now see.

I tinkered around some more and, going back to your original code for featured_products and stylesheet.css, I now have what's on the site at a l e x a n d e r g i f t s . c a where the item names and descriptions lap over the images.

The only adjustment I did to your files was block out // in featured_prods lines 68 and 70-73 for price, name, id and the two links.

In Admin, this is what I have under Config-Featured Listing:

Display Product Image 1101
Display Product Quantity 0
Display Product Buy Now Button 0
Display Product Name 1201
Display Product Model 0
Display Product Manufacturer Name 0
Display Product Price 0
Display Product Weight 0
Display Product Date Added 0
Display Product Description 150
Display Product Display - Default Sort Order 8
Default Featured Products Group ID 22
Display Multiple Products Qty Box Status and Set Button Location 0

Cheers,

R

Ok Try to do the following things

1-> Overlap issue. Remove flot:left propertie from d_imgbox class.
2-> One column per row. You need to do this setting

Admin->Configuration->Index Listing->Featured Products Columns per Row-> make it 1

and try..

I did #1 and removed the float:left and that worked for when I have a few items in Featured with 2 per row. (Did not change #2.)

I'll post again tomorrow because I'm still trying to improve the look for when I have one or two items in Featured and wish to lay them out one per row.

Thanks!

R

I got close to figuring out my second issue, but now have a headache after 30 minutes of tinkering..

Issue #2 can now be seen on my site- a l e x a n d e r g i f t s . c a . When I have just two Featured items, I would like them 1 per row (already set, as seen) and centered. For the centering of all text, I replaced line 77 of your featured_products file with:

    $list_box_contents[$row][$col] = array('params' =>'class="centerBoxContentsFeatured centeredContent back"' . ' ' . 'style="width:' . $col_width . '%;"',

When I realized that didn't work for the images, I tried a few things and the closest was adding a few lines to your custom .d_imgbox css:

 
.d_imgbox
{
display:block;
margin:0 auto;
text-align:center;
height:200px;
width:90px;
padding:5px 0px 0px 0px;
}

But that pushes the images to center-right. Do you know how I can align the images proper center? And how to reduce the space between items...even between the image and title, and between the title and description?

Cheers,

R

giftmeister:

I got close to figuring out my second issue, but now have a headache after 30 minutes of tinkering..

Issue #2 can now be seen on my site- a l e x a n d e r g i f t s . c a . When I have just two Featured items, I would like them 1 per row (already set, as seen) and centered. For the centering of all text, I replaced line 77 of your featured_products file with:

$list_box_contents[$row][$col] = array('params' =>'class="centerBoxContentsFeatured centeredContent back"' . ' ' . 'style="width:' . $col_width . '%;"',

> 
> When I realized that didn't work for the images, I tried a few things and the closest was adding a few lines to your custom .d_imgbox css:
> 
> ```php
 
.d_imgbox
{
display:block;
margin:0 auto;
text-align:center;
height:200px;
width:90px;
padding:5px 0px 0px 0px;
}

But that pushes the images to center-right. Do you know how I can align the images proper center? And how to reduce the space between items...even between the image and title, and between the title and description?

Cheers,

R

Just remove - width:90px;

.d_imgbox
{
display:block;
margin:0 auto;
text-align:center;
height:200px;
padding:5px 0px 0px 0px;
}

Cheers!!!

I think this should work.

Thanks for all your help!

R

Greetings, it's me again!

I'm still looking to narrow the spaces between: pictures and titles, titles and descriptions, and rows. Is there a way?

alexandergifts.ca

Cheers,

Robbie

Hello,

Does this module change the layout of the featured center box? Im after a layout with the image on the left and the product name and price on the right. Any help or advice pls.

Thank you..

Each element can be set from Admin->Configuration->Featured Listing.

R

dharam1987 - thanks for taking the time for this mod.

I see where the mod is configured for 1 column - Any ideas on how to get 2 columns in Featured Products (when 2 columns is chosen in admin, things come out whacky).

Also, when a buy now button is clicked in Featured Products on homepage, even if there are no attributes for the product, user is redirected to product page. Any ideas on how to keep the user on home page after they click a buy now button? Any suggestions greatly appreciated.

Andrew, see my site at alexandergifts.ca. I have 2 items per row and 2 rows. Admin>Config>Index Listing>Featured...Per Row. This must be done so what exactly is wacky? For the rest, you can see what I did above by removing some elements to give it a cleaner look.

R