Jump to content
burt

Bootstrap 3 in 2.3.4 - Responsive from the Get Go

Recommended Posts

here is code snippet for checkout payment selection area :

 

 <!-- payment methods -->
 <div id="payment-select" class="row">
   <div class="col-md-12">
  <div class="panel panel-default">
    <div class="panel-heading"><?php echo TABLE_HEADING_PAYMENT_METHOD; ?></div>
    <?php
	 $selection = $payment_modules->selection();
	 if (sizeof($selection) > 1) {
	 ?>
	   <div class="panel-body">
		 <p><?php echo TEXT_SELECT_PAYMENT_METHOD ; ?></p>
	   </div>
	 <?php
	 } elseif ($free_shipping == false) {
	 ?>
	   <div class="panel-body">
		 <p><?php echo TEXT_ENTER_PAYMENT_INFORMATION; ?></p>
	   </div>
	 <?php
	 }
  ?>
	 <table class="table table-striped table-condensed">

	 <?php
	 $radio_buttons = 0;
	 for ($i=0, $n=sizeof($selection); $i<$n; $i++) {
	 ?>

	   <?php
	   if ( ($selection[$i]['id'] == $payment) || ($n == 1) ) {
		 echo '	  <tr id="defaultSelected" class="moduleRowSelected" onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, ' . $radio_buttons . ')">' . "\n";
	   } else {
		 echo '	  <tr class="moduleRow" onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, ' . $radio_buttons . ')">' . "\n";
	   }
	   ?>
	    <th class="col-md-11"><?php echo $selection[$i]['module']; ?></th>
	    <td align="col-md-1">
		  <?php
		  if (sizeof($selection) > 1) {
		    echo tep_draw_radio_field('payment', $selection[$i]['id'], ($selection[$i]['id'] == $payment),'required');
		  } else {
		    echo tep_draw_hidden_field('payment', $selection[$i]['id']);
		  }
		  ?>

	    </td>
	  </tr>
	  <?php
	  if (isset($selection[$i]['error'])) {
	  ?>
	    <tr>
		  <td class="error" colspan="2"><?php echo $selection[$i]['error']; ?></td>
	    </tr>
	  <?php
	  } elseif (isset($selection[$i]['fields']) && is_array($selection[$i]['fields'])) {
	  ?>
	    <tr>
		  <td colspan="2"><table style="border:none;">
		  <?php
		  for ($j=0, $n2=sizeof($selection[$i]['fields']); $j<$n2; $j++) {
		  ?>
		    <tr>
			  <td style="border:none;"><?php echo $selection[$i]['fields'][$j]['title']; ?></td>
			  <td style="border:none;"><?php echo $selection[$i]['fields'][$j]['field']; ?></td>
		    </tr>
		  <?php
		  }
		  ?>
		  </table></td>
	    </tr>
	  <?php
	  }
	  ?>
    <?php
    $radio_buttons++;
    }
    ?>
    </table>
  </div>
   </div>
 </div>
 <!-- payment methods -->


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

Also, have noticed when using a credit cart with input on checkout_confirmation, the area is split into two columns, on the left is a blank alert alert-danger div and the right is the alert alert-info div with the CC fields

 

<?php echo $confirmation['title']; ?>

 

Where does that come from ? In the standard osc tables layout, that consists of nothing so the td is "collapsed"...

 

I can't recall where that is set in osc


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 current code (community-supported responsive 2.3.4.1BS Edge) here

 

Share this post


Link to post
Share on other sites

@@grandpaj

 

I built one that works, (Ive used it for various clients for a few years now) you can see it in my demo if you look at my post just a few up.

 

When this build is released I will add it as a contribution, but as a general precaution, something like that would not be advisable for a core release for at least couple of reasons -

 

1) It's more info to capture in one shot, which can cause conflicts under certain situations, and more maintenance.

 

