Public Store Appearance

Hi guys I only just got nopcommerce working after to lot of faffing about but I have been trying to change the appearance of the public store. I have read in a new thread, theres no easy way to change themes in nopcommerce.

I have been changing a few things in the css file but a big white space remains at the bottom of the public store I can't seem to find what it is and how to change/get rid of it.

Does anyone know how to fix this?

Hi,

This is not the case. Creating new themes in nopCommerce is no different to any asp.net web application. However, we are making the process alot easier in the next release as well as reducing all unecessary table based layouts.

The problem you refer to is caused by reset-fonts-grids.css

Change:

html{color:#000;background:#FFF;}body,div,dl,dt,dd....

to:

html{color:#000;}body,div,dl,dt,dd......

This was resetting the body background color on shorter pages (hence why you get white space).

Hope this helps,
Ben

Hi thanks for the help, sorry i read about things being easier in future releases i think thats what i was trying to say.

I don't suppose anyone could offer some advice on this: Is there is any easy way to put in a background image that automatically resizes to the screen resolution or am I going to have to do something with javascript browser detect?

Yes you can use CSS to repeat fill the background depending on resolution (normally by repeating a splice image vertically or horizontally) but this doesn't actually resize the image. So yes you may have to use javascript to do this.

okie thanks for the help

Hi, I got my image to resize to full screen by setting a table to take up the whole page in main.master then putting the background in that and sent it to the back with z-index in style.css.

However the background doesnt show in the product/category pages, is this because of the templates? Where do I need to edit to fix this?

Thanks for the help so far, nopcommerce is great, nearly finished this is the final thing thats annoying me :)

Hi Markeh,

I've also had that problem from time to time, but normally solve it by simply making sure that the image is available in both the /images as well as the /app_themes/publicstore/images.

Hope that helps.

markeh,

Providing you have used an absolute reference to your image, it should show on all pages. If you have used a relative reference, it will not.

I would not recommend using a table to apply a background image. You should ideally do this through css styles on the body element.

thanks for the replies i know its not the best way of doing things but its the easiest way for me to have the background image fit the screen :)


Trevor you're right if i change the z-index to 1 to bring the background image on top then i can't click on any links, indicating the image is there but it isn't displayed. Time to use absolute references then, thanks to you both.