Jump to content
  • Checkout
  • Login
  • Get in touch

osCommerce

The e-commerce.

Side bar design


lehvel

Recommended Posts

Hello!

I am new here, and to osCommerce in general, so I apologize if this is the wrong area to create this topic in, or if there already is a guide to this somewhere - so far I haven't been able to find the solution, though.

The thing is, I am in the middle of finishing the look of my oscommerce online store, and I'm happy with it except for the fact that the side bars (categories, search, information, shopping cart and the header with the top - catalog menu) remain unchanged.

What I've been doing is edit the stylesheet.css as I am not looking to do any drastic changes. I would just like to change the colour of the background and text, but nothing seems to affect the aforementioned modules.
What part of the stylesheet should have an effect on those exactly? Or should I look into some other file for these?

I did try and install the theme switcher but I just can't get it to work, and trust me, I tried. I even reinstalled the whole oscommerce at some point since it just didn't work. At this point, I would just like to stick to editing the .css and such, and not install any additional add-ons just for this.

Thanks in advance. Hope I can find some help here!

Link to comment
Share on other sites

Thanks for your input. I am using v2.3.4.1.

As said, I haven't managed to make the theme switcher work.

I tried the jQuery theme roller and managed to install a theme without using the addon in question, but now some of the links, for example the account/cart/etc. do not show up correctly. They look like there would be an error in the code somewhere (so they show up as basic blue text links, and the font/colour selections won't effect them), while the sections I had trouble with now show up the way I'd like them to. Is there something else I should adjust in addition to just applying the theme on the template_top file (as instructed here: https://www.oscommerce.com/forums/topic/369510-designing-new-themes-the-easy-way/?)

 

Link to comment
Share on other sites

Ok if you are using 2.3.4.1 you can do all you want by just using user.css. Just use your browser to inspect the elements you need to change copy the details to user.css and you done. for example to change navbar

image.thumb.png.9bcb6f8319249be24180e6aa7f0771c4.png

You see you can see .navbar-inverse and its color statements, on the right. Just do this for each element you need to change.

You can check if you have the right element by changing the color in the browser by clicking on the color and picking another

image.thumb.png.cdd5b15d2d75f3c74bcdb67a97a9609d.png

See here I picked background-color and changed it to red, its as simple as that.

Don't make any changes to the original files, just copy the elements you need to user.css and that will do it for you. So to change to red you just add this to user.css

.navbar-inverse {

background-color: #c23030;

border-color: #c23030;

}

That's it.

 

Link to comment
Share on other sites

@lehvel

You stated that you are using osC v2.3.4.1. Is this the 'official' version? Did you download it from this website, or install it through a one-click installation on your host's server?

Or, is this the 'Community Edition', that you would have had to download from Github?

M

Link to comment
Share on other sites

@JcMagpie

I agree, and ...

If @lehvel is running the 'official' version, you were telling him to change a file that doesn't exist. That's all I was saying.

Now, the idea of a user.css file is a good one. One could easily add one to the 'official' version with a simple edit to /includes/template_top.php. While core file changes are not encouraged, this is such a simple edit that I wouldn't have a problem with it. Plus, it allows the store owner to put ALL of their css edits in one place, and not touch any of the stock css files.

But, you already knew that ...

Link to comment
Share on other sites

2 hours ago, ArtcoInc said:

@JcMagpie

I do not think that the 'official' v2.3.4.1 has a user.css file. I think that was something that @burt added into the Community Edition (aka: Frozen).

M

Correct.  

  • stylesheet.css was deprecated
     
  • custom.css was added
    - custom.css is used for necessary .css going into core, this file should not be touched by anyone except those working on core
    - this file over-rides the bootstrap css file and the fontawesome css file
     
  • user.css was added
    - this is the only .css file that developers and shopowners should be using as this file will *never* be updated/changed as part of core
    - this file over-rides the bootstrap css file and the fontawesome css file and custom.css file
Link to comment
Share on other sites

Thank you all for your replies.

I am indeed using the official version which does not have a user.css file.

I'll look for the .navbar parts on stylesheet.css, but I'm pretty sure I've already changed those to no avail (if they are there, currently off my PC so I can't check).

Now, alternatively, adding the user.css file as suggested above; sounds like something I could do. Is there a link to download that file alone (or do I need something else in addition), and what is the edit I should do to template_top.php?

Link to comment
Share on other sites

@lehvel

First, how far are you into working on this site? If it's early, I *strongly* recommend that you start over with the Community Edition (link in my signature below).

The 'official' v2.3.4 (and v2.3.4.1 hot-patch) is very much out of date! the osCommerce project was lead by one person that has been absent for quite some time. In his absence, the "community" has continued with the development of osC. Unfortunately, that one missing person is the only one that can make this continued development an 'official' release.

The 'Community Edition' (also called osC-CE (for Community Edition), osC-BS (for Bootstrap, the platform it is based on), osC-Edge, osC-Final, and/or osC-Frozen. These are all different names for the same thing) is a big improvement over the last 'official' v2.3.4 release in a number of ways:

1) It is responsive. This means that it will adjust the screen layout depending on the size of the screen of your customer's device. This is very important in this day of mobile devices. The 'official' version is not responsive.

