Jump to content
burt

Responsive osCommerce - Bootstrap

Recommended Posts

http://wsfive.com/bs-master/index.php

 

 

so far, more in the works.

 

header search form, language dropdown, currency dropdown, and navbar greeting are all done using a function, just place a simple call in and show it.

 

Planning to do the same with the shopping cart.

 

By the time the header is filled up, there wont be many infoBoxes left to display!

Hi

Had a quick look around this morning on the phone (HTC wildfire). Overall lokks good only found:

- New Products have some products where the price overlaps the product title.

Is there one perferred template to comment on, or is look at both and comment?

/Jesper

Share this post


Link to post
Share on other sites

@@kvadre thank you Jesper. Look at both and comments are welcome as Garys is a scratchpad of ideas and mine is the present "master" into which some of those idea will go.


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

I really think this has come along nicely. Trying to get things to play nicely on wide variety of viewports is a huge undertaking.

 

Have you guys thought about IE8 or IE7 at all? I know they are ancient but some people still use them. I know respond js and html5shiv work well for IE8 but bs3 crumbles with IE7.

Edited by mattjt83

Matt

Share this post


Link to post
Share on other sites

@@mattjt83 - we need more help from people who have already played with BS...throw me any code you have if you don't want to git it....

:thumbsup:


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

@@burt

 

This helps with most of the issues I was talking about:

 

https://github.com/coliff/bootstrap-ie7

http://getbootstrap.com/getting-started/#support-ie8-respondjs

https://code.google.com/p/html5shiv/

 

<!--[if lt IE 9]>
<script src="js/html5shiv.min.js"></script>
<script src="js/respond.min.js"></script>
<![endif]-->
<!--[if lt IE 8]>
<link href="css/bootstrap-ie7.css" type="text/css" rel="stylesheet" />
<![endif]-->


Matt

Share this post


Link to post
Share on other sites

We're already calling in shiv and respond;

 

https://github.com/gburton/osCommerce-2334-bootstrap/blob/master/includes/template_top.php#L35-L40

 

I suppose this should be changed to grab the files locally than externally.


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

All, I am particularly interested in viewing examples (for inspiration) of what you view as a good/great footer area (of any ecommerce website).


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

Reviews Functionality is now complete;

 

1. Shop Owner can choose to show the normal reviews infobox OR they can include the best x number of shortened reviews directly in the product page:

http://www.template.me.uk/2334bs3/product_info.php?products_id=19

 

2. The main reviews page is now updated to show reviews in a similar format

Now:

http://www.template.me.uk/2334bs3/reviews.php

 

Previously:

http://demo.oscommerce.com/reviews.php

 

3. Individual Reviews are NUKED. Instead the FULL review shows on the product review page, previously only a cutdown portion of the review showed on this page + the full review on its own page:

Now:

http://www.template.me.uk/2334bs3/product_reviews.php?products_id=19

 

Previously:

http://demo.oscommerce.com/product_reviews.php?products_id=19

and

http://demo.oscommerce.com/product_reviews_info.php?products_id=19&reviews_id=1

 

Hopefully you will agree that all of these changes are long overdue and make the whole reviews system more satisfying and better looking.


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

All, I am particularly interested in viewing examples (for inspiration) of what you view as a good/great footer area (of any ecommerce website).

 

Speaking of which, any interest in a footer module area? I added a call in the infoBoxes to select footer, and then a short jQuery wrap function to help keep the widths identical to the infoBoxes in the left and right column.

 

http://wsfive.com/bs-master/index.php

 

In my example I have information, best sellers and a new banner box. You'll notice that the banner spans the area that would normally fit 2 infoBoxes. When the banner box is loaded, jQuery picks up on it and changes the col-md-* class. However, if the banner were to be loaded in left/right column then it would just fit like any other infoBox -( of course the banner would need changed to one made to fit there_.


Follow the community build:

BS3 to osCommerce Responsive from the Get Go!

Check out the new construction:

Admin Gone to Total BS!

Share this post


