Whats New Sidebox

[aaronjmorgan]

Hello ,

I want to customize the "Whats new?" products sidebox.... i want the box to be certain height and width... and want there to be a background image behind the links. I want the new items to display with certain size font and would like custom set margins in between the products and also on the sides of the links... I want the sidebox to only display the 6 most recent additions. Can anyone provide some guidance on how to do this? Thanks! -Aaron

[dbltoe]

Sounds like you need to get FireFox with the Firebug add-on to help you with CSS changes.

[rbarbour]

i want the box to be certain height and width

You can set the height and width via your stylesheet.css file

div#whatsnew.leftBoxContainer {
height:XXXpx!important;
width:XXXpx!important;
}

replacing XXX with desired width and height

and want there to be a background image behind the links.

div#whatsnew.leftBoxContainer a {
background-image: url(../images/YOUR_IMAGE);
}

replacing YOUR_IMAGE with image name
../images/ indicates YOUR_TEMPLATE/IMAGES folder

I want the new items to display with certain size font and would like custom set margins in between the products and also on the sides of the links

fonts, padding, margins can also be added to the div#whatsnew.leftBoxContainer CSS rules

I want the sidebox to only display the 6 most recent additions

admin > Configuration > Maximum Values > New Product Listing - Limited to ...

will limit new products added within a certain time frame

[aaronjmorgan]

thanks for your help. Rather than having the whatsnew sidebox limited to "7 days" is there a way to modify the script to allow an option to display for only the 6 most recent items?

[aaronjmorgan]

Also- i was trying to apply the CSS stylesheet settings u mentioned up above and for some reason the entire whatsnew sidebox will not show no matter what I do... any ideas what may have caused this to happen?

[aaronjmorgan]

disregard previous comment about the sidebox not displaying... it is displaying now... the problem of the 6 most recent items.... is still on my priority list. I also do not want to display the product images in this area...

my background image is not displaying correctly for this sidebox. as you can see on my page https://www.toyzeum.com/store/ the background image in the whatsnew sidebox is displaying behind the product text and not for the actual sidebox itself.

Also- the CSS code modification for this sidebox on the style sheet is not creating new size for this sidebox... it needs to be 293 x260 px


#whatsnew {border: none;}

#whatsnewHeading {display: none;}

#whatsnew.rightBoxContainer a {
background-image: url(https://www.toyzeum.com/store/images...finds_bg.jpg);
height:260px;
width:293px;
}

[rbarbour]

disregard previous comment about the sidebox not displaying... it is displaying now... the problem of the 6 most recent items.... is still on my priority list. I also do not want to display the product images in this area...

my background image is not displaying correctly for this sidebox. as you can see on my page https://www.toyzeum.com/store/ the background image in the whatsnew sidebox is displaying behind the product text and not for the actual sidebox itself.

Also- the CSS code modification for this sidebox on the style sheet is not creating new size for this sidebox... it needs to be 293 x260 px


#whatsnew {border: none;}

#whatsnewHeading {display: none;}

#whatsnew.rightBoxContainer a {
background-image: url(https://www.toyzeum.com/store/images...finds_bg.jpg);
height:260px;
width:293px;
}

original request

and want there to be a background image behind the links.

just remove the a

#whatsnew.rightBoxContainer {
background-image: url(https://www.toyzeum.com/store/images/main/rightsidebar_latestfinds_bg.jpg);
height:260px!important;
width:293px!important;
}

!important after the width and height forces width and height

As far as only pulling the (6) most recent NEW Products, it is doable and I have the code somewhere in my sandbox, give me a few to find it if not I will re-write at my earliest convenience.

[aaronjmorgan]

Thanks so much for your help RB... I made some major steps forward now in getting the whats new sidebox to appear as I wanted it to (thanks to your help), There is a few more things i am aiming to accomplish with this sidebox:



as you can see- in comparison to my live site- I am having some formatting issues: https://www.toyzeum.com/store/


1. Formating (for some reason i cant get margins for the text links) not sure what im doing wrong...

2. The sidebox needs to display the 6-7 most recent additions only (not the newest items in the last 7 days)

3. The sidebox needs to display the most recent additions on the top. Currently it is putting the most recent adds on the bottom for some reason

4. Would like custom product attributes to be able to called up in this line... Such as (where i found the figures / toys)


Sorry that I am adding new things to this list... This sidebox is a work in progress and trying to learn how to do this. Thank you for your kindness!

-Aaron

[rbarbour]

Not at the sandbox today but try this for displaying most recent 6 items added.

in /includes/modules/sideboxes/YOUR_TEMPLATE_NAME/whats_new.php

find:

// display limits
// $display_limit = zen_get_products_new_timelimit();
  $display_limit = zen_get_new_date_range();
  $random_whats_new_sidebox_product_query = "select p.products_id, p.products_image, p.products_tax_class_id, p.products_price, pd.products_name,
                                              p.master_categories_id
                           from (" . TABLE_PRODUCTS . " p
                           left join " . TABLE_PRODUCTS_DESCRIPTION . " pd on p.products_id = pd.products_id )
                           where p.products_id = pd.products_id
                           and pd.language_id = '" . (int)$_SESSION['languages_id'] . "'
                           and p.products_status = 1 " . $display_limit; 

change to:

// display limits
// $display_limit = zen_get_products_new_timelimit();
//  $display_limit = zen_get_new_date_range();
$orderBy = 'order by p.products_date_added desc LIMIT 0 , 6'; 
  $random_whats_new_sidebox_product_query = "select p.products_id, p.products_image, p.products_tax_class_id, p.products_date_added, p.products_price, pd.products_name,
                                              p.master_categories_id
                           from (" . TABLE_PRODUCTS . " p
                           left join " . TABLE_PRODUCTS_DESCRIPTION . " pd on p.products_id = pd.products_id )
                           where p.products_id = pd.products_id
                           and pd.language_id = '" . (int)$_SESSION['languages_id'] . "'
                           and p.products_status = 1 " . $orderBy; 

[aaronjmorgan]

It works great- Thank you so much!