Magento 1.7 – JS Not Added to Head and phtml Not Loaded

javascriptlayoutmagento-1.7template

I am creating a very simple custom module to display an inline popup in my store.

The problem is that the my additional JS doesn't seem to be added, and the phtml file is not loaded. Both are in newsletterpopup.xml.

What am I missing?

\app\etc\modules\Mav_NewsletterPopUp.xml

<?xml version="1.0" ?>
<config>
      <modules>
            <Mav_NewsletterPopUp>
                  <active>true</active>
                  <codePool>local</codePool>
            </Mav_NewsletterPopUp>
      </modules>
</config>

\app\code\local\Mav\NewsletterPopUp\etc\config.xml

<?xml version="1.0" ?>

<config>
      <modules>
            <Mav_NewsletterPopUp>
                  <version>0.0.1</version>
            </Mav_NewsletterPopUp>
      <modules>
      <frontend>
            <layout>
                  <updates>
                        <newsletterpopup>
                              <file>newsletterpopup.xml</file>
                        </newsletterpopup>
                  </updates>
            </layout>
      </frontend>
</config>

\app\design\frontend\MY_THEME_HERE\default\layout\newsletterpopup.xml

<?xml version="1.0" ?>
<layout version="0.1.0">
    <default>
        <reference name="head">
            <action method="addJs"><script>mav/cookie/jquery.cookie.js</script></action>
        </reference>
        <reference name="before_body_end">
            <block type="core/template" name="newsletter_popup" as="newsletter_popup" template="mav/newsletter-popup.phtml" />
        </reference>
    </default>
</layout>

\app\design\frontend\MY_THEME_HERE\default\template\mav\newsletter-popup.phtml

<!-- HTML for popup shall appear here -->

\js\mav\cookie\jquery.cookie.js

//taken from http://www.demacmedia.com/wp-content/uploads/2013/08/jquery-files-for-popup1.zip

Best Answer

I think there is problem with closing tag of </modules> can you update xml with added closing tag

<config>
      <modules>
            <Mav_NewsletterPopUp>
                  <version>0.0.1</version>
            </Mav_NewsletterPopUp>
      </modules>
      <frontend>
            <layout>
                  <updates>
                        <newsletterpopup>
                              <file>newsletterpopup.xml</file>
                        </newsletterpopup>
                  </updates>
            </layout>
      </frontend>
</config>

Related Solutions

Add Custom Layouts for CMS and Category – Magento 1.7 Guide

In order to make it appear in the layout dropdown you need to create a custom module (you can also add something in a core file but please don't do that). Let's name the extension Easylife_Layout. For this you need to create the following files: app/etc/modules/Easylife_Layout.xml - the declaration file

<?xml version="1.0"?>
<config>
    <modules>
        <Easylife_Layout>
            <active>true</active>
            <codePool>local</codePool>
            <depends>
                <Mage_Page />
            </depends>
        </Easylife_Layout>
    </modules>
</config>

app/code/local/Easylife/Layout/etc/config.xml - the configuration file

<?xml version="1.0"?> 
<config>
    <modules>
        <Easylife_Layout>
            <version>0.0.1</version>
        </Easylife_Layout>
    </modules>
    <global>
        <page>
            <layouts> 
                <lookbook module="page" translate="label">
                    <label>Lookbook</label>
                    <template>page/1column-lookbook.phtml</template>
                    <layout_handle>lookbook</layout_handle>
                </lookbook> 
            </layouts>
        </page>
    </global>
    <frontend>
        <layout>
            <updates>
                <easylife_layout>
                    <file>easylife_layout.xml</file>
                </easylife_layout>
            </updates>
        </layout>
    </frontend>
</config>

app/design/frontend/{interface}/{theme}/layout/easylife_layout.xml - the layout file

<?xml version="1.0"?> 
<layout>
    <lookbook translate="label">
        <label>Lookbook</label>
        <reference name="root">
            <action method="setTemplate"><template>page/1column-lookbook.phtml</template></action>
            <action method="setIsHandle"><applied>1</applied></action>
        </reference>
    </lookbook> 
</layout>

The last one is necessary in case you want to be able to reference your custom layout in layout files. Something like:

<update hande="lookbook" />

Clear the cache and...that's it. Le tme know if it works for you.

Magento – Empty page displaying in magento

I think that you are going about this the wrong way. From what I think your aim is:

Add some custom js files,
Change a single template slightly,

I would suggest just creating a local.xml file in your theme, rather than creating a complete theme an completely replacing the standard page.xml. The fact that you are replacing all the contents of the page.xml file is why you get a blank page.

If you create a local.xml that looks as follows:

<?xml version="1.0"?>
<layout>
    <default>
        <reference name="head">
            <action method="addItem">
                <type>skin_js</type>
                <name>js/jquery.js</name>
                <params/>
            </action>
            <action method="addItem">
                <type>skin_js</type>
                <name>js/cf.js</name>
                <params/>
            </action>
        </reference>
        <reference name="header">
            <action method="setTemplate">
                <template>path/to/your/new/header.phtml</template>
            </action>
        </reference>
    </default>
</layout>

Without creating a completely new theme when one is not needed.

Best Answer

Related Solutions

Add Custom Layouts for CMS and Category – Magento 1.7 Guide

Magento – Empty page displaying in magento

Related Topic