Help with images & font sizes

[rekhis]

Gurus,

 

I am seeking suggestions to correct few things for my soon to be launched website. Please look at the following URL -

 

http://www.kamdarplaza.com/index.php?cPath=22_29

 

1. The images shown in the box have white background. How do I remove the white background so that they all have peach color background? Can I do that in stylesheet than modifying all images to have peach color background? Where is size of the box defined?

 

2. I am inputting weight of the item while adding them, and would like to display them at this level. How do I do that?

 

3. Can I make font size smaller just for price, keeping product name at the same size but different color font? If it is controlled in stylesheet, where exactly should I be looking?

 

Thanks

...Manjeet

[Wendy James]

You will have to edit the images to give them the peach background color.

 

the box size? I think what you mean is in your catalog/includes/application_top.php

// customization for the design layout

define('BOX_WIDTH', 125); // how wide the boxes should be in pixels (default: 12

 

font sizes aredefined in your stylesheet

as it is I believe only specials and new product prices are defined but you can create new styles and then apply them to the pages/code where they need to be added.

[rekhis]

Oh, that will be next to impossible for me to edit all images; I was hoping I could manage the background color in the stylesheet.

 

By box, I meant where these items are appearing. I am using big-image contrib and trying to keep thumb-nail images at 125x125 and big images at 360x360, but sometimes, these white background appears in the empty space. I am thinking if somehow, I can reduce the size of the box where images appear, it may fill the box and I maynot need to edit images!

 

How do you define new styles and apply to the pages? Is there any "how-to" tutorial about stylesheet in simplistic language? :)

 

And can I display weight (or any other attribute) next to name & price?

 

You will have to edit the images to give them the peach background color.

 

the box size? I think what you mean is in your catalog/includes/application_top.php

// customization for the design layout

  define('BOX_WIDTH', 125); // how wide the boxes should be in pixels (default: 12

 

font sizes aredefined in your stylesheet

as it is I believe only specials and new product prices are defined but you can create new styles and then apply them to the pages/code where they need to be added.

<{POST_SNAPBACK}>

[rekhis]

I just happened to see your website, http://homeandgardengiftsandcollectibles.com/ - looks impressive! See how your 6 products are properly sized! The first 5 are same size but 6th one is smaller and doesn't have white background. These are the boxes I am refering to.

[Wendy James]

My backgrounds are the same color as my site because I made them that way so it would all match. As far as I know you can not edit images via css to do what you want. You could use transparetn gifs or pngs but not sure about pngs working correctly. Either way you would still have to edit the images.

 

The images are not really in boxes, so the white is whatever you have in the image itself. There is no background specified for the behind the images other than say... infoboxes.

 

You could open your stylesheet.css and look at the infobox classes. Remove the background color in them, but that will alter all the infoboxes. Not just where images show up. Which it looks like you have already done.

[altDev]

I would only suggest Photoshop, it by far is the easiest way to get rid of BG color, it looks as if all the pics have a nice white background. If you have PS, use the "magic wand tool to accomlish this. Just click the white with the magic wand and fill with the peach color. Hope this helps. Here is a tutorial, http://www.heathrowe.com/tuts/knockout.asp?knockout=mwand.

 

James

[rekhis]

Thanks for your reply! I guess #1 is something I need to work on from different perspective. Yes, you are correct - I have tried changing colors of infoboxes and by trial & error, I was able to get upto this point. :-)

 

How about #2 & #3, namely -

 

2. I am inputting weight of the item while adding them, and would like to display them (or any other attribute) at this level. How do I do that?

 

3. Can I make font size smaller just for price, keeping product name at the same size but different color font? If it is controlled in stylesheet, where exactly should I be looking?

 

Thanks again!

...Manjeet

[Wendy James]

For weight...

this contribution adds the weight to the shopping cart

http://www.oscommerce.com/community/contributions,2643

shows weight on product info page

http://www.oscommerce.com/community/contributions,587

 

to change the price font or size you will need to edit many pages (all the pages you want the price to appear differently)

If you just want to do it on the page that lists the product you will need to first create the class in the stylesheet

 

for example

DIV.price {

font-family: Tahoma, Verdana, Arial, sans-serif;

font-size: 10px;

color: #362F2D;

}

ofcource changing it to the font you want, size and color. Or you could just use a style that is already defined on the style sheet.

 

then open product_info.php and look for

<?php echo $products_price; ?>

and change it to something like

<div class="price"><?php echo $products_price; ?><div>

 

Hope that helps. May be other ways of doing it but that is how I have done it in the past for the product_info.php

[rekhis]

Thank you! This gives me some ammunition to work on. I will let you know how it goes.

 

...Manjeet

 

:sweating:

[rekhis]

I put the changes in Stylesheet, and also in product_info.php. When showing the product info for a single product, the price color changes to red - http://www.kamdarplaza.com/product_info.ph...&products_id=94 but when all products are shown in that category, the price font color remains black - http://www.kamdarplaza.com/index.php?cPath=21_38. Which other file needs modification?

 

I am also trying to get left boxes to have different background color than right boxes but unable to do so.

 

Here is an example website which has both the above features - price font color is different and left/right boxes are in different colors - http://www.ishopindian.com/shop/catalog/index.html

 

Also please look at http://www.kamdarplaza.com/index.php?cPath=21_34

How can I remove the rectangle box covering the Category picture? (just below the word "Flour")?

 

Thanks

...Manjeet

[rekhis]

This one was self-inflicted injury; I had defined <img border="1"> which caused the border to appear - after changing that to <img border="0"> , border has gone!

 

Waiting for Stylesheet expert to pitch in for other questions!

 

...Manjeet

 

Also please look at http://www.kamdarplaza.com/index.php?cPath=21_34

How can I remove the rectangle box covering the Category picture? (just below the word "Flour")?

 

<{POST_SNAPBACK}>