Magento 2 - Wie kann ich eine benutzerdefinierte Vorlagendatei zu <head> hinzufügen?

9

In Magento 1.x kann ich die CSS-Dateien mithilfe des Hilfsprogramms wie im folgenden Code in den Kopf einfügen.

<reference name="head">
    <action method="addCss"><stylesheet helper="module/helperclass/helperfunction"/></action>
</reference>

Kann dies aber nicht auf Magento 2 tun.

Also habe ich diesen Code <link rel="stylesheet" type="text/css" media="all" href="<?php echo $_helper->getCSSFile()?>">jetzt in den Container "after.body.start" eingefügt.

Weiß jemand, wie ich eine benutzerdefinierte Vorlagendatei hinzufügen kann <head>?

magento2 layout css Mike
quelle

Antworten:

17

Wenn Sie eine CSS-Datei in head hinzufügen möchten, können Sie diesen Code verwenden:

<head>
   <css src="path_to/file.css" />
</head>

Wenn Sie jedoch einen benutzerdefinierten Block in head hinzufügen müssen, können Sie diesen Code verwenden:

<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
    <body>
        <referenceBlock name="head.additional">
            <block class="Magento\Framework\View\Element\Template" name="block_name" template="path_to_file.phtml" />
        </referenceBlock>
    </body>
</page>

Hoffe das hilft

Ihor Klymchuk
quelle
Können Sie vorschlagen, wie man dasselbe in admin macht? Ich habe alle Namen von Referenzblöcken ausprobiert, aber ohne Glück, obwohl die Ausgabe korrekt angezeigt wird, wenn ich den Referenzblock für Inhalte verwende
Sunil Verma
Wenn ich meinen benutzerdefinierten Block anstelle von Magento \ Framework \ View \ Element \ Template verwende, wird der Fehler "Objekt domdocument sollte erstellt werden" angezeigt. Wie entferne ich diesen Fehler und verwende meinen benutzerdefinierten Block?
Sanjay Gohil
2

Ich habe im ganzen Web nach dieser Antwort gesucht und sie schließlich durch viele Experimente erhalten.

Ich glaube, dies ist der einfachste Weg:
Gehen Sie zu der Seite im Admin-Bereich.
Suchen Sie Ihre Seite und scrollen Sie über den Inhaltsbereich hinaus zum XML-Abschnitt zur Layoutaktualisierung.
In diesem Feld können Sie seitenspezifisches CSS und JS hinzufügen. 

<head> <css src="js/ingredients.css> </head>

Dadurch wird Ihr Skript oben im Kopfbereich hinzugefügt.
(Machen Sie es Ihrem JS schwer) 

<head><script src="requirejs/require.js"/><script src="js/ingredients.js"/></head>

Oben werden Sie feststellen, dass ich die requirejsDatei zuerst hinzugefügt habe . Dies geschieht, weil Sie ohne Hinzufügen vor Ihrer personalisierten JS-Datei nicht auf die anderen in requirejs geladenen Bibliotheken zugreifen können.

Daniel Barenboim
quelle