2) It will work with the newer version of PHP, the scripting language used in osC. As more and more hosts upgrade their servers to PHP 7.x, older versions of osC will crash.

3) It is much more modular. This means that you can turn features on or off, or even add new features, all without touching the core code.

M

Link to comment
Share on other sites

9 hours ago, ArtcoInc said:

@JcMagpie

I agree, and ...

If @lehvel is running the 'official' version, you were telling him to change a file that doesn't exist. That's all I was saying.

Now, the idea of a user.css file is a good one. One could easily add one to the 'official' version with a simple edit to /includes/template_top.php. While core file changes are not encouraged, this is such a simple edit that I wouldn't have a problem with it. Plus, it allows the store owner to put ALL of their css edits in one place, and not touch any of the stock css files.

But, you already knew that ...

I think people just need to slow down and actually read before posting responses, if you care to look at my first response you will see I make it very clear that the answer will depend on what version he is using! but in case you missed it here it is again, Hope that clears things up.

 

"depends which version you are using? This is an option or If your using BS or frozen then you can do most of this by just using user.css "

 

 

Link to comment
Share on other sites

Ok, I installed the boostrap version and now the theme switcher addon. I did everything according to instructions and everything seems ok, but every time I click on "save" when changing the theme on my admin panel, it tells me "template_top.php has not been modified!". First it says it has been modified, and when clicking save, it gives me that. What's wrong?

Also, when entering my store, the index page shows this:

Warning: require(DIR_WS_INCLUDESheader.php): failed to open stream: No such file or directory in /storage/ssd5/880/1562880/public_html/shop/includes/template_top.php on line 60

Fatal error: require(): Failed opening required 'DIR_WS_INCLUDESheader.php' (include_path='.:/usr/share/pear:/usr/share/php') in /storage/ssd5/880/1562880/public_html/shop/includes/template_top.php on line 60

I have not done any other changes to such files except for that - the exact change I was instructed to make. What should I do?

Link to comment
Share on other sites

@lehvel

In the latest Community Edition of osC, these directory paths are now all hard coded. It looks like Theme Switcher may have not been updated to include this.

In the Theme Switcher files, search for and replace all instances of 'DIR_WS_INCLUDES' with 'includes/'.

M

Link to comment
Share on other sites

A more basic question. Do you plan to keep changing the look of your site? some people have a look for summer and another for xmass and so on. That is what something like theme switcher is best used for. If all you want is to change the look of your site once then its much simpler to just use theme roller

https://www.bootpress.org/bootstrap/themeroller.html

Get the color look you want and simply use that instead of the stock theme, you can then make small changes as needed using the instruction shown using user.css