2) A lot of shops don't even use the checkout shipping page, if they sell virtual products, then that page can be bypassed completely. I coded my page not to display shipping methods/address at all if products are virtual, but really so no need to serve up more overhead if its not needed.

 

So if it fits a shops needs, its great, but only a small portion of shops would really benefit from it.


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

<?php echo $confirmation['title']; ?>

 

Where does that come from ? In the standard osc tables layout, that consists of nothing so the td is "collapsed"...

 

I can't recall where that is set in osc

 

I can find it in checkout_confirmation.php on any release I search on my local, and it's on Harald's latest release on GitHub line 238, https://github.com/haraldpdl/oscommerce2/blob/master/catalog/checkout_confirmation.php

 

But I cannot find any payment module that uses it, its just $confirmation['fields'][$i]['title'];

 

Maybe its very dated?


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

Maybe its very dated?

 

That's what I'm thinking...but to ensure it, how about;

 

   if (tep_not_null($confirmation['title'])) {
     echo '<div class="col-sm-6">';
     echo '  <div class="alert alert-danger">';
          echo $confirmation['title'];
     echo '  </div>';
     echo '</div>';
   }

 

This way, it's there if set, and not it not. I can't recall ever seeing or working with $confirmation['title'] ...


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 current code (community-supported responsive 2.3.4.1BS Edge) here

 

Share this post


Link to post
Share on other sites

@

Hi Gary,

Thanks for that, but dare I show how thick I am, but what .php file does the code in post #449 belong to.

 

many thanks

Grandpa

Edited by grandpaj

Share this post


Link to post
Share on other sites

http://www.template.me.uk/2334bs3/ is now an -exact- mirror of the Master Github.

 

I don't like to re-introduce tables into the checkout, it's not tabular data (well I suppose it is in a way, but...blah blah). So, I'm not going to reintroduce those. Tiger Striping can be done on the div based layout.


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 current code (community-supported responsive 2.3.4.1BS Edge) here

 

Share this post


Link to post
Share on other sites

For mobile views, in particular, is there really a need for the Categories and Manufacturers infoBoxes to be displayed, during the checkout process? It would make for a much cleaner interface with these hidden, if easily achievable.

The breadcrumbs and top logo provide entry points to other parts of the store, if required, plus there is the footer region for other possible relevant information (for example to check on terms & conditions).

[Also applicable to the account pages.]

Edited by ejsolutions

Share this post


Link to post
Share on other sites

EJ, that's a good idea, I like it. Inside the checkout, the person has already made that buying decision...

 

Anyone else got thoughts on that?


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 current code (community-supported responsive 2.3.4.1BS Edge) here

 

Share this post


Link to post
Share on other sites

Inside the checkout, the person has already made that buying decision...

Yes, no seller wants to distract a (potential) customer from the required/desired end result and at least the relevant info is close by, should they suddenly get 'cold feet' and want more info. The main reason for them shopping further might be to take potential advantage in keeping within a postage price, though that is probably rare and the forementioned entry points doesn't prevent them from looking further.

 

(Sorry, a bit cumbersome but hopefully you get my drift.)

Edited by ejsolutions

Share this post


Link to post
Share on other sites

Ok, I guess that's something that is up to the shopowner...here's the two shipping choices display'

 

Original, as is coded right now in Master;

 

 

 

Garys redesign;

 

 

 

Preference?

 

How about using listview/listgroup, http://getbootstrap.com/components/#list-group , and placing the radio before the text instead of after.

Share this post


Link to post
Share on other sites

Ok, I guess that's something that is up to the shopowner...here's the two shipping choices display'

 

...

Preference?

I prefer the Master version, with its' inline options - less "real estate" and better clarity, IMO. Though I do see the benefit of the alternative for smaller screens.

Edited by ejsolutions

Share this post


Link to post
Share on other sites

I don't like to re-introduce tables into the checkout, it's not tabular data (well I suppose it is in a way, but...blah blah).

Oh no, you didn't just go there did you? The age old debate continues --

