jajuma/hyva-flags

本Magento 2扩展为使用Hyvä Themes的Magento 2站点提供国家与语言图标作为SVG

维护者

详细信息

github.com/JaJuMa-GmbH/hyva-flags

源代码

问题

安装: 934

依赖关系: 0

建议者: 0

安全: 0

星标: 2

关注者: 1

分支: 0

开放问题: 0

类型:magento2-module

1.0.1 2023-06-16 10:15 UTC

Requires

  • hyva-themes/magento2-theme-module: >=1.1.12

MIT a5a8195a4fcfc7e6d8daafad457ed904a02fe965

  • JaJuMa <info.woop@jajuma.de>

This package is auto-updated.

Last update: 2024-09-22 07:43:12 UTC

README

由JaJuMa提供的Hyvä Flags扩展为使用Hyvä Themes的Magento 2和Mage-OS站点提供国家与语言图标作为SVG。



兼容性

功能

Hyvä Flags for Magento & Mage-OS with Hyvä Themes

  • 包含近1000个国家与语言旗帜图标
    • 方形旗帜图标（1:1比例）
    • 矩形旗帜图标（3:2 + 4:3比例）
    • 官方旗帜尺寸与
    • 圆形旗帜图标
  • 提供5个ViewModel用于在代码中添加国家与语言旗帜图标
  • 允许在CMS内容中从后台添加国家与语言旗帜图标。

更多信息，扩展描述与手册

演示

Hyvä Themes演示中的国家与语言旗帜图标

图标列表

包含所有图标的列表视图和详细视图，可用于复制并粘贴代码以在项目中使用这些图标

注意
您的Hyvä Themes项目需要更多图标吗？
➡️ 查看我们的Awesome Hyvä for Hyvä Themes 模块，用于Font Awesome 5 & 6图标

安装

通过composer安装，就像安装其他来自github的Magento扩展一样

composer require jajuma/hyva-flags

或者从扩展网站获取，然后在app/code/中以任何其他Magento扩展的方式手动安装。

使用JaJuMa "Hyvä Flags"模块在Hyvä Themes中使用国家与语言旗帜图标

如何在视图模型中在Hyvä Themes中使用国家与语言旗帜图标

JaJuMa "Hyvä Flags"模块提供5个视图模型

  • Flagicons11
  • Flagicons32
  • Flagicons43
  • FlagiconsCircle
  • FlagiconsOfficial

在模板中需要使用其中一个视图模型

/** @var \Jajuma\HyvaFlags\ViewModel\Flagicons11 $flagicons11 */
$flagicons11 = $viewModels->require(\Jajuma\HyvaFlags\ViewModel\Flagicons11::class);

/** @var \Jajuma\HyvaFlags\ViewModel\Flagicons32 $flagicons32 */
$flagicons32 = $viewModels->require(\Jajuma\HyvaFlags\ViewModel\Flagicons32::class);

/** @var \Jajuma\HyvaFlags\ViewModel\Flagicons43 $flagicons43 */
$flagicons43 = $viewModels->require(\Jajuma\HyvaFlags\ViewModel\Flagicons43::class);

/** @var \Jajuma\HyvaFlags\ViewModel\FlagiconsCircle $flagiconscircle */
$flagiconscircle = $viewModels->require(\Jajuma\HyvaFlags\ViewModel\FlagiconsCircle::class);

/** @var \Jajuma\HyvaFlags\ViewModel\FlagiconsOfficial $flagiconsofficial */
$flagiconsofficial = $viewModels->require(\Jajuma\HyvaFlags\ViewModel\FlagiconsOfficial::class);

然后以这种方式渲染图标

<?= $flagicons11->acHtml('text-red-100', 24, 24) ?>
  • 方法名是驼峰式图标名，后跟Html。
  • 在IDE中，您应该有所有可用方法的自动完成。
  • 参数是可选的，并且更改单引号后的class（class类），后跟两个值，用于SVG元素的宽度和高度属性。
  • 建议设置所有这些，以便如果CSS加载失败，图片不会以巨大的尺寸渲染。

或者您也可以作为数组传递额外的属性

<?= $flagicons11->acHtml('w-10 h-10', 24, 24, ['style'=>'position:relative']) ?>

如何在Hyvä Themes的CMS内容中使用国家与语言旗帜图标

Awesome Hyvä模块添加了一个图标指令以在过滤内容中渲染图标，如CMS块或页面。因此，您可以在文本/代码块中添加图标，如下所示

{{icon "flagicons/1x1/ac" classes="text-red-100" width=12 height=12}}
  • "classes"参数用于设置任何CSS类。
  • "width"/"height"参数用于设置图标宽度/高度属性。
  • 提示：您可以在演示中获取每个图标的代码片段进行复制和粘贴 - 请见下方的链接。

许可协议

代码遵循MIT许可协议（MIT），详情请见此处

Hyvä主题的替代国旗图标

致谢

SVG图标的致谢

其他 Magento 2 和 Hyvä主题扩展 由 JaJuMa

JaJuMa的其他服务

© JaJuMa GmbH | www.jajuma.de