nivar Posted March 12, 2013 Share Posted March 12, 2013 right now the kurouto skin only has 3-products on the row and pictures are in size 138 x 113. i would like to put more in the row and the picture slightly smaller to accommodate for the more products. how do I go about implementing it. FROM THIS TO THIS Quote Link to comment Share on other sites More sharing options...
bsmither Posted March 12, 2013 Share Posted March 12, 2013 Ideally, this would involve nothing more than making a few edits to the skin's CSS file. However, there is one statement in a Class function that needs to be changed to get the proper size image. On the other hand, we can try to request the browser resize the image. We will be editing content.homepage.php and common.css. In common.css, find near line 221, div.latest_product. Change: height:157px; width:109px; Find near line 228, div.latest_product p.image. Change: height:92px; In content.homepage.php, find the image tag and add these attributes to make it look like: <img src="{$product.image}" alt="{$product.name}" height="92" /> This reduces the area given to each "latest product" to 2/3 of its original size. Quote Link to comment Share on other sites More sharing options...
nivar Posted March 13, 2013 Author Share Posted March 13, 2013 thanks for the help. I found the files and made the changes, the images become smaller and there is bigger gap between the products abut there are still only 3 product in the row. I would like to make this 5-products in the row. let me know how to do it Quote Link to comment Share on other sites More sharing options...
bsmither Posted March 13, 2013 Share Posted March 13, 2013 Where I said this: In common.css, find near line 221, div.latest_product. Change: height:157px; width:109px; You can also change to margin:5px 3px; to close up the gap between products. And you will need to change height:207px; because the next row will interfere with the buttons on the row above (stupid buttons). That gives me five per row. You will need to clear the skin cache (admin, Maintenance, Rebuild tab, Clear Cache). Quote Link to comment Share on other sites More sharing options...
nivar Posted March 13, 2013 Author Share Posted March 13, 2013 thank you bsmither, I have done some adjustment to "common.css" and was able to fit 5 products in a row. I adjusted the right and the left side-bar width from 200px to 150px at line 150, this gave some gap between the side-bar and the center-box. 1. How do I get rid of the gap, so I can fit more products in the row. 2. How do I change the "Info" and "Ad to Basket" button size? ( if possible would like to change it to "Info" and "Buy") Please take a look at this site http://bit.ly/Yp7sni thanks Quote Link to comment Share on other sites More sharing options...
bsmither Posted March 13, 2013 Share Posted March 13, 2013 In your common.css file, find at around line 167, #page_content. Make the padding: 0 164px !important; Adjust to suit your needs. The black and white buttons have a background image associated with them: kurouto/images/common/button_black.png, and button_white.png. You will need to edit these in an image editor to make them narrower. Quote Link to comment Share on other sites More sharing options...
nivar Posted March 13, 2013 Author Share Posted March 13, 2013 ok, cool. I have done the changes, and able to have 6 products in the row. But the word "Add to Basket" can not be edited by editing the image button. Where do Iook to change the "Add to Basket" phrase? Quote Link to comment Share on other sites More sharing options...
bsmither Posted March 13, 2013 Share Posted March 13, 2013 That's a language thing. "Add to basket" will change depending on the language chosen to display. So, in admin, select Languages, click the edit icon for the language you want to change, choose the Catalogue group, then change the phrase for add_to_basket. Quote Link to comment Share on other sites More sharing options...
nivar Posted March 14, 2013 Author Share Posted March 14, 2013 thank you very much bsmither, I appreciate all your help. can you take a look at this and see how I can implement this. ttp://forums.cubecart.com/topic/47117-front-page-category-separation/#entry192506 thanks Quote Link to comment Share on other sites More sharing options...
bsmither Posted March 14, 2013 Share Posted March 14, 2013 I don't know how to do that (yet). 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.