在 Magento 2 的客户帐户中添加自定义选项卡
关于 Magento 2 的默认设置,客户在注册或登录后将自动重定向到其帐户仪表板。在此仪表板中,有各种选项卡,例如“我的帐户”、“我的订单”、“我的愿望清单”。
然而,在某些特定情况下,为了增强客户购物体验,需要在客户帐户仪表板中添加一些功能,例如检查演示产品、请求退款或其他自定义要求。遗憾的是,默认的 Magento 2 中并未提供这些功能。因此,在今天的帖子中,我将向您展示在客户帐户中添加自定义选项卡的 4 个简单阶段。
如何通过 4 个步骤在客户帐户中添加自定义选项卡
- 第 1 步:创建客户帐户布局
- 第 2 步:创建索引布局
- 第 3 步:创建索引页
- 第四步:创建模板文件
第 1 步:创建客户帐户布局
首先,您需要customer_account.xml
在路径中创建文件Example
/Module/view/frontend/layout
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<body>
<referenceBlock name="customer_account_navigation">
<block class="Magento\Framework\View\Element\Html\Link\Current" name="customer-account-navigation-custom">
<arguments>
<argument name="path" xsi:type="string">routename/customer/index</argument>
<argument name="label" xsi:type="string">My Custom Tab</argument>
</arguments>
</block>
</referenceBlock>
</body>
</page>
第 2 步:创建索引布局
创建上述文件后,也在路径中
创建,Example
/Module/view/frontend/layoutroutename_customer_index.xml
其中包含以下代码:
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="../../../../../../../lib/internal/Magento/Framework/View/Layout/etc/page_configuration.xsd">
<update handle="customer_account"/>
<body>
<referenceBlock name="page.main.title">
<action method="setPageTitle">
<argument translate="true" name="title" xsi:type="string">My Custom Tab</argument>
</action>
</referenceBlock>
<referenceContainer name="content">
<block class="Magento\Framework\View\Element\Template" name="my_tab" template="Vendor_Module::mytab.phtml">
</block>
</referenceContainer>
</body>
</page>
第 3 步:创建索引页
然后转到
并创建Example
/Module/Controller/CustomerIndex.php
<?php
namespace Example/Module\Controller\Customer;
class Index extends \Magento\Framework\App\Action\Action {
public function execute() {
$this->_view->loadLayout();
$this->_view->renderLayout();
}
}
?>
第四步:创建模板文件
最后,在客户帐户仪表板中添加自定义选项卡很容易,您只需遵循路径
并创建Example
/Module/view/frontend/templatesmytab.phtml
.
<?php
// Add Some Code Here for design
?>
<span> My Custom Tab.. </span>
版权声明:本站内容源自互联网,如有内容侵犯了你的权益,请联系删除相关内容。