A Basic Guide to Customising OScommerce

paulb · #1 11-25-2005, 02:43 PM

A few people seem to be asking about how to change the default set-up in Oscommerce after downloading it via Fantastico, so I thought I would post a basic guide to transforming the default shop you get.

When you first come across the default shop it can be a little confusing because it gives instructions on the home page of how to change the text etc. What it doesn’t tell you is that you can’t do this from the admin panel, if you do you will more than likely get parse errors. What you have to do is edit the files directly off the server using a php editor.

Don’t worry it isn’t as hard as it sounds, basically you are not writing php code just altering it, which is pretty straight forward if you follow the instruction carefully.

Ok firstly you need a php editor to make life easy, I use a free one just search for the many free ones in Google

Simply download the php editor to your desktop set it to default for all php pages and when you double click on any php pages in blueftp it opens the page for editing.

So open Blueftp and find your shop, the rest is just following the file routes as follows. The following files will either be located in “catalog” or “admin” if you have loaded your shop into the route directory then you won’t have catalog, but just treat it the same i.e., where it says catalog/includes this will just be /includes if you don’t have catalog

Always save the original file to your hard drive before editing, that way if you have problems you can just upload the original file again.

How to change the home page text

Catalog/includes/languages/English/index.php … you will see where the text is to be changed. Save and upload to overwrite the old file.

Also here you change the title “what’s new here” in two place approx line 22 and line 40. This title is controlled from the stylesheet, so if you want to make it bigger or a different colour then that’s the place.

How to change the look and feel colours etc

Oscommerce uses a stylesheet to keep the look and feel consistent throughout the website. You can change the colours; font sizes etc, use an html colour chart to get the colour code you want. Just type in html true colour chart into Google and you will find lots of free ones. The style sheet is located here,

Catalog/stylesheet.css

When you change the box colours on your website you will notice that the corners of the boxes have not changed, this is because strangely they are images. They can be found not in the style sheet but in

Catalog/images/infobox there are four that need changing to the colour you chose in the stylesheet. We use a common package like Paint to do this. Just change the pixels using the editor in paint.

How to upload your banner

As most images in OSC are called from code elsewhere it’s best to simply upload your image with the same code. Theexisting header image is oscommerce.gif so all you need to do is design you banner and then save it as oscommerce.gif and upload it to replace the default one. The size of the banner should be exactly 780 X 110 pixles.

You upload it here,

Catalog/images

How to delete the three small images next to the banner

Catalog/includes/header.php …. On line 58 put // in front of the code (this comments it out) if this doesn’t work then you can take out the line of code completely

How to change the top left menu items “top and “catalog”to Home and Shop

Two files need altering here,

1) catalog/includes/application_top.php

in line 466 HEADER_TITLE “change TOP to HOME”

in line 467 HEADER_TITLE “change CATALOG to SHOP”

2) catalog/includes/languages/English.php

in line 55 HEADER_TITLE “change both TOP words to Home”

in line 56 HEADER_TITLE “change both CATALOG words to SHOP”

How to turn off the OSC banner at the bottom

This is something that you can do from the admin section and not directly on the server. Go to your admin section (blue screen) select

tools/banners

You will see a red and green dot next to it, click the red dot to turn it off, DO NOT delete the banner totally as it is part of a banner group that needs to stay.

That’s about it, this should give you a basic look a feel, there is more to do but this is the main part done. If you have any problems post them and I will try to help. Also check out the osc forums. Remember before altering any pages always back up to your local drive

Paul

VodaHost · #2 11-25-2005, 02:52 PM

Very well said...

reformedman · #3 07-28-2007, 06:21 PM

How do you move the right and left boxes around. Say for example I want to move the "Information" box from default lower left to lower right?

Thanks in advance.

gustojeda · #4 08-30-2007, 04:18 PM

In my experience with oscommerce the best way to change the layout completely is to download Simple Template System (STS) from oscommerce.com (http://www.oscommerce.com/community/...all/search,sts)

You need some CSS knowledge, but overall it is easy to install and use.

Regards,

Gus

myasports · #5 09-06-2007, 10:09 AM

Paul.

Can u give me the link to the free php editor u r using?

I search at google, I am now more confused than ever. Pls help.

Vasili · #6 09-09-2007, 08:37 AM

You will find one of the best Free php Editor Downloads here.

..Remember to bookmark the osCommerce Support Community (available using the link in my signature below) to take advantage of the many new solutions you can take advantage of, now that the newest version has stabilized.

Similar Threads
Thread	Thread Starter	Forum	Replies	Last Post
Google Guide	VodaBot	Google	20	04-07-2008 01:28 PM
OsCommerce vs. ZenCart vs Paypal	jodest73	Zen Cart	4	08-15-2007 12:36 PM
The Hard Drive Buyers Guide	VodaBot	Personal Computer Forum	1	12-20-2005 12:50 PM
osCommerce Images	Sarah	Scripts & Fantastico	3	10-26-2005 04:24 PM

Currently Active Users Viewing This Thread: 1 (0 members and 1 guests)