♥Tsimi Posted March 27, 2014 Share Posted March 27, 2014 I don't get that Gary....my screen very nicely goes from this to this... same here. no probs at all. Link to comment Share on other sites More sharing options...
♥Tsimi Posted March 27, 2014 Share Posted March 27, 2014 @@De Dokta Is this a local installation? (XAMPP) or is it burts shop? side note: micro$oft stopped the Win XP support. maybe it is time to move on to Win 7 (support till year 2020) or Win 8.1 (terrible menu handling!) :P Link to comment Share on other sites More sharing options...
burt Posted March 27, 2014 Author Share Posted March 27, 2014 @@Tsimi @@Dan Cole - it's an update I'm running on localhost. I'll update the test site in a bit. G Link to comment Share on other sites More sharing options...
burt Posted March 27, 2014 Author Share Posted March 27, 2014 Ok try the test shop now. Problem is at SM view (ipad size viewport). Does it matter that the nav splits over two lines at this size ? Link to comment Share on other sites More sharing options...
♥Tsimi Posted March 27, 2014 Share Posted March 27, 2014 @@burt now i can see it. but i can't go that far like you (see attached image) if i make the window smaller then that it goes to the XS style view mode. Link to comment Share on other sites More sharing options...
Ken44 Posted March 27, 2014 Share Posted March 27, 2014 @@burt The overlap only occurs for a few width settings. Maybe removing a couple of words word solve it. For Instance 'Special Offers' could become 'Specials' and 'Site Settings' to 'Settings' Link to comment Share on other sites More sharing options...
Dan Cole Posted March 27, 2014 Share Posted March 27, 2014 @@burt You probably already know this.. from the bootstrap site... Overflowing content Since Bootstrap doesn't know how much space the content in your navbar needs, you might run into issues with content wrapping into a second row. To resolve this, you can: Reduce the amount or width of navbar items. Hide certain navbar items at certain screen sizes using responsive utility classes. Change the point at which your navbar switches between collapsed and horizontal mode. Customize the @grid-float-breakpoint variable or add your own media query. Need help? See this thread and provide the information requested. Is your version of osC up to date? You'll find the latest osC community version (CE Phoenix) here. Link to comment Share on other sites More sharing options...
♥GLWalker Posted March 27, 2014 Share Posted March 27, 2014 Wow- been away a few days and look how much longer the thread grew! Good deal. So, looking further into the checkout process, I fell the actual process of selecting shipping and payment type is a bit clunky, I'm afraid real customers will become confused - as Ive seen the real customers become confused over the smallest little things. I redid the layout of the shipping methods, it uses tables again, but that is simply to give the end user a well defined area to make their choice from. Its not a bad table, it will still fit nicely in the various view ports, and it has been marked up with bootstrap. If anyone who has a version up could take this markup and place it in their checkout_shipping.php page, and give feedback, that would be great. I'll have it up in my demo site soon. Then I'll do the same for payment. <!-- shipping methods --> <div id="shipping-quotes" class="row"> <div class="col-md-12"> <div class="panel panel-default"> <div class="panel-heading"><?php echo TABLE_HEADING_SHIPPING_METHOD; ?></div> <?php if ( (sizeof($quotes) > 1 && sizeof($quotes[0]) > 1) && ($free_shipping == false) ) { ?> <div class="panel-body"> <p><?php echo TEXT_CHOOSE_SHIPPING_METHOD ; ?></p> </div> <?php } elseif ($free_shipping == false) { ?> <div class="panel-body"> <p><?php echo TEXT_ENTER_SHIPPING_INFORMATION; ?></p> </div> <?php } ?> <table class="table table-striped table-condensed"> <?php if ($free_shipping == true) { ?> <tr class="success"> <th colspan="3"><?php echo FREE_SHIPPING_TITLE; ?> <?php echo $quotes[$i]['icon']; ?></th> </tr> <tr id="defaultSelected" class="moduleRowSelected" onmouseover="rowOverEffect(this)" onmouseout="rowOutEffect(this)" onclick="selectRowEffect(this, 0)"> <td><?php echo sprintf(FREE_SHIPPING_DESCRIPTION, $currencies->format(MODULE_ORDER_TOTAL_SHIPPING_FREE_SHIPPING_OVER)) . tep_draw_hidden_field('shipping', 'free_free'); ?></td> </tr> <?php } else { $radio_buttons = 0; for ($i=0, $n=sizeof($quotes); $i<$n; $i++) { ?> <tr class="info"> <th colspan="3"><?php echo $quotes[$i]['module']; ?> <span class="pull-right" style="margin-right:15%;"><?php if (isset($quotes[$i]['icon']) && tep_not_null($quotes[$i]['icon'])) { echo $quotes[$i]['icon']; } ?></span></th> </tr> <?php if (isset($quotes[$i]['error'])) { ?> <tr class="error"> <td colspan="3"><?php echo $quotes[$i]['error']; ?></td> </tr> <?php } else { for ($j=0, $n2=sizeof($quotes[$i]['methods']); $j<$n2; $j++) { // set the radio button to be checked if it is the method chosen $checked = (($quotes[$i]['id'] . '_' . $quotes[$i]['methods'][$j]['id'] == $shipping['id']) ? true : false); if ( ($checked == true) || ($n == 1 && $n2 == 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"; } ?> <td class="col-md-9"><?php echo $quotes[$i]['methods'][$j]['title']; ?></td> <?php if ( ($n > 1) || ($n2 > 1) ) { ?> <td class="col-md-2"><?php echo $currencies->format(tep_add_tax($quotes[$i]['methods'][$j]['cost'], (isset($quotes[$i]['tax']) ? $quotes[$i]['tax'] : 0))); ?></td> <td class="col-md-1 text-right"><?php echo tep_draw_radio_field('shipping', $quotes[$i]['id'] . '_' . $quotes[$i]['methods'][$j]['id'], $checked); ?></td> <?php } else { ?> <td class="col-md-3 text-right" colspan="2"><?php echo $currencies->format(tep_add_tax($quotes[$i]['methods'][$j]['cost'], (isset($quotes[$i]['tax']) ? $quotes[$i]['tax'] : 0))) . tep_draw_hidden_field('shipping', $quotes[$i]['id'] . '_' . $quotes[$i]['methods'][$j]['id']); ?></td> <?php } ?> </tr> <?php $radio_buttons++; } } } } ?> </table> </div> </div> </div> <!-- shipping methods --> Follow the community build: BS3 to osCommerce Responsive from the Get Go! Check out the new construction: Admin Gone to Total BS! Link to comment Share on other sites More sharing options...
burt Posted March 27, 2014 Author Share Posted March 27, 2014 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? Link to comment Share on other sites More sharing options...
Dan Cole Posted March 27, 2014 Share Posted March 27, 2014 @@burt I like them both.... :P The Master example I like because the information for a particular choice is on the same line. With Garys I like the fact that they are clearly shown as separate choices. How about the master being output to a bootstrap list group? Need help? See this thread and provide the information requested. Is your version of osC up to date? You'll find the latest osC community version (CE Phoenix) here. Link to comment Share on other sites More sharing options...
♥GLWalker Posted March 27, 2014 Share Posted March 27, 2014 Also, without the old school select radio onclick javascript function, I can foresee some customers having difficulties selecting a method. Theres always that one who cant seem to click a radio button, but I think for accessibility reasons the customer needs to be able to click anywhere in the row and have that method selected. I'm just going off of customer service experience Ive seen in the past after changing such things for shop owners. Ive bypassed the onclick script in favor of labels with the for attribute before, but that only works when your using a method that offers various choices, for something like table or per item, there is no optional choice to wrap a label around, and if they click on the price, the radio wont be selected. If anyone wants to see it live, http://wsfive.com/bs-master login with test@@Tester.com test1 You can see it on checkout_shipping page right now, Ive yet to do the payment details yet. You can also use just the link with checkout.php to see a whole different page :thumbsup: <-- again, payment select is not redone. (And the comments travel from page to page without loosing content) Follow the community build: BS3 to osCommerce Responsive from the Get Go! Check out the new construction: Admin Gone to Total BS! Link to comment Share on other sites More sharing options...
♥GLWalker Posted March 27, 2014 Share Posted March 27, 2014 @@burt Any reason why this portion of code was left out of the checkout_payment area? <?php } elseif (isset($selection[$i]['fields']) && is_array($selection[$i]['fields'])) { ?> <tr> <td colspan="2"><table border="0" cellspacing="0" cellpadding="2"> <?php for ($j=0, $n2=sizeof($selection[$i]['fields']); $j<$n2; $j++) { ?> <tr> <td><?php echo $selection[$i]['fields'][$j]['title']; ?></td> <td><?php echo $selection[$i]['fields'][$j]['field']; ?></td> </tr> <?php } ?> 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 Follow the community build: BS3 to osCommerce Responsive from the Get Go! Check out the new construction: Admin Gone to Total BS! Link to comment Share on other sites More sharing options...
Guest Posted March 27, 2014 Share Posted March 27, 2014 Hi Regarding the checkout_shipping.php page and checkout_payment.php pages. Could these be combined into one page Reasons 1 less click for the customer, and the 2 pages on there own are not really "very busy" Don't shoot me. Grandpa Link to comment Share on other sites More sharing options...
burt Posted March 27, 2014 Author Share Posted March 27, 2014 Looks like I missed it. Link to comment Share on other sites More sharing options...
burt Posted March 27, 2014 Author Share Posted March 27, 2014 Hi Regarding the checkout_shipping.php page and checkout_payment.php pages. Could these be combined into one page Reasons 1 less click for the customer, and the 2 pages on there own are not really "very busy" Don't shoot me. Grandpa No. Not for core anyway. Link to comment Share on other sites More sharing options...
♥GLWalker Posted March 27, 2014 Share Posted March 27, 2014 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! Link to comment Share on other sites More sharing options...
burt Posted March 27, 2014 Author Share Posted March 27, 2014 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 Link to comment Share on other sites More sharing options...
♥GLWalker Posted March 27, 2014 Share Posted March 27, 2014 @@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! Link to comment Share on other sites More sharing options...
♥GLWalker Posted March 27, 2014 Share Posted March 27, 2014 <?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! Link to comment Share on other sites More sharing options...
burt Posted March 27, 2014 Author Share Posted March 27, 2014 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'] ... Link to comment Share on other sites More sharing options...
♥GLWalker Posted March 27, 2014 Share Posted March 27, 2014 I guess its possible a payment module could make use of it if its there. A special note, or call to Credit Card images. Follow the community build: BS3 to osCommerce Responsive from the Get Go! Check out the new construction: Admin Gone to Total BS! Link to comment Share on other sites More sharing options...
Guest Posted March 27, 2014 Share Posted March 27, 2014 @ 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 Link to comment Share on other sites More sharing options...
♥mattjt83 Posted March 27, 2014 Share Posted March 27, 2014 @@burt I like the shipping options on the same line as the price and radio input but I would prefer the striped table. Matt Link to comment Share on other sites More sharing options...
burt Posted March 27, 2014 Author Share Posted March 27, 2014 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. Link to comment Share on other sites More sharing options...
ejsolutions Posted March 27, 2014 Share Posted March 27, 2014 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.] Link to comment Share on other sites More sharing options...
Recommended Posts
Archived
This topic is now archived and is closed to further replies.