Link to post
Share on other sites

I'm not sure which route to go for the Footer - whether to come up with some system to allow infoboxes to be placed in the footer, or to simply hardcode the footer. Depends on what people view as a "good" footer I guess and what of those good footers already exist in infoBoxes...

 

Undecided...

 

If we go down the route of being able to place infoBoxes, we definitely need to style those boxes in a different way the usual "panel" - I like the style of footer a bit like this: http://www.template.me.uk/stuart/ maybe not with categories in the footer, but maybe something like the information infobox.

Edited by burt

This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites
we definitely need to style those boxes in a different way

 

Agreed - my next plan is to simply overwrite the panel class for anything in the footer so things look more like they do in your example.


Follow the community build:

BS3 to osCommerce Responsive from the Get Go!

Check out the new construction:

Admin Gone to Total BS!

Share this post


Link to post
Share on other sites

@@burt

 

respond .js is a pain to get to work over a cdn and I didn't see a reference to the ie7 compatibility so I'm guessing it was excluded on purpose or just forgotten.

 

The footer in your stuart template is nice :)


Matt

Share this post


Link to post
Share on other sites

I vote for footer modules that implement stuart design.


KEEP CALM AND CARRY ON

I do not use the responsive bootstrap version since i coded my responsive version earlier, but i have bought every 28d of code package to support burts effort and keep this forum alive (albeit more like on life support).

So if you are still here ? What are you waiting for ?!

 

Find the most frequent unique errors to fix:

grep "PHP" php_error_log.txt | sed "s/^.* PHP/PHP/g" |grep "line" |sort | uniq -c | sort -r > counterrors.txt

Share this post


Link to post
Share on other sites

I'm not sure which route to go for the Footer - whether to come up with some system to allow infoboxes to be placed in the footer, or to simply hardcode the footer. Depends on what people view as a "good" footer I guess and what of those good footers already exist in infoBoxes...

 

Undecided...

 

If we go down the route of being able to place infoBoxes, we definitely need to style those boxes in a different way the usual "panel" - I like the style of footer a bit like this: http://www.template.me.uk/stuart/ maybe not with categories in the footer, but maybe something like the information infobox.

 

I personally like the way the new version of prestashop handles the footer

 

http://v16a1.prestapoint.com/en/

 

Here is an idea for layout etc that I have on one of my development stores


Bootstrap 3 ROCKS!

(or it will if I ever get my head around it lol)

(and I think I have now (w00t) )

Share this post


Link to post
Share on other sites

I'm not sure which route to go for the Footer - whether to come up with some system to allow infoboxes to be placed in the footer, or to simply hardcode the footer. Depends on what people view as a "good" footer I guess and what of those good footers already exist in infoBoxes...

Hi Burt,

 

As for me I would like to get rid of the complete right column and therefore put contents of infoboxes (e.g. information, contact us, reviews) into the footer, maybe some content like languagues, currencies and/or search into the header - and all others which are really necessary for the purchase process, into the left column. (I did that sometimes in a jquery shop, but am not yet familiar enough with BS to do that again with BS :blush: )

Hardcoded or not makes no difference for me, but it would be a nice feature, if one could select footer contents similar to your reviews feature on the product_info....

 

Regards

J.J.

Share this post


Link to post
Share on other sites

I'm for a simple footer, often it gets big and dominating, which I think "Stuart" is.

 

I would wote for a system where you select what goes in.

 

/Jesper

Edited by kvadre

Share this post


Link to post
Share on other sites

I would like to find some payment icons (they have to be MIT licensed for commercial use and have no restriction on distribution). If anyone comes across some, please post.

 

@@De Dokta - the other user in the German Forum is clueless, needs to be educated ;)

Edited by burt

This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

Bear in mind also, that making a modular system does limit the shopowner in what they can do (until they know how to get past the standard functions and extend it themselves), or pay a developer to extend it. Does that matter ?

 

