Latest News: (loading..)

Archived

This topic is now archived and is closed to further replies.

toyicebear

Basics for Design V2.3+

178 posts in this topic

Basics for Design - osCommerce V2.3+

 

Since the new 2.3+ version of osCommerce have some major design related differences to the older versions, i have made this new updated basics for osCommerce design topic.

 

Changing the shop logo

 

In the store admin under Configuration >> Store Logo you can upland your own logo.

 

Changing boxes, right and left columns

 

In the store admin under Modules >> Boxes you can control which boxes to show and if they should be shown in the right or the left column.

 

If you place all the wanted boxes in just 1 column, only that column will show and the site content will automatically fill the rest of the width.

 

The main files for design changes are:

 

1. includes/template_top.php

2. includes/template_bottom.php

3. stylesheet.css

 

In some cases you might find a need to edit these 2 files.

- includes/header.php

- includes/footer.php

 

2.3+ design is DIV/CSS based and also uses to "standardized" systems Grid960 and jQuery UI.

 

Grid960 is basically what controls the structure/layout of the webshop.

 

The files are located here: ext/960gs/

 

You can find more information about the 960 Grid System CSS Framework at www.960.gs

 

jQuery UI controls buttons, boxes, listings ++

 

The files are located here: ext/jquery/ui/

 

You can find information, download new themes or create your own themes at www.jqueryui.com

Ingram, jcsls6, al3ks and 3 others like this

Share this post


Link to post
Share on other sites

Was just about to come and start a thread for 2.3 design changes :)

Share this post


Link to post
Share on other sites

Was just about to come and start a thread for 2.3 design changes :)

 

Feel welcome to fill out this one with more info.. :)

Share this post


Link to post
Share on other sites

Oh thank you! I haven't read it all yet but I am thrilled that there's a "how-to" for implementing your own design / which files to change ... etc.

I can't wait to read it all when I get my design approved!

Cindy

Share this post


Link to post
Share on other sites

I'm sorry if this is an obvious question, but I uploaded my new logo and it was big behind all of the rest of the wording for the store, so I shrunk my logo and reloaded it, but it is still covered by the rest of the store. Can I move all the wording down? I've been reading all the comments and just haven't found the answer yet. I'm hoping you can help me.

Thanks.

mouse17 likes this

Share this post


Link to post
Share on other sites

I'm sorry if this is an obvious question, but I uploaded my new logo and it was big behind all of the rest of the wording for the store, so I shrunk my logo and reloaded it, but it is still covered by the rest of the store. Can I move all the wording down? I've been reading all the comments and just haven't found the answer yet. I'm hoping you can help me.

Thanks.

 

You have several options.

 

1. Make the logo in about the same size as the original logo. (200px × 50px)

 

or

 

2. Edit stylesheet.css to change the appropriate style classes for header/logo.

 

or

 

3. Edit includes/header.php to suit your needs.

cdresor likes this

Share this post


Link to post
Share on other sites

2.3+ design is DIV/CSS based and also uses to "standardized" systems Grid960 and jQuery UI.

 

 

Is 2.3+ version of OSC then CSS-based and not table-based layout?

Oh my gosh - I have been looking at the "Convert PRoduct listings to table-less CSS" contribution and thread.

I was looking for an OSC to CSS add-on for version 2.3.1 - but is 2.3.1 already table-less? I can't believe I am looking to change what might already be changed ...

 

Thanks -

Cindy

Share this post


Link to post
Share on other sites

Is 2.3+ version of OSC then CSS-based and not table-based layout?

Oh my gosh - I have been looking at the "Convert PRoduct listings to table-less CSS" contribution and thread.

I was looking for an OSC to CSS add-on for version 2.3.1 - but is 2.3.1 already table-less? I can't believe I am looking to change what might already be changed ...

 

Thanks -

Cindy

 

 

Yes, 2.3+ is "more or less" table-less

burningsoul likes this

Share this post


Link to post
Share on other sites

please sir can you help me to add video upload option in admin panel please please :'(

 

 

Its already there....when adding or editing a product you can add "extra large images" , this can also be used for video

Share this post


Link to post
Share on other sites

Hi, can someone tell me how to remowe those two white bars between HEADER and BACKGROUND??

Go to www.barnsparadis.com to see the problem.

Share this post


Link to post
Share on other sites
Hi, can someone tell me how to remowe those two white bars between HEADER and BACKGROUND??

Go to www.barnsparadis.com to see the problem.

 

In includes/header.php

 

Try to change:

<div id="header" class="grid_24">

To:

<div id="header">

Share this post


Link to post
Share on other sites

Feel welcome to fill out this one with more info.. :)

 

Hi

If upgrading a v2.2 rc2 install what are the benefits of v2.3.1, ie is it beneficial to change, my situation is I do not really have a running store yet it was more or less ready to upload further products and add or open payment gateways, styling had been finished

 

so can styling and written content and/or products be easily transferred over to a new 2.3.1 install, your recommendations appreciated

 

thankyou

Share this post


Link to post
Share on other sites

Hi

If upgrading a v2.2 rc2 install what are the benefits of v2.3.1, ie is it beneficial to change, my situation is I do not really have a running store yet it was more or less ready to upload further products and add or open payment gateways, styling had been finished

 

so can styling and written content and/or products be easily transferred over to a new 2.3.1 install, your recommendations appreciated

 

thankyou

 

 

With some "adjustments" you can import over content like products, categories, manufacturers.

 

The advantage of using 2.31 is that its much more secure than 2.2RC2a , its much easier to work with "design" wise and all the new add-ons which is coming is mostly for 2.3+.

Share this post


Link to post
Share on other sites

Hi, can someone tell me how to remowe those two white bars between HEADER and BACKGROUND??

Go to www.barnsparadis.com to see the problem.

Excuse me , but how you made the white box to cover the contents? I'm a new member.Thank you very much

Share this post


Link to post
Share on other sites

Hi I've been working on creating a v2.3.1 install without the shopping cart and account log on, trying to end up with an information only site.

 

Could we collaborate on this.

 

ken

Share this post


Link to post
Share on other sites

Thanks Nick,

 

Sometimes its hard to see the wood for trees, I'd already downloaded this add-on and sort of lost it within my osc downloads folder, I guess that means its time to sort out the folder filing system, doh

:huh:

 

ken

 

 

 

Share this post


Link to post
Share on other sites

Hi,

 

I installed oscommerce 2.3.1 some time ago and decided to go with this instead of Magento or OpenCart. I am doing some changes to the basic design but I haven`t managed to figure out how I can remove the spacing between the 3 columns so that they appear as one. I have spent quite some time trying myself and have also searched for an answer in the forum and on the net unsuccessfully. I would be grateful if anyone could tell me how to do this!

 

Best regards.

Share this post


Link to post
Share on other sites

Hi,

 

I installed oscommerce 2.3.1 some time ago and decided to go with this instead of Magento or OpenCart. I am doing some changes to the basic design but I haven`t managed to figure out how I can remove the spacing between the 3 columns so that they appear as one. I have spent quite some time trying myself and have also searched for an answer in the forum and on the net unsuccessfully. I would be grateful if anyone could tell me how to do this!

 

Best regards.

 

The "spacing" is controlled by the grid960 system , you can edit the css file ext/960gs/960_24_col.css or make a new one at: www.960.gs

Share this post


Link to post
Share on other sites

Anymore info on importing a theme from www.jqueryui.com ?

 

Ive downloaded a them but dont know how to install it

Share this post


Link to post
Share on other sites