Guest Posted December 9, 2009 Share Posted December 9, 2009 How can I add a border to product images only If I change style.css in style sheets as below, it add a border to all images including cart and paypal logo's. } img { border: 3px solid #a5a5a5; } Is there away I can just add aborder to my product images only? thanks Paul Quote Link to comment Share on other sites More sharing options...
Robsta Posted December 9, 2009 Share Posted December 9, 2009 I've answered this somewhere already Another suggestion in addition to my other answer in the other post, somewhere, is to add it to the product details template directly, in viewProd.tpl. Quote Link to comment Share on other sites More sharing options...
Guest Posted December 11, 2009 Share Posted December 11, 2009 I've answered this somewhere already Another suggestion in addition to my other answer in the other post, somewhere, is to add it to the product details template directly, in viewProd.tpl. I can not find your other post anywhere? To be honest I am novice and know nothing about tpl files. I suppose I was hoping that someone would be able to provide me with some code to add or replace that would make this work? Quote Link to comment Share on other sites More sharing options...
Guest johnclaim Posted January 13, 2010 Share Posted January 13, 2010 You can add border to the image by give border 1. Please try. By John Claim Bestofcolleges in US :) Quote Link to comment Share on other sites More sharing options...
leeofaccy Posted February 2, 2010 Share Posted February 2, 2010 Hi Which images do you want the border on? Latest Products, Featured Products, the View Product Page? Also, which skin are you using? Quote Link to comment Share on other sites More sharing options...
Guest Posted February 15, 2010 Share Posted February 15, 2010 Can anybody tells me about how really themes is generated actually i want to generate a theme which makes my PC looks like iMac << url removed, please read the rules >> Quote Link to comment Share on other sites More sharing options...
Robsta Posted February 16, 2010 Share Posted February 16, 2010 Can anybody tells me about how really themes is generated actually i want to generate a theme which makes my PC looks like iMacThe skins are documented at cubecartforums.org. Quote Link to comment Share on other sites More sharing options...
Guest RobertJohn Posted February 28, 2010 Share Posted February 28, 2010 I have just started using CC and having been able to add a border to product images in my previous web site, I was also trying to find the answer to this one. Having read this post I still have no idea. I searched for "the other post somewhere" - thanks moderator. I've looked through viewProduct.tpl although not a web developer - I do have a background in serious computer programming for a living, and I can't join the dots on this one.n My site has a lot of products which have a white (or pale) background and a border would make such a big difference. Could someone give us a clue? Many thanks - my site??? www.sentientheart.co.uk take a look, you will see that I have already (in 2 days) made a big difference to the look.... Thnx Quote Link to comment Share on other sites More sharing options...
leeofaccy Posted February 28, 2010 Share Posted February 28, 2010 Hi As a basic way of doing this for the View Product Page, is to open skins/YOUR_SKIN/styleTemplates/content/viewProd.tpl and find this line <div style="text-align: center;"><img src="{IMG_SRC}" alt="{TXT_PRODTITLE}" border="0" title="{TXT_PRODTITLE}" /></div> and change the border="0" to ="1" for example. Same for Latest Products found at skins/YOUR_SKIN/styleTemplates/content/index.tpl. Find this line <a href="index.php?_a=viewProd&productId={VAL_PRODUCT_ID}"><img src="{VAL_IMG_SRC}" alt="{VAL_PRODUCT_NAME}" border="0" title="{VAL_PRODUCT_NAME}" /></a> Change the border value on this line too. For a better result you could create a new style in layout.css, called div.latestProds img and style the border to better suite your site. For example div.latestProds img { border: 1px dotted #000000; padding: 5px; } Would give you a 1px dotted black border with 5px of padding on the image. You would also have to make a new style for the View Product page and apply it to the image with class="YOUR_STYLE". For example if you created a style on layout.css called viewProdImg, the code you would need is <div style="text-align: center;"><img class="viewProdImg" src="{IMG_SRC}" alt="{TXT_PRODTITLE}" title="{TXT_PRODTITLE}" /></div> Quote Link to comment Share on other sites More sharing options...
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.