4

Hi 'm working on the magento responsive theme using bootstrap.

In my onepage Checkout page, i need to customize that as horizontal listing.

I have followed some tutorial. But in those tutorial they have use fixed height for that.I don't want to use like that.

So i have tried in app\design\frontend\default\default\template\checkout\onepage.phtml as follow

<div class="row-fluid steps">
<?php $i=0; foreach($this->getSteps() as $_stepId => $_stepInfo): ?>
<?php if (!$this->getChild($_stepId) || !$this->getChild($_stepId)->isShow()): continue; endif; $i++ ?>
    <div id="opc-<?php echo $_stepId ?>1" class="span3 section<?php echo !empty($_stepInfo['allow'])?' allow':'' ?><?php echo !empty($_stepInfo['complete'])?' saved':'' ?>">
        <div class="step-title">
            <b class="number"><?php echo $i ?></b>
            <?php echo $_stepInfo['label'] ?>
        </div>
    </div>
<?php endforeach ?>
</div>

<ul class="unstyled 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">
        </div>
        <ul id="checkout-step-<?php echo $_stepId ?>" class="step a-item unstyled cart-list" style="display:none;">
            <li>
                <h3> <?php echo $_stepInfo['label'] ?></h3>
            </li>
            <li class="row-fluid"><?php echo $this->getChildHtml($_stepId) ?></li>
        </ul>
    </li>
<?php endforeach ?>
</ul>

This code display 'll display as i want. But the Accordion was not working.

Can some one explain to do this.

I don't want to install extension for this.

1 Answer 1

1

I've played around with a horizontal checkout a while ago and you're free to use the code. It's on Github and except for a helper class it's all templating and some CSS. If you have specific issues or questions let me know, I'll try and explain.

9
  • Thanks for your help.Its shows Error like Module "Redkiwi_Rkcheckout" requires module "Redkiwi_Rkextbase". In your app/etc/module/Redkiwi_Rkcheckout.xml <depends> <Redkiwi_Rkextbase/> </depends> what should i replace for that Commented Feb 20, 2014 at 10:34
  • Ahh sorry, It's not really necessary. I've updated the code on Git Commented Feb 20, 2014 at 10:37
  • Thanks,it does not show active steps.And one more thing could you make the Steps are at the top of the page after the page title Commented Feb 20, 2014 at 10:44
  • This was a hobby project a while back and I'm not developing on it any more so any changes I'm afraid you will have to do yourself. If you run into a specific issue I'll be glad to assist Commented Feb 20, 2014 at 10:51
  • thanks for your help.I have try that but the accrodation is not working for me. Do you have any idea about this.Please help me Commented Feb 20, 2014 at 10:53

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.