Представляя Макет Magento

В этом уроке мы введем Magento макета, создав простой модуль, который будет добавить некоторые пользовательские HTML-содержимое в нижней части каждого клиента соседней странице, в ненавязчивой манере.Другими словами, мы будем делать это без фактического изменения любого Magento шаблоны или файлы ядра.Такая функциональность является общим требованием для многих вещей, например, партнерские направления программ, аналитика клиентов слежения, добавление пользовательских функций JavaScript, etc.

Мы будем рассматривать ряд интересных тем, в том числе:

  • Magento макет handles
  • Макет XML files
  • Блоки и templates
  • Альтернатива Widgets

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

  • Google Analytics
  • Reinvigorate
  • CrazyEgg

Third-Party Tools Google Analytics, Reinvigorate and CrazyEgg

Перед Мы Start

Это руководство предполагает, что вы уже знакомы с создания собственного модуля Magento, так что если вы haven’ T сделали, я рекомендую прочитать нашу предыдущую статью на Создание Magento Module.

Хорошо, давайте начнем.Файловая структура нашего нового модуля должна выглядеть следующим образом:

app
  - code
      - local
          - SmashingMagazine
              - Layout
                  - etc
                      - config.xml

  - etc
      - modules
          - SmashingMagazine_Layout.xml

Мы можем оставить config.xml пусто теперь, как мы будем населяющих его в дальнейшем в учебнике, но мы уже можем завершить содержанием SmashingMagazine_Layout.xml, с:

<?xml version="1.0" encoding="UTF-8"?>
<config>
    <modules>
        <SmashingMagazine_Layout>
            <active>true</active>
            <codePool>local</codePool>
        </SmashingMagazine_Layout>
    </modules>
</config>

Внедрение Magento Layout

Содержание, которое отображается на каждой странице Magento в значительной степени определяется файлы разметки XML, который можно найти в app/design/frontend/base/default/layout.В этих XML файлов, вы увидите, количество фрагментов XML заключены в расположении узлов ручку родители, которые используются для определения типа странице отображается.Например, ручка catalog_product_view используется для добавления контента на странице детали продукта, и checkout_cart_index корзина page.

Дочерние узлы, то создается внутри этих схема управляет определить, какой контент должен появиться на любой конкретной странице.Эти дочерние узлы называются block с, что в свою очередь может содержать дочерние block с их собственными.Например, в формат файла XML на странице продукта (см. app/design/frontend/base/default/layout/catalog.xml), под catalog_product_view расположение ручки, мы могли бы найти block для отображения продукта оболочку template.Тогда, как дети, что block, мы нашли бы block образа продукта template, block для отображения цена template, а другой для отображения add to basket template.

Каждый из этих блоков имеет шаблон, связанный с ним.В Model-View-Controller (MVC) условий, блок действует как мини- Controller и шаблон выступает в качестве view.Вся логика для отображения динамического контента находится в block, который по просьбе template и отображаются в HTML form.

Схема Magento является достаточно сложной, но очень мощный, зверь, и в результате мы будем обсуждать только те части, которые имеют отношение к этому руководства.Существует макет справиться с именем default который находится на каждой странице, и так как мы хотим, чтобы наши module’ S HTML содержимое отображается в нижней части каждой страницы, это макет мы будем обращаться use.

Добавление нового макета File

Нам нужно определить новый формат файла, чтобы содержать наши обновления, так что сначала мы должны изменить нашу module’ S config.xml чтобы удовлетворить макет обновления:

<?xml version="1.0" encoding="UTF-8"?>
<config>
    <modules>
        <SmashingMagazine_Layout>
            <version>0.0.1</version>
        </SmashingMagazine_Layout>
    </modules>
    
    <!-- we are making changes to the frontend -->
    <frontend>
        
        <!-- we are making changes to the layout -->
        <layout>
            
            <!-- we are adding a new update file -->
            <updates>
                
                <!-- 
                    this child node name must be
                    unique throughout Magento
                -->
                <smashingmagazine_layout 
                         module="SmashingMagazine_Layout">
                    
                    <!-- the name of the layout file we are adding -->
                    <file>smashingmagazine_layout.xml</file>
                    
                </smashingmagazine_layout>
                
            </updates>
            
        </layout>
        
    </frontend>

</config>

Сейчас let’ S создать этот файл макета XML здесь:

app
  - design
      - frontend
          - base
              - default
                  - layout
                      - smashingmagazine_layout.xml

Сейчас те из вас, кто имеет небольшой опыт Magento, или читали больше Примечательно, Magento учебники, может быть задыхаясь на самом деле мы внесении изменений в base/default, так как это, где файлы Magento ядро ​​расположено.Тем не менее, мы не изменять файлы здесь, мы создаем новые, и, кроме того, мы предваряя наше имя файла с “ SmashingMagazine, ” таким образом, есть очень мало шансов на это конфликтует с другими модулями или вызывая никаких проблем с обновлением MagentoВ future.

Содержание наш новый формат файла будет выглядеть следующим образом:

<?xml version="1.0" encoding="UTF-8"?>

<!-- all layout files begin with this node -->
<layout>
    
    <!-- this is the layout handle we are interested in -->
    <default>
        
        <!-- this is the name of the block we want to add to -->
        <reference name="before_body_end">
            
            <!-- 
                here we define our new block and template 
                to be added to 'before_body_end' 
            -->
            <block type="core/template" 
                   name="smashingmagazine_layout_footer" 
                   template="smashingmagazine_layout/footer.phtml" />
            
        </reference>
        
    </default>
    
</layout>

Здесь ссылаются существующей block before_body_end, для того, чтобы добавить свои block smashingmagazine_layout_footer, так как его ребенка.before_body_end это имя block, что имеет свое содержание непосредственно перед выходом </body> теги страницы HTML.Вы можете найти определение этого родителя block, глядя в app/design/frontend/base/default/layout/page.xml, и содержание этого блока выводится в .phtml template с точностью app/design/frontend/base/default/template/page.

С помощью reference, мы можем добавлять контент в существующие block S без необходимости модифицировать ядро ​​Magento файлов.Например, мы могли бы достичь того же результата, что и выше фрагмент, изменяя app/design/frontend/base/default/layout/page.xml непосредственно и добавление наших block код, но это не является хорошей практикой:

<default translate="label" module="page">
    <label>All Pages</label>
    <block type="page/html" name="root" output="toHtml" 
           template="page/3columns.phtml">

        ...

        <block type="core/text_list" name="before_body_end" 
               as="before_body_end" translate="label">
            
            <label>Page Bottom</label>
            
            <block type="core/template" 
                   name="smashingmagazine_layout_footer"
                   template="smashingmagazine_layout/footer.phtml" />
            
        </block>

        ...

    </block>
</default>

Добавление нового шаблона File

Мы уже определили новую block smashingmagazine_layout_footer, и назначить template smashingmagazine_layout/footer.phtml чтобы содержать наш HTML содерж …

Если вы хотите прочитать полностью статью, посетите сайт наших спонсоров

Comments are closed.