Post by BalMar » Fri Apr 02, 2010 8:26 am

Hi

The default template is OK for my shop, although I would like to change the background from plain white.
How do I do this? Sorry for my lack of knowledge :(

Thanks

Newbie

Posts

Joined
Wed Mar 31, 2010 10:21 pm

Post by twiggy » Fri Apr 02, 2010 7:21 pm

Edit the CSS file.

go to: /catalog/view/theme/default/stylesheet and open stylesheet.

In there you can change the background colour in body to what ever you want.

Active Member

Posts

Joined
Fri Aug 14, 2009 4:43 am


Post by tanicos » Fri Apr 02, 2010 8:41 pm

edit the file stylesheet.css and search for

Code: Select all

body {
	margin: 0px;
	padding: 0px;
	text-align: center;
}
edit that to :

Code: Select all


body {
	margin: 0px;
	padding: 0px;
	text-align: center;
background-color:#000;
}
add the color code as you wish

$20 Open Cart Templates http://www.onlinetemplates.org
Tanicos Web 2.0 Design


New member

Posts

Joined
Fri Mar 05, 2010 2:31 am


Post by BalMar » Sat Apr 03, 2010 7:47 am

Thanks! I don't think I will, but what would I do if I wanted to add an image?
Or is that too complicated?

Thanks

Newbie

Posts

Joined
Wed Mar 31, 2010 10:21 pm

Post by BalMar » Sat Apr 03, 2010 8:59 am

I worked out how, took me a while but easy now that I know.

Thanks

Newbie

Posts

Joined
Wed Mar 31, 2010 10:21 pm

Post by tanicos » Sun Apr 04, 2010 12:39 am

background: url (../image/image.jpg) repeat-x;

adding that will make an image to repeat vertically on your background. you can also add a repeating color after the image as well:

background: #000 url (../image/image.jpg) repeat-x;

$20 Open Cart Templates http://www.onlinetemplates.org
Tanicos Web 2.0 Design


New member

Posts

Joined
Fri Mar 05, 2010 2:31 am


Post by gelko » Sat Apr 10, 2010 2:11 am

tanicos wrote:background: url (../image/image.jpg) repeat-x;

adding that will make an image to repeat vertically on your background. you can also add a repeating color after the image as well:

background: #000 url (../image/image.jpg) repeat-x;
It does not word at all,Somebody help?

Newbie

Posts

Joined
Fri Mar 20, 2009 7:41 pm

Post by dramony » Sun Apr 11, 2010 7:13 pm

edit the file stylesheet.css and search for

Code: Select all

body {
   margin: 0px;
   padding: 0px;
   text-align: center;
   background-color:#000;
}
Change to

Code: Select all

body {
   margin: 0px;
	padding: 0px;
	background: url('../image/bg.jpg') repeat-x;
	background-color:#000;
}
change image.jpg to your desired backgroud image

Active Member

Posts

Joined
Sat Oct 24, 2009 12:34 pm

Post by Limegreen » Thu Nov 04, 2010 5:06 pm

Hi,

I've only just recently started using OpenCart and so far it looks really good for an opensource solution.

To give you a little background, I own and run a Print Management company, which has a sister company which is fixed price printed goods - for this I use Volusion as at the time it seemed the best option, especially with the promise of the best customer service in the world! In a nutshell not too happy with them.

So now, I have the ability to offer over 21,000 office stationery products on a next day delivery - which really compliments my print group. Thats where Opencart came in, and now I am just trying to customise the design.

I have a header on my Volusion website that I have copied, and manipulated in Illustrator. I have the Firefox add on that allows me to edit CSS from viewing a webpage - this is just a visual, and wont change any HTML, CSS etc permanently.

But I just followed the instructions above, opened my Stylesheet.css in Dreamweaver edited it to the same as i input in the firefox editor, saved it, deleted original from FTP, uploaded new one, refreshed web page, but nothing?

Am I doing some thing wrong?

The CSS segment I have changed is below;

body {
margin: 0;
padding: 0;
text-align:center;
background: url('http://www.limegreenofficeproducts.com/ ... header.jpg') repeat-x;
background-color:#f8f8f8;
}



I appreciate anyones help.


Regards


Limegreen

Newbie

Posts

Joined
Thu Nov 04, 2010 4:57 pm

Post by dramony » Thu Nov 04, 2010 5:38 pm

First, are you using another Template other than the DEFAULT template?

Second, dont just delete the original file, create another copy of it then rename it like stylesheet-original.css.
So you have a backup of the original file.

Third, upload your image on catalog\view\theme\DEFAULT\image so that you're not exposing your directories.
So that if you want to call the image file, just put

Code: Select all

background: url('../image/bg.jpg');
instead of the complete URL that you did.

Active Member

Posts

Joined
Sat Oct 24, 2009 12:34 pm

Post by Limegreen » Thu Nov 04, 2010 5:58 pm

Thanks Dramony,

I am indeed using the default theme.

The funny thing is, that because I was not seeing the header, or colour i specified I deleted the stylesheet.css from the ftp, refreshed it to take effect, and then refreshed my web browser but nothing changed?

Should it have looked all crazy without the sylesheet?

Do I just upload to the 'catalog\view\theme\DEFAULT\image' folder by using the FTP, as I couldn't see a way to do it using the dashboard without allocating it to either the logo, or thumbnail etc.. There was no way to upload general images if that makes sense.

Appreciate the advice on the folder thingy, I'll try that now.

But considering what I have told you, and shown you - shouldn't the webpage have looked correct, or is it purely down to the location of the image? And would that effect the background colour too?

Seems odd no?


Limegreen

Newbie

Posts

Joined
Thu Nov 04, 2010 4:57 pm

Post by dramony » Thu Nov 04, 2010 6:11 pm

I tried the code that you have provided for the css and it worked fine on my end.
Maybe you have altered something else or uploaded to the wrong directory.

Active Member

Posts

Joined
Sat Oct 24, 2009 12:34 pm

Post by Limegreen » Thu Nov 04, 2010 6:18 pm

Just realised what I did Dramony.

I'm a muppet!

I altered the stylesheet.css in the admin/view/stylesheet/ folder - is that bad, and will it mess anything else up?

Also, just followed your instructions carefully this time and it worked a treat - thanks buddy.

You think I'll get any problems with the above though?


Limegreen.

Newbie

Posts

Joined
Thu Nov 04, 2010 4:57 pm

Post by dramony » Thu Nov 04, 2010 6:28 pm

It will mess up your backend, just revert it with the original admin css file.
You're welcome.

Active Member

Posts

Joined
Sat Oct 24, 2009 12:34 pm

Post by Limegreen » Thu Nov 04, 2010 6:50 pm

sh*te!

Just logged into the admin console and - yep, it's all over the place.

I know this is a big ask buddy - but anychance you might be able to send me over the original stylesheet.css for the admin panel please?

I'm on a mac (not sure if that matters), or if you cant send it, could you steer me in the right direction please.

Appreciate all your help.


Limegreen

Newbie

Posts

Joined
Thu Nov 04, 2010 4:57 pm

Post by Limegreen » Thu Nov 04, 2010 6:53 pm

actually, i suppose just that body segment I was playing with will do - dont need the whole shabang.


Limegreen

Newbie

Posts

Joined
Thu Nov 04, 2010 4:57 pm

Post by dramony » Fri Nov 05, 2010 11:24 am

get the files you need from the OC zip file(installer).

Active Member

Posts

Joined
Sat Oct 24, 2009 12:34 pm

Post by freni32 » Thu Nov 18, 2010 4:14 am

Can anyone help me on this? I did the above things in this post above and it only applied the background to the top part of the webpage header. I want this to be in the entire background of my entire website:

See here: http://www.funeralhomeflowers.org


If I already did the above edit to the body and it only did that part, what else would I need to change to make it work on the entire page the background?

New member

Posts

Joined
Wed Sep 08, 2010 5:48 am

Post by De[v] » Thu Nov 18, 2010 6:30 am

freni32 wrote:Can anyone help me on this? I did the above things in this post above and it only applied the background to the top part of the webpage header. I want this to be in the entire background of my entire website:

See here: http://www.funeralhomeflowers.org


If I already did the above edit to the body and it only did that part, what else would I need to change to make it work on the entire page the background?
http://forum.opencart.com/viewtopic.php?f=21&t=22895

New member

Posts

Joined
Mon Nov 15, 2010 11:21 am

Post by KuriN » Sat Feb 05, 2011 5:05 am

I have another issue... I am using village black theme and as you know on widescreens the background is clearly visible on the two sides of website.

What i want to do is put for example photos of two people touching the website (I know it sounds weird :) ) on each side.

Like this side for example: http://www.izkushenia.eu/

Any help?

New member

Posts

Joined
Mon Jan 31, 2011 6:15 pm
Who is online

Users browsing this forum: No registered users and 27 guests