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.