вызов css с использованием xml макета

Question

вызов css с использованием xml макета

Я создал пользовательский модуль, и в этом модуле я хочу добавить свой собственный файл css.

До сих пор я создал все необходимые файлы phtml и необходимые layout.xml файл. Тестируя модуль, я вижу, что могу вызвать все соответствующие файлы, поэтому я уверен, что мой layout.xml работает. Моя проблема в том, что когда я пытаюсь добавить css в свои файлы модулей, я получаю только тот же HTML-код, что и когда я не пытаюсь вызвать css. Т.е. заголовок не добавляется

Я прочитал этот учебник по magento и этот другой учебник, а также несколько других, и я не вижу, что я делаю неправильно

Я буду использовать регистрацию в качестве примера:

В файле signup.phtml у меня есть

<form>HTML & PHP to create form</form>

Но больше ничего. Чтобы получить заголовок для моей страницы формы, я пытаюсь вызвать page/html/head.phtml и добавить узел действия для вызова моего css

<layout>
<default>
    <reference name="root">
        <block type="core/template" name="page_head" output="toHtml" template="page/html/head.phtml" />
        <action method="addCss"><stylesheet>css/normalize.css</stylesheet></action>             
    </reference>
</default>     
<user_register_form>
        <block type="core/template" name="prefcentre_regform" output="toHtml" template="ps/prefcentre/signup.phtml" />
</user_register_form>
<layout>

(Пожалуйста, не это моя последняя попытка связать мою страницу с css, я предпринял несколько других попыток, но, похоже, бессмысленно добавлять все попытки)

Насколько я понял из прочитанных руководств, Magento загрузит дескриптор по умолчанию и применит его ко всем страницам в этом XML-файле. так почему же это не загружается? Мне также интересно, находится ли мой css в нужной папке, в настоящее время он находится в интерфейсе/база/по умолчанию/css, но я также пытался разместить его в интерфейсе/по умолчанию/имямодуля/css. Я не уверен, как Magento загружает таблицу стилей, т. Е. Какую функцию она использует, поэтому я не смог взглянуть чтобы попытаться разобраться в этом, и я не нашел этого объяснения ни в одном из учебных пособий

КРАТКОЕ ОПИСАНИЕ

Как настроить xml-файл для добавления css на страницы в моем модуле?
Нужно ли мне найти свой css для magento, чтобы найти их?
Какой класс используется для загрузки метода действия="ADDCSS"? (Я заглядывал в различные папки Mage/Core/Block)
Существует ли альтернативный способ устранения неполадок с xml, кроме простой след и ошибка? (например, я использую Zend_Debug::дамп($var), очень полезный при редактировании php-части вещей)

6

css layout

Author: tony09uk, 2013-08-02

Source

1 answers

score 7 · Accepted Answer

У вас есть ошибка в вашем xml, тег <layout> в конце должен быть закрыт, но я буду считать, что это ошибка копирования/вставки, и это не проблема

Ваша проблема здесь:

<default>
    <reference name="root">
        <block type="core/template" name="page_head" output="toHtml" template="page/html/head.phtml" />
        <action method="addCss"><stylesheet>css/normalize.css</stylesheet></action>
    </reference>
</default>

То, что вы делаете, это:

Ссылка на корневой блок на всех страницах, добавление к нему блока типа core/template, который использует page/html/head.phtml в качестве шаблона.
Вызов метода addCss блока page/html (поскольку корень имеет этот тип, если вы посмотрите в page.xml файл макета)

Что вам следует делать, так это ссылаться на блок head, поскольку функция addCss находится в этом блоке.

Теперь, прежде чем ответить на ваш главный вопрос, я хотел бы высказать несколько замечаний:

Насколько я понял из прочитанных руководств, Magento загрузит дескриптор по умолчанию и применит его ко всем страницам в этом XML-файле.

Это отчасти верно, за исключением того, что все, что в <default> дескриптор, будет применяться на всем веб-сайте, а не только для страниц этого конкретного файла макета.

Какой класс используется для загрузки метода действия="ADDCSS"? (Я заглянул в различные папки Mage/Core/Block)

Если вы посмотрите на файл page.xml, вы сможете его найти. На самом деле существует 2 способа добавления CSS-файлов, addCss и addItem

<block type="page/html_head" name="head" as="head">
    <action method="addCss"><stylesheet>css/styles.css</stylesheet></action>
    <action method="addItem"><type>skin_css</type><name>css/styles-ie.css</name><params/><if>lt IE 8</if></action>
    <!-- etc. -->
</block>

По типу блока page/html_head вы могли бы определить, что блок Mage_Page_Block_Html_Head. (Это в формате module/path)

Как настроить XML-файл для добавления css на страницы в моем модуле?

Поскольку вам нужно, чтобы css был ТОЛЬКО на страницах вашего модуля, вы не можете поместить его в дескриптор <default>. Как это было бы загружено на всех страницах веб-сайта.

Но что вы можете сделать, так это создать свой собственный дескриптор "по умолчанию" и заставить все остальные дескрипторы "расширить" его.

Итак, используя всю эту информацию, вот как ваш XML будет выглядеть так:^tl;dr

<layout>
    <!-- First we create the default handle that should be applied to all
         of the module pages in this layout file-->
    <user_register>
        <reference name="head">
            <!-- There is no need to reference the root handle, we just
                 reference the head handle and call the addCss method -->
            <action method="addCss"><stylesheet>css/normalize.css</stylesheet></action>             
        </reference>
    </user_register>
    <!-- The next handle will match the BASE_URL/user/register/form path -->
    <user_register_form>
            <!-- This is the tag which "extends" the user_register handle-->
            <update handle="user_register"/>
            <block type="core/template" name="prefcentre_regform" output="toHtml" template="ps/prefcentre/signup.phtml" />
    </user_register_form>
</layout>

Где мне нужно найти свой css для magento, чтобы найти их?

Поскольку вы использовали css/normalize.css в качестве пути к файлу CSS, он должен находиться в frontend/default/default/css, а не внутри вложенной папки.