Approved & Verified by
Magento Marketplace
 

Unencrypted.
100% Open Source
& Customizable

Coding Standards Applied.
Clean & Readable Code

Countless Satisfied Customers:
Be The Next One!

Description

Font Awesome 5 + 6 SVG Icons für Ihren Hyvä Themes Magento 2 Shop

Verwenden Sie schöne svg/Vektor-Icons und fügen Sie sie einfach in Ihren Code oder über das Backend ein.
Enthält mehr als 1600+ kostenlose Icons
Regular Style, Solid Style und Social Media/Markenlogos

Das Problem
Verwenden von
SVG / Vector Icons

SVG-/Vektorsymbole sind eine großartige Möglichkeit, jede Website zu verschönern: pixelgenaue, skalierbare und kristallklare Bilder, ohne dass man jedes Bild einzeln herunterladen muss.
Es ist also keine Überraschung, dass buchstäblich jeder Online-Shop Icons als UI-Elemente oder visuelle Blickfänge verwendet.
Hyvä Themes stellt die Hero Icons zur Verfügung, die zwar nett sind, aber auch etwas eingeschränkt, was die Anzahl der verfügbaren Icons angeht, sowie z. B. fehlende Social Media/Marken-Icons.
Für Ihren Magento 2 Hyvä Store möchten Sie vielleicht eine größere Auswahl an ansprechenden Icons zur Verfügung haben?
Aber die Suche, Erstellung und Handhabung von SVG-Symbolen kann eine mühsame Aufgabe sein...
Lesen Sie weiter, um mehr darüber zu erfahren:
Awesome Hyvä - Die kostenlose Sammlung von 1600+ sorgfältig, konsistent und schön gestalteten Icons für Ihr Hyvä Theme Projekt...

Die Lösung
Font Awesome 5 + 6
Für Hyvä Themes

Mit der Awesome Hyvä by JaJuMa-Erweiterung haben Sie jetzt Font Awesome 5 + 6, das beliebteste Icon-Set und Toolkit des Internets, für Ihren Hyvä Themes Magento 2-Shop zur Verfügung.
Mit mehr als 1600+ kostenlosen Icons zur Auswahl, einschließlich Social Media- und Markensymbolen, gibt es ein Icon für alle Ihre Bedürfnisse.
Fügen Sie alle gewünschten Icons ganz einfach in Ihren Code ein, mit Autovervollständigung in Ihrer IDE oder über das Backend. Icons werden als Inline-SVGs gerendert und hinzugefügt, um die legendäre Hyvä-Performance zu erhalten und ohne eine Performance killende Icon-Schriftart zu Ihrer Website hinzufügen zu müssen.

 

Sie haben noch Fragen? Einen Feature-Request?
Oder benötigen individuelle Anpassungen?
Schreiben Sie uns:

Details

Awesome Hyvä Extension for Hyvä Themes
by JaJuMa im Detail.
Verschönern Sie Ihren Hyvä-Shop.
Sparen Sie Zeit, indem Sie alle Icons, die Sie brauchen, zur Hand haben.

Font Awesome, das beliebteste Icon-Set und Toolkit des Internets, jetzt verfügbar für Hyvä Themes, das herausragende neue Magento 2 Frontend.
Professionell gestaltete und pixelgenaue Icons treffen auf hervorragende Performance.
Eine perfekte Kombination für eine erstklassige Kunden- und Entwicklererfahrung.
Mit der Awesome Hyvä Extension können Sie aus über 1600 kostenlosen Icons direkt in Ihrem Projekt wählen. Verschwenden Sie keine Zeit mehr mit dem Suchen und Erstellen von svg/Vektor-Icons.
Alle Icons, die Sie für Ihren Hyvä-Theme-Shop benötigen, stehen Ihnen jetzt direkt zur Verfügung, mit Autovervollständigung in Ihrer IDE oder zum Hinzufügen in CMS-Inhalte über das Backend.

 

Awesome Hyvä Demo & Icon Liste

 

Sehen Sie sich die vollständige Liste der mehr als 1600 enthaltenen Symbole auf der Demoseite an und durchsuchen Sie sie.

Die Demo bietet auch Optionen, um die Icons in Ihren Farben zu sehen und den Code für die Verwendung der Icons in Ihren Projekten einfach per Copy & Paste zu erhalten.

Zur Awesome Hyvä Demo & Icon Liste für Font Awesome 5
Zur Awesome Hyvä Demo & Icon Liste für Font Awesome 6

Scope & Features

Die Extension enthält:

  • Solid Style Icons
  • Regular Style Icons &
  • Marken Icons