It's up to you guys to have a think about that, and provide feedback on your thoughts to this thread. In essense, Magento went this way (making things easy at first glance, but incredibly difficult when first glance becomes unwanted) - and that is what a lot of people hate about Magento....


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

Hi

 

Reviews look great :thumbsup:

 

Stuart and prestashop footers are similar. But prestashop creates many contrast errors with the choice of colours. Check them here http://wave.webaim.org/

 

Regards

 

Ken

Share this post


Link to post
Share on other sites

.. put contents of infoboxes (e.g. information, contact us, reviews) into the footer, maybe some content like languagues, currencies and/or search into the header - and all others which are really necessary for the purchase process, into the left column

IMO, this is the key to good design. Too many stores have information scattered around the place - keep related items together, where possible and try to group in terms of function.

 

A few examples of live stores (though nobody's saying they're perfect):

http://www.technogroom.co.uk/catalog/

http://macupgrade.eu/catalog/

These are just to illustrate the point of grouping, particularly with scope for enhancements/extensions, for example to display with/without tax (a requirement in some EU countries). Note: it's only the index page that I'm focussed on here - not the underlying page structure etc. Also, the footer in both cases had to be manually 'tweaked' to achieve those layouts, with the displayed contents.

Edited by ejsolutions

Share this post


Link to post
Share on other sites

Bear in mind also, that making a modular system does limit the shopowner in what they can do (until they know how to get past the standard functions and extend it themselves), or pay a developer to extend it. Does that matter ?

 

It's up to you guys to have a think about that, and provide feedback on your thoughts to this thread. In essense, Magento went this way (making things easy at first glance, but incredibly difficult when first glance becomes unwanted) - and that is what a lot of people hate about Magento....

 

Hi

 

Please keep it simple.

 

All this requires is a few simple links placed in the footer. Or create a new file called footer_links.php which can be included in the footer.

 

No need for complicating this by involving admin and extra database queries.

This could be made into an add-on if required.

 

Regards

 

Ken

Share this post


Link to post
Share on other sites

Bear in mind also, that making a modular system does limit the shopowner in what they can do (until they know how to get past the standard functions and extend it themselves), or pay a developer to extend it. Does that matter ?

 

I think for the long term well being of osCommerce, modular is the way to go. That would allow so many more newcomers to get right along with their shop goals more easily, thus attracting that audience which I believe is important for osCommerce future. If someone wants to delve into coding they can, or as mentioned hire a pro for specific work.


I am not a professional webmaster or PHP coder by background or training but I will try to help as best I can.

I remember what it was like when I first started with osC. It can be overwhelming.

However, I strongly recommend considering hiring a professional for extensive site modifications, site cleaning, etc.

There are several good pros here on osCommerce. Look around, you'll figure out who they are.

Share this post


Link to post
Share on other sites

Heres where I'm at, all controlled modularly. These are infoboxes which look different in the footer and normal if in the side columns. Thoughts ?

 

I am in desperate need of some payment icons (vias, mastercard, paypal) which must be GPL or MIT license and distributable. Anyone got any or know where to get some?


This is a signature that appears on all my posts.  
IF YOU MAKE A POST REQUESTING HELP...please state the exact version
of osCommerce that you are using. THANKS

 
Get the latest Responsive osCommerce CE (community edition) here

Share this post


Link to post
Share on other sites

Heres where I'm at, all controlled modularly. These are infoboxes which look different in the footer and normal if in the side columns. Thoughts ?

 

I am in desperate need of some payment icons (vias, mastercard, paypal) which must be GPL or MIT license and distributable. Anyone got any or know where to get some?

 

I like it. I changed some classes on mine, so it now looks different in the footer than the side column.

The account box in yours is something I think is needed.

 

I was also thinking a simple text box, which the store owner control's by way of the modules language file. This makes it modular, yet also easily customizable without a lot of markup.


Follow the community build:

BS3 to osCommerce Responsive from the Get Go!

Check out the new construction:

Admin Gone to Total BS!

Share this post


Link to post
Share on other sites
Guest
This topic is now closed to further replies.

×