jesper-herrloff / module-customer-navigation
扩展客户导航,设置如何显示导航
1.0.1
2023-12-23 12:09 UTC
Requires
- php: >=8.1
- magento/framework: 103.*
- magento/module-config: 101.*
- magento/module-customer: 103.*
README
概述
此模块向页眉中的客户导航链接添加模板。并在侧边栏中的客户账户导航链接中。
安装说明
在安装此模块之前,请注意,Magento_Customer 模块依赖于 Magento_Theme 模块,这意味着必须在安装 Magento_Customer 模块之前安装 Magento_Theme 模块。
通过 composer 安装(推荐)
在 Magento 2 根目录中运行以下命令
composer require jesper-herrloff/module-customer-navigation
php bin/magento setup:upgrade
配置
在管理员面板中,在“商店 -> 配置 -> 客户 -> 客户导航 -> 导航设置 -> 客户账户导航”下有一个设置。此设置用于启用或禁用 JesperHerrloff_CustomerNavigation/Plugin/AccountNavigation。如果设置启用,则即使在当前链接中,侧边栏中的客户账户导航链接也将显示为链接。商店 -> 配置 -> 客户 -> 客户导航 -> 导航设置 -> 将名称添加到布局中作为链接类。此设置用于将链接的名称添加到布局中作为类。这是为了能够在链接中添加图标,例如。
如何使用
安装模块后,页眉和侧边栏中的客户导航链接将以链接的形式显示,即使它是当前链接。这是为了能够在链接中添加图标,例如。
主题扩展性
扩展 JesperHerrloff_CustomerNavigation/templates/account/link.phtml 模板。这使得在您的主题中自定义模板成为可能。
附加信息
在侧边栏和 top.links 中的链接中添加图标的示例。如果启用了“将名称添加到布局中作为链接类”的设置。
// Customer Navigation links in Customer Account sidebar
.block-collapsible-nav .nav.item .customer-account-navigation-account-link {
// If you use svg icons
&::before {
content: "";
background-image: url('@{baseDir}Vendor_Module/icons/icon.svg');
background-size: 16px 16px;
background-repeat: no-repeat;
position:relative;
display:inline-block;
top:2px;
height: 16px;
width: 16px;
padding-right: 5px;
}
// If you use font icons
&::before {
content: "\f007";
font-family: 'Font Awesome 5 Free';
font-weight: 900;
font-size: 16px;
position:relative;
display:inline-block;
top:2px;
height: 16px;
width: 16px;
padding-right: 5px;
}
}
// Customer Navigation links in header
.header.links .nav.item .my-account-link {
// If you use svg icons
&::before {
content: "";
background-image: url('@{baseDir}Vendor_Module/icons/icon.svg');
background-size: 16px 16px;
background-repeat: no-repeat;
position:relative;
display:inline-block;
top:2px;
height: 16px;
width: 16px;
padding-right: 5px;
}
// If you use font icons
&::before {
content: "\f007";
font-family: 'Font Awesome 5 Free';
font-weight: 900;
font-size: 16px;
position:relative;
display:inline-block;
top:2px;
height: 16px;
width: 16px;
padding-right: 5px;
}
}