How can show all the checkout forms (such as billing address, shipping method, payment method, additional information, and checkout review) on one page without going through the step by step from 1 to 5?
By Magento checkout default, you have to go through the step of 'Checkout as a Guest or Register' before you can see the form of billing address, and so on. I want to avoid too many clicks on the checkout page, so I want to display all of these forms when you click 'Proceed to checkout' and land on this check out page. Is it possible?
This is done by this website https://www.millesima.co.uk/firecheckout/ and this is the screen shot of its checkout page where you see all the forms are displayed on this single page.
I assume that it is onepage.phtml (frontend\mystore\default\template\checkout/onepage.phtml
) that I should edit,
<div class="page-title">
<h1><?php echo $this->__('Checkout') ?></h1>
</div>
<script type="text/javascript" src="<?php echo $this->getJsUrl('varien/accordion.js') ?>"></script>
<script type="text/javascript" src="<?php echo $this->getSkinUrl('js/opcheckout.js') ?>"></script>
<ol class="opc" id="checkoutSteps">
<?php $i=0; foreach($this->getSteps() as $_stepId => $_stepInfo): ?>
<?php if (!$this->getChild($_stepId) || !$this->getChild($_stepId)->isShow()): continue; endif; $i++ ?>
<li id="opc-<?php echo $_stepId ?>" class="section<?php echo !empty($_stepInfo['allow'])?' allow':'' ?><?php echo !empty($_stepInfo['complete'])?' saved':'' ?>">
<div class="step-title">
<span class="number"><?php echo $i ?></span>
<h2><?php echo $_stepInfo['label'] ?></h2>
<a href="#"><?php echo $this->__('Edit') ?></a>
</div>
<div id="checkout-step-<?php echo $_stepId ?>" class="step a-item" style="display:none;">
<?php echo $this->getChildHtml($_stepId) ?>
</div>
</li>
<?php endforeach ?>
</ol>
<script type="text/javascript">
//<![CDATA[
var accordion = new Accordion('checkoutSteps', '.step-title', true);
<?php if($this->getActiveStep()): ?>
accordion.openSection('opc-<?php echo $this->getActiveStep() ?>');
<?php endif ?>
var checkout = new Checkout(accordion,{
progress: '<?php echo $this->getUrl('checkout/onepage/progress') ?>',
review: '<?php echo $this->getUrl('checkout/onepage/review') ?>',
saveMethod: '<?php echo $this->getUrl('checkout/onepage/saveMethod') ?>',
failure: '<?php echo $this->getUrl('checkout/cart') ?>'}
);
//]]>
</script>
So I replace the code above with,
<?php echo $this->getChildHtml('billing') ?>
<?php echo $this->getChildHtml('shipping') ?>
<?php echo $this->getChildHtml('shippingmethod') ?>
<?php echo $this->getChildHtml('payment') ?>
But what about the forms for ADDITIONAL INFORMATION and CHECKOUT REVIEW?
Also this line <?php echo $this->getChildHtml('shippingmethod') ?>
does not pull the shipping methods that I have configured in Magento's backoffice at all. Any idea why?