Jump to content

Archived

This topic is now archived and is closed to further replies.

WoodsWalker

CSS <Style> Borders on Catalog Images?

Recommended Posts

Hi Folks!

 

I've recently learned how to apply CSS styles to images, and the simple border I can add to photos really enhances the look of my other web pages. Is there a way I can apply these to the images in my osC catalog? I've searched around, and gone through product-listing.php with a fine-toothed comb, but can't fathom how to do it.

 

Any guidance would be much appreciated.

 

Thanks,

~Wendy

Share this post


Link to post
Share on other sites
Hi Folks!

 

I've recently learned how to apply CSS styles to images, and the simple border I can add to photos really enhances the look of my other web pages. Is there a way I can apply these to the images in my osC catalog? I've searched around, and gone through product-listing.php with a fine-toothed comb, but can't fathom how to do it.

 

Any guidance would be much appreciated.

 

Thanks,

~Wendy

 

Start your search with /includes/functions/html_output.php -> function tep_image. There is a "border="0" definition.

Share this post


Link to post
Share on other sites

but....

 

osC uses that function for pretty much EVERY image. I'm guessing you don't want borders on all of them. And if you did then just a

img {
border: 1px solid #123;
}

 

would do the same thing much quicker.

 

 

what you most likely want is probably just on product images? maybe in certain places or everywhere?

 

What you want to do is find the specific places you want the image to have a border -

product_info.php

includes/modules/product_listing.php

shopping_cart.php

 

 

find the tep_image functions in those and add the style to the 'parameters' argument.

 

so for example:

tep_image(DIR_WS_IMAGES.'image.jpg','alt text','width','height',' style="border: 1px solid #123"');

Share this post


Link to post
Share on other sites

Thanks Andreas and Jef - that's just the advice I was looking for! :D

 

I'll try it and report back.

 

~Wendy

Share this post


Link to post
Share on other sites

You can also add borders from external stylesheet which is easier to edit and make changes:

 

/*------Listings--------*/

 

.productListing-data a img {

border: 1px solid #000;

}

 

/*------for columns--------*/

 

.boxText a img {

border: 1px solid #000;

}

 

/*------product descriptions--------*/

 

.smallText a img {

border: 1px solid #000;

}

 

etc....

Share this post


Link to post
Share on other sites

×