tomcoleman Posted July 9, 2015 Share Posted July 9, 2015 on cubecart v6 how do you add a background image to the store? Quote Link to comment Share on other sites More sharing options...
bsmither Posted July 9, 2015 Share Posted July 9, 2015 In the Foundation skin (presuming), try by adding this CSS rule to the file cubcart.default.css:.inner-wrap { background-image: url("path/to/image.png"); } Quote Link to comment Share on other sites More sharing options...
tomcoleman Posted July 9, 2015 Author Share Posted July 9, 2015 (edited) In the Foundation skin (presuming), try by adding this CSS rule to the file cubcart.default.css:.inner-wrap { background-image: url("path/to/image.png"); } cheers how do I get rid of the big white box at the top ? http://www.littleocean.co.uk/shopim using skin e-Tone blue and adjusting the width of the cart so you can see more background (its also slightly off center) Edited July 9, 2015 by tomcoleman Quote Link to comment Share on other sites More sharing options...
bsmither Posted July 9, 2015 Share Posted July 9, 2015 The big white box at the top? I see the logo in the middle of it.If you are referring to the white blocks sitting on top of what parts of the background image you have in place, there are 196 pixels worth of white that is at the top of the image. That is to say, the white is part of the image. Quote Link to comment Share on other sites More sharing options...
tomcoleman Posted July 10, 2015 Author Share Posted July 10, 2015 The big white box at the top? I see the logo in the middle of it.If you are referring to the white blocks sitting on top of what parts of the background image you have in place, there are 196 pixels worth of white that is at the top of the image. That is to say, the white is part of the image.yes that bit - how do I get rid of that - which file needs to be edited. Quote Link to comment Share on other sites More sharing options...
bsmither Posted July 10, 2015 Share Posted July 10, 2015 That is to say, the white is part of the image.To remove it, load the image in an image editor and cut off the white band. Quote Link to comment Share on other sites More sharing options...
tomcoleman Posted July 10, 2015 Author Share Posted July 10, 2015 That is to say, the white is part of the image.To remove it, load the image in an image editor and cut off the white band.its not an image it something todo with the code, (right mouse on the area and you cant save as image, but you can on the actual logo) I want to remove the white space here.... Quote Link to comment Share on other sites More sharing options...
bsmither Posted July 10, 2015 Share Posted July 10, 2015 So far, the best I have for you is to disable any of three things in the CSS rule for: row::after (grid.css line 24).That will do it, but will cause more problems than it fixes.Or try this: in blue.css line 89, for the #container rule, change the background color from #fff to transparent. Quote Link to comment Share on other sites More sharing options...
Cyberart Posted August 20, 2015 Share Posted August 20, 2015 In the Foundation skin (presuming), try by adding this CSS rule to the file cubcart.default.css:.inner-wrap { background-image: url("path/to/image.png"); } cheers how do I get rid of the big white box at the top ? http://www.littleocean.co.uk/shopim using skin e-Tone blue and adjusting the width of the cart so you can see more background (its also slightly off center)I can't do it... Please more detail.... thank. Quote Link to comment Share on other sites More sharing options...
Dodgebill Posted August 22, 2015 Share Posted August 22, 2015 That is formatted within the "container" id of the css in the blue.css file. That is what makes the whole body of the site white. To separate that out you will have to do some code big changes to the skin. I'll see if I can work on a fix for you and post it as soon as it's ready. Do you just want it blank or a certain color? Is the skin stock or modified? Have you changed the background or anything else?Bill Quote Link to comment Share on other sites More sharing options...
Dodgebill Posted August 22, 2015 Share Posted August 22, 2015 Ok, assuming everything is stock here is what should work.in the template folder open up main.php. Find this code at line 60<div class="container" id="container"> <div class="row" id="logo"> <div class="u12"><a href="{$STORE_URL}"><img src="{$STORE_LOGO}" alt="{$META_TITLE}" /></a></div> </div> <div class="row" id="documents"> <div class="u12"> {$SITE_DOCS} </div> </div>Replace it with this<div class="topcontainer" id="topcontainer"> <div class="row" id="logo"> <div class="u12"><a href="{$STORE_URL}"><img src="{$STORE_LOGO}" alt="{$META_TITLE}" /></a></div> </div> <div class="row" id="documents"> <div class="u12"> {$SITE_DOCS} </div> </div></div> <div class="container" id="container">Then open up the style folder and open file "blue.css". At line 88 add this code#topcontainer ( background: transparent;}Technically you do not "need" that but if you ever what to change the color there that is where you will do it.Now open file "common.css" and find the layout section (line 501). Add this code directly above where you see #container {#topcontainer{ margin-top:20px; margin-bottom:20px; padding:0; -moz-border-radius:8px; -webkit-border-radius:8px; border-radius:8px; }Now open the file "grid.css". At line 41, just before .container { ad this code.topcontainer { width: 960px; margin: 0 auto; } There are three more places in that file that you will have to add the class .topcontainer. Find where you see .container under "wide", "narrow", and "mobile" and copy it along everything within it's brackets { }. Then paste it above the .container and change the copied class it .topcontainer. Does that make sense? I can spell it all out but it's a lot of code and is pretty simple to do really. Just amek sure there is a copy of the .container class info renamed to .topcontainer for each time it is listed on that pageGood luck and let me know how it works out. Quote Link to comment Share on other sites More sharing options...
philippagreen Posted September 14, 2015 Share Posted September 14, 2015 When I try and add an image to the body (sides of the web site) it also appears as the background to the web site, but I want this bit to remain white. I've followed the steps above but I can't make it work, so I must be doing something wrong? Quote Link to comment Share on other sites More sharing options...
Dodgebill Posted September 14, 2015 Share Posted September 14, 2015 These instructions are only for the e-Tone skin. If you are using Foundation it will not work. Foundations is very different and MUCH harder to accomplish this. Are you using the e-Tone skin? Did you double check the code to make sure it is exactly as above? Can you please include the url to your site so I can see what is going on? Quote Link to comment Share on other sites More sharing options...
philippagreen Posted September 14, 2015 Share Posted September 14, 2015 Hi, not using the e-Tone skin, just the Foundation skin which I've altered for my client. I didn't realise that the zoom feature wouldn't work on the Foundation Skin, I will remember this for future commissions. 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.