How about using listview/listgroup, http://getbootstrap.com/components/#list-group , and placing the radio before the text instead of after.

I think that the list groups would actually work out very well. Its not that much to change a table to an unordered list.

 

I will convert over what I have redone and posy again.


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

Hi

 

Don't know whether Im out of line here or not, maybe Ive jumped the gun

 

I have just downloaded the latest Bootstrap from github and just playing around with it. For the life of me I can't find where you change widths (push pull etc) I was wanting to change the width of the columns and the width of the content, making the total content plus column/s just a little narrower than the header. Have looked in the index.php.

I must be blind as its probably quite obvious where all this is , can someone point me in the right direction.

 

 

Many thanks

Kind regards

Share this post


Link to post
Share on other sites

Manufacturer Info, Social Bookmarks and Notifications Infoboxes can now be shown direct in the product page (like how the reviews infobox works). See example at http://www.template.me.uk/2334bs3/product_info.php?products_id=1


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 current code (community-supported responsive 2.3.4.1BS Edge) here

 

Share this post


Link to post
Share on other sites

Manufacturer Info, Social Bookmarks and Notifications Infoboxes can now be shown direct in the product page (like how the reviews infobox works). See example at http://www.template.me.uk/2334bs3/product_info.php?products_id=1

 

Very nice! I like it.

 

On another note would it be possible to give the customer an option to change how my products are dispayed on say 'manufacuturer pages' . from 12/18/24 or even have a 'view all' button?

I know this can be done in the back end by shop owner but better to give the customers that option so they dont have to go through loads of pages to view your products.

 

Or something like this site would be awsome. More products load as you scroll down http://purpletag.ie/collections/boys . looks really nice on xs view ports

Edited by Mac Fly

Share this post


Link to post
Share on other sites

... or even have a 'view all' button?

This has to be optional, as stores with a large range of products get hammered by search bots, that 'helpfully' continue to choose this option - Google, in particular, is bad at asking for all products in the Search infoBox, for example.

Share this post


Link to post
Share on other sites

Hi Gary

 

The boxes on the product page are looking great.

 

Clicking Notifications takes me to the Login page, but once I have logged in I am then taken to the Index page. - That's not very intuitive!

Once I navigate back to the product I can finally click 'Notify me of Updates' but then nothing happens, something to tell me that I had successfully achieved it would be nice.

All I see is the text replaced with 'Do not Notify ...'

 

I don't have my phone handy at the moment to test but using Opera and Firefox the Manufacturers box disappears in phone view. Was this intentional?

 

Also

Why do the changes made to the install/oscommerce.sql never show at Github?

 

Regards

 

Ken

Share this post


Link to post
Share on other sites

Clicking Notifications takes me to the Login page, but once I have logged in I am then taken to the Index page. - That's not very intuitive!

 

I'll look into that.

 

All I see is the text replaced with 'Do not Notify ...'

 

That's standard osCommerce...but it would be nice to have a message to reinforce what the person just did.

 

I don't have my phone handy at the moment to test but using Opera and Firefox the Manufacturers box disappears in phone view. Was this intentional?

Yep.

 

Why do the changes made to the install/oscommerce.sql never show at Github?

 

https://github.com/gburton/osCommerce-2334-bootstrap/commits/master/install/oscommerce.sql

 

Shows the history of changes to the SQL file...


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 current code (community-supported responsive 2.3.4.1BS Edge) here

 

Share this post


Link to post
Share on other sites

On another note would it be possible to give the customer an option to change how my products are dispayed on say 'manufacuturer pages' . from 12/18/24 or even have a 'view all' button?

I know this can be done in the back end by shop owner but better to give the customers that option so they dont have to go through loads of pages to view your products.

 

Or something like this site would be awsome. More products load as you scroll down http://purpletag.ie/collections/boys . looks really nice on xs view ports

 

POssibly these things can be done as add-on's, why not ?


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 current code (community-supported responsive 2.3.4.1BS Edge) here

 

Share this post


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

×