Technologische Neuigkeiten, Bewertungen und Tipps!

So laden Sie SVG-Bilder in das benutzerdefinierte Magento 2-Modul hoch

Hinweis: Der folgende Artikel hilft Ihnen dabei: So laden Sie SVG-Bilder in das benutzerdefinierte Magento 2-Modul hoch

Magento 2 ermöglicht standardmäßig das Hochladen von JPG- und PNG-Bildern. Die Funktion zum Hochladen von SVG-, PDF- und HTML-Dateien ist jedoch nicht verfügbar.

Ein Ladenbesitzer muss jedoch häufig Vektorbilder sowohl im Backend als auch im Frontend hochladen. Es ist möglich, eine SVG-Datei mithilfe eines benutzerdefinierten Moduls hochzuladen.

Der Ladenbesitzer möchte möglicherweise SVG-Bilder hochladen, da es zahlreiche Vorteile bietet, wie zum Beispiel:

  • SVG-Bilder sind auflösungsunabhängig, d. h. sie behalten bei jeder Bildschirmauflösung oder -größe die gleiche Qualität.
  • Das SVG-Bild kann im Vergleich zu anderen Bildtypen zu einer kleineren Dateigröße führen.
  • Ein JPG-Bild kann auf manchen Bildschirmen verschwommen erscheinen, aber ein SVG-Bild wird immer noch auf jedem Bildschirm in hoher Qualität angezeigt.
  • Durch die Verwendung eines SVG-Bildes entfällt die HTTP-Anfrage, die zum Laden einer Bilddatei erforderlich ist. Dies führt zu kürzeren Ladezeiten für eine Seite, da keine Datei heruntergeladen werden muss.

Um diese Vorteile zu nutzen, lernen Sie die programmatische Methode kennen.

Darüber hinaus bietet der Shop beispielsweise eine Individualisierungsoption, die es Nutzern ermöglicht, durch Hochladen eines Bildes ihr individuelles Design des Produkts hinzuzufügen. Was ist nun, wenn der Kunde ein Bild im SVG-Format hat? In diesem Fall ist es eine schlechte Praxis, wenn ein Kunde SVG-Dateien manuell in JPG- oder PNG-Bilder konvertieren muss.

Sie können den Kauf sogar überspringen, wenn sie die Bildkonvertierung nicht kennen oder der Konkurrent das SVG-Bildformat unterstützt.

Um dies zu vermeiden, kann man die folgende Lösung verwenden.

Methode zum Hochladen von SVG-Bildern im benutzerdefinierten Magento 2-Modul

  1. Erstellen Sie die di.xml Datei unter Anbieter\Modul\usw

    xsi:noNamespaceSchemaLocation=”../../../../../lib/internal/Magento/Framework/ObjectManager/etc/config.xsd”>

  2. Erstellen UploaderPlugin.php Datei unter Anbieter\Modul\Plugin\Datei

    1

    2

    3

    4

    5

    6

    7

    8

    9

    10

    11

    12

    13

    14

    15

    16

    17

    18

    19

    20

    21

    22

    23

    24

    25

    Namespace Vendor\Module\Plugin\File;

    verwenden Sie Magento\Framework\App\Action\Action;

    verwenden Sie Magento\Framework\App\Action\Context;

    Klasse UploaderPlugin erweitert Action

    {

    öffentliche Funktion __construct(Context $context)

    {

    parent::__construct($context);

    }

    öffentliche Funktion aroundSetAllowedExtensions(\Magento\Framework\File\Uploader $subject, \Closure $proceed, $extensions = [])

    {

    if (!in_array(‘svg’, $extensions)) {

    $Erweiterungen[] = ‘svg’;

    }

    return $proceed($extensions);

    }

    öffentliche Funktionexecute()

    {

    }

    }

Das ist es.

Irgendwelche Zweifel? Erwähnen Sie sie bitte im Abschnitt „Kommentare“ unten.

Gerne helfe ich Ihnen weiter.

Bitte teilen Sie die Lösung auch über die sozialen Medien mit der Magento-Community.

Danke schön.