Magento 2 - Come posso aggiungere un file modello personalizzato in <head>?

9

In magento 1.x, posso aggiungere i file CSS nella testa usando l'helper come sotto il codice.

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

Ma non è possibile farlo su Magento 2.

Quindi ora ho aggiunto questo codice <link rel="stylesheet" type="text/css" media="all" href="<?php echo $_helper->getCSSFile()?>">nel contenitore "after.body.start".

Qualcuno sa come posso aggiungere il file modello personalizzato in <head>?

magento2 layout css

— Mike
fonte

17

Se vuoi aggiungere il file css in head puoi usare questo codice:

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

Ma se hai bisogno di aggiungere un blocco personalizzato in head, puoi usare questo codice:

<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>

Spero che sia di aiuto

— Ihor Klymchuk
fonte

Puoi suggerire come fare lo stesso in admin, ho provato tutti i nomi dei blocchi di riferimento ma senza fortuna, anche se l'output viene visualizzato correttamente quando utilizzo il blocco di riferimento del contenuto

— Sunil Verma,

quando sto usando il mio blocco personalizzato invece di Magento \ Framework \ View \ Element \ Template è visualizzato l'errore "oggetto domdocument dovrebbe essere creato" come rimuovere questo errore e usare il mio blocco personalizzato?

— Sanjay Gohil,

2

Ho cercato in tutto il Web questa risposta, finalmente ho ottenuto molte sperimentazioni.

Credo che questo sia il modo più semplice:
vai alla pagina situata nel pannello di amministrazione.
Trova la tua pagina e scorri verso il basso oltre la sezione del contenuto fino alla sezione xml di aggiornamento del layout.
In quella casella puoi aggiungere CSS e JS specifici per la pagina.

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

Questo aggiungerà il tuo script nella parte superiore della sezione head.
(Rendere le cose difficili per il tuo JS)

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

Sopra noterai che ho aggiunto requirejsprima il file. Ciò viene fatto perché senza aggiungerlo prima del file JS personalizzato, non sarà possibile accedere alle altre librerie caricate in requestjs.

— Daniel Barenboim
fonte