How to make order summary more beautiful?

最新推荐文章于 2024-01-22 21:17:07 发布

原创最新推荐文章于 2024-01-22 21:17:07 发布 · 639 阅读

0 ·

CC 4.0 BY-SA版权

Magento 专栏收录该内容

41 篇文章

订阅专栏

本文介绍如何通过调整布局和样式来美化订单概览页面，包括使用不同的块类型来呈现订单信息、总价及附加项，并提供了定制化的渲染器实现方法。

How to make order summary more beautiful?
1.Order review layout:

<block type="checkout/onepage_review_info" name="root" output="toHtml" template="checkout/onepage/review/info.phtml">
    <action method="addItemRender"><type>default</type><block>checkout/cart_item_renderer</block><template>checkout/onepage/review/item.phtml</template></action>
    <action method="addItemRender"><type>grouped</type><block>checkout/cart_item_renderer_grouped</block><template>checkout/onepage/review/item.phtml</template></action>
    <action method="addItemRender"><type>configurable</type><block>checkout/cart_item_renderer_configurable</block><template>checkout/onepage/review/item.phtml</template></action>
    <block type="checkout/cart_totals" name="checkout.onepage.review.info.totals" as="totals" template="checkout/onepage/review/totals.phtml"/>
    <block type="core/text_list" name="checkout.onepage.review.info.items.before" as="items_before" translate="label">
        <label>Items Before</label>
    </block>
    <block type="core/text_list" name="checkout.onepage.review.info.items.after" as="items_after" translate="label">
        <label>Items After</label>
    </block>
    <block type="checkout/agreements" name="checkout.onepage.agreements" as="agreements" template="checkout/onepage/agreements.phtml"/>
    <block type="core/template" name="checkout.onepage.review.button" as="button" template="checkout/onepage/review/button.phtml"/>
</block>

2.Go to block Mage_Checkout_Block_Cart_Totals

The main methods in this block are getTotals() and renderTotals(). For each total item,you can define the renderer to render them.

3.Default total renderer:

Block Mage_Checkout_Block_Total_Default is the default total renderer if other specific renderer are not defined. It is also used as parent class when you define the new renderer.
4.Use setStyle() method to overwrite style-sheet and add extra style