jeweils für

  • Font Awesome 5 &
  • Font Awesome 6

und stellt 6 ViewModels zur Verfügung

  • AwesomeiconsSolid & Awesomeicons6Solid
  • AwesomeiconsRegular & Awesomeicons6Regular
  • AwesomeiconsBrands & Awesomeicons6Brands

und ermöglicht das Hinzufügen von Font Awesome Icons aus dem Backend.

Font Awesome Icons In Hyvä Themes nutzen
mit dem JaJuMa "Awesome Hyvä" Module

Verwendung von Font Awesome-Symbolen in Hyvä Themes in view models

1. Installieren Sie das Modul über Composer wie jede andere Magento-Erweiterung von github.

2. Ergänzen eines der View Models in Ihrem Template:

Für Font Awesome 5

/** @var \Jajuma\AwesomeHyva\ViewModel\AwesomeiconsSolid $awesomeiconsSolid */
$awesomeiconsSolid = $viewModels->require(\Jajuma\AwesomeHyva\ViewModel\AwesomeiconsSolid::class);
/** @var \Jajuma\AwesomeHyva\ViewModel\AwesomeiconsRegular $awesomeiconsRegular */
$awesomeiconsRegular = $viewModels->require(\Jajuma\AwesomeHyva\ViewModel\AwesomeiconsRegular::class);
/** @var \Jajuma\AwesomeHyva\ViewModel\AwesomeiconsBrands $awesomeiconsBrands */
$awesomeiconsBrands = $viewModels->require(\Jajuma\AwesomeHyva\ViewModel\AwesomeiconsBrands::class);

Für Font Awesome 6

/** @var \Jajuma\AwesomeHyva\ViewModel\Awesomeicons6Solid $awesomeicons6Solid */
$awesomeicons6°Solid = $viewModels->require(\Jajuma\AwesomeHyva\ViewModel\AwesomeiconsSolid::class);
/** @var \Jajuma\AwesomeHyva\ViewModel\Awesomeicons6Regular $awesomeicons6Regular */
$awesomeicons6Regular = $viewModels->require(\Jajuma\AwesomeHyva\ViewModel\AwesomeiconsRegular::class);
/** @var \Jajuma\AwesomeHyva\ViewModel\Awesomeicons6Brands $awesomeicons6Brands */
$awesomeicons6Brands = $viewModels->require(\Jajuma\AwesomeHyva\ViewModel\AwesomeiconsBrands::class);

3. Dann rendern Sie die Icons wie folgt:

<?= $awesomeiconsRegular->addressBookHtml('w-8 h-8 fill-current text-red-100', 24, 24) ?>
<?= $awesomeicons6Regular->addressBookHtml('w-8 h-8 fill-current text-red-100', 24, 24) ?>

Der Name der Methode ist der Name des Icons inCamelCase, gefolgt von Html. In einer IDE sollten Sie eine Autovervollständigung für alle verfügbaren Methoden haben. Die Parameter sind optional und ändern die Attribute class, width und height des SVG-Elements.
Es wird empfohlen, sie alle zu setzen, damit die Bilder nicht in riesigen Größen gerendert werden, wenn CSS nicht geladen werden kann.

oder Sie können auch zusätzliche Attribute wie dieses übergeben:

<?= $awesomeiconsRegular->addressBookHtml('w-10 h-10 fill-current', 24, 24, ['style'=>'color:#e24848']) ?>
<?= $awesomeicons6Regular->addressBookHtml('w-10 h-10 fill-current', 24, 24, ['style'=>'color:#e24848']) ?>

Verwendung von Font Awesome-Icons in Hyvä Themes in CMS Content

Das Awesome Hyvä Modul fügt eine Icon-Direktive hinzu, um Icons in gefilterten Inhalten wie CMS-Blöcken oder Seiten darzustellen. So können Sie Icons in Text-/Codeblöcken wie diesem hinzufügen:

Release <= 1.0.1

{{awesome "solid/address-book" classes="w-6 h-6 fill-current text-red-100" width=12 height=12}}

Release >= 2.0.0

{{icon "awesomeicons/solid/address-book" classes="text-red-100" width=12 height=12}}
{{icon "awesomeicons6/solid/address-book" classes="text-red-100" width=12 height=12}}

Changelog

 

Version: 1.0.0

  • Initial Release

Version: 1.0.1

  • Use sha256 instead of md5 for cache key hash

Version: 2.0.0

  • Update to extend from SvgIcons View Model + incl. Easteregg

Version: 2.0.1

  • Fix Icon Colors

Version: 2.1.0

  • Add Font Awesome 6 Icons

Compatibility