It really is quite simple to do.

Theme roller will work.

 

Link to comment
Share on other sites

 

1 hour ago, ArtcoInc said:

@lehvel

In the latest Community Edition of osC, these directory paths are now all hard coded. It looks like Theme Switcher may have not been updated to include this.

In the Theme Switcher files, search for and replace all instances of 'DIR_WS_INCLUDES' with 'includes/'.

M

Thank you very much, I'll try this if I decide to give the theme switcher another try! So far I've just been editing the user.css on this Community Edition, and so far I've been able to get everything to look the way I wanted to. I don't think I need to be using the theme switcher or theme roller after all. So, big thanks to you for suggesting the bootstrap, it turned out to be very helpful.

 

1 hour ago, JcMagpie said:

A more basic question. Do you plan to keep changing the look of your site? some people have a look for summer and another for xmass and so on. That is what something like theme switcher is best used for. If all you want is to change the look of your site once then its much simpler to just use theme roller

https://www.bootpress.org/bootstrap/themeroller.html

Get the color look you want and simply use that instead of the stock theme, you can then make small changes as needed using the instruction shown using user.css

It really is quite simple to do.

Theme roller will work.

I do intend to keep the same look all the time once I get it right. Thank you for the tips, though! I might look into them once I get everything else right!

Link to comment
Share on other sites

I figured since people seem to be so helpful here (thanks for that!) I'd try and ask this here as well:

Using the latest bootstrap version, could anyone tell me how do I remove the top banner (store name and cart) and move the cart module somewhere around the search bar or next to/on the opposite side of the home / top / catalog etc. menu/navigation bar?
Also, I'd like to remove the information banner on the bottom of the page and have the information module below the categories (which I figured how to do, but of course, it makes no sense having them there AND at the bottom).
I haven't done any other changes to the actual layout of the page, and am not using the theme switcher as of now, in case it has any effect on how these things should be done.

Thanks in advance!

Link to comment
Share on other sites

Oh, and two more things (sorry, I'm not that good with the coding part of this, heh):

1) Is there any way to add text to the shipping options site (at checkout)? I'd just like to have a small info text there about the shipping options. Possibly with the payment options as well.
2) Can I determine somewhere if State/Province is a required field? We don't really use those in our postal addresses around here, so I'd it to be an optional field if at all possible.

Link to comment
Share on other sites

11 minutes ago, lehvel said:

I figured since people seem to be so helpful here (thanks for that!) I'd try and ask this here as well:

Using the latest bootstrap version, could anyone tell me how do I remove the top banner (store name and cart) and move the cart module somewhere around the search bar or next to/on the opposite side of the home / top / catalog etc. menu/navigation bar?
Also, I'd like to remove the information banner on the bottom of the page and have the information module below the categories (which I figured how to do, but of course, it makes no sense having them there AND at the bottom).
I haven't done any other changes to the actual layout of the page, and am not using the theme switcher as of now, in case it has any effect on how these things should be done.

Thanks in advance!

Go to admin/modules  and you can edit the bits you need. Each on has some limited movement. It takes a little playing around to get things right. need to look at placement and sort order.

image.png.a87a3b09d27e41462615559271583d3f.png

to remove something just set it to false.

 

Link to comment
Share on other sites

10 minutes ago, lehvel said:

Oh, and two more things (sorry, I'm not that good with the coding part of this, heh):

1) Is there any way to add text to the shipping options site (at checkout)? I'd just like to have a small info text there about the shipping options. Possibly with the payment options as well.
2) Can I determine somewhere if State/Province is a required field? We don't really use those in our postal addresses around here, so I'd it to be an optional field if at all possible.

for 1 best to use this as with modular check out you can add thing without changing the core files.

https://apps.oscommerce.com/89uS9&modular-checkout-pages-bs&v=23

2 is defined by the store setup ie the country selected.

 

Link to comment
Share on other sites

Archived

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

×
×
  • Create New...