CODEWITHSUNDEEP
magentomagento-1.7
Sonhja
Sonhja

Reputation: 8448

Add .js in Magento

I'm trying to add my own .js to a Magento project, but I can't do it...

I've followed the steps here, but I still can't do it.

I did the following:

  1. Frontend: Opened page.xml and inside the block: block type="page/html_head" name="head" as="head", I included my .js file: lib/query.js.
  2. Backend: I modified main.xml like said here, and I added the .js to the block named as head.

But nothing happens. The javascript seems to not be working. Any ideas on why, or any step that I need to follow?

I EDIT THE QUESTION because I found a different problem...:

I did everything as suggested in the Answers. And it didn't work. But I think it's because of the script.

When I go to firebut, I see these mistakes, that I don't know if they were at first:

The mistake

First mistake is located at head.phtml, when I make the call:

<script type="text/javascript">
    $jQuery.noConflict();
</script>

The second and the third one are located at the beginning of my .js files...

Any idea? Maybe solving this, will solve my other issue...

Upvotes: 0

Views: 1403

Answers (3)

MagePal Extensions
MagePal Extensions

Reputation: 17656

jQuery: Creates a different alias for jQuery to use in the rest of the script.

 var $j = jQuery.noConflict();
 // Do something with jQuery
 $j("div p").hide();
 //then use magento prototype with
 $("content").style.display = 'none';

See more http://api.jquery.com/jQuery.noConflict/

Since it seem like you are add the same file to the admin and the frontend. Put your file in (root folder) /js/query.js (not /lib/query.js)

Add this to page.xml

 <block type="page/html_head" name="head" as="head">
        <action method="addJs"><script>query.js</script></action>
        ....

Add this to main.xml

<default>
    <block type="adminhtml/page" name="root" output="toHtml" template="page.phtml">
       <block type="adminhtml/page_head" name="head" as="head" template="page/head.phtml">
        <action method="addJs"><script>query.js</script></action>
        ....

It's not a wise idea to make changes to core files. Take a look on workaround for admin files http://www.magentocommerce.com/boards/viewthread/17306/

Upvotes: 1

Anant
Anant

Reputation: 3077

Inside the 'block type="page/html_head" ' insert following line

<action method="addJs"><script>lib/query.js</script></action>

Also put your query.js file at "magento-root-direcory/js/lib/query.js" location. And of course do the reindexing and delete your cache.

Upvotes: 1

Chris Bell
Chris Bell

Reputation: 593

1) Have you deleted the cache and session?: http://kb.siteground.com/article/How_to_clear_the_cache_in_Magento.html

2) Double check the page source in your web browser. The file might be included correctly already, but may be your javascript file itself is the problem.

Upvotes: 1

Related Questions