Daily Archives: May 19, 2013

Magento

How to Include Custom CSS and JS files On to All Product Pages in Magento?

Hello friends today I write an article on How to include Custom CSS and JS file on All Product Pages in Magento?

In magento it’s very easy to add our custom CSS and JS file. You didn’t add the tag for CSS and JS file to add in all pages rather than you have to just add that thing in your .xml file as I show below.

Step 1 : First find that  in your custom theme’s layout folder the local.xml file exists or not. If local.xml file is not created in your custom theme layout folder then just create as below.

<?xml version="1.0"?>
<layout>
</layout>

Step 2 : Now you created local.xml file and we add the CSS file from the skin CSS folder.

<?xml version="1.0"?>
<layout>
     <catalog_product_view>
          // this is a reference so it will add this in header part.
           <action method="addCss">// this is action for add css file
                 <stylesheet>
                           css/custom.css /*This is ur css path*/
                 </stylesheet>
              </action>
         </reference>
     </catalog_product_view>
</layout>

Now we try to add JavaScript file from the skin JS folder.

<?xml version="1.0"?>
<layout>
     <catalog_product_view>
         <reference name="head">
             <action method="addItem">
                   <type>skin_js</type>
                   <name>js/customJs.js</name>
              </action>
         </reference>
     </catalog_product_view>
</layout>

Now we try to add JavaScript file from the /js folder.

<?xml version="1.0"?>
<layout>
     <catalog_product_view>
         <reference name="head">
             <action method="addJs">
                   <script>myJs.js</script>
              </action>
         </reference>
     </catalog_product_view>
</layout>

Thanks for view this article.

Advertisements

How to Include Custom CSS and JS files On Adding custom CSS / JS to All Category Pages in Magento?

Hello friends today I write an article on How to include Custom CSS and JS file on All Category Pages in Magento?

In magento it’s very easy to add our custom CSS and JS file. You didn’t add the tag for CSS and JS file to add in all pages rather than you have to just add that thing in your .xml file as I show below.

Step 1 : First find that  in your custom theme’s layout folder the local.xml file exists or not. If local.xml file is not created in your custom theme layout folder then just create as below.

<!--?<span class="hiddenSpellError" pre=""-->xml version="1.0"?>
<layout>
</layout>

Step 2 : Now you created local.xml file and we add the CSS file from the skin CSS folder.

<?xml version="1.0"?>
<layout>
     <catalog_category_default>
          // this is a reference so it will add this in header part.
              // this is action for add css file
                 <stylesheet>
                           css/custom.css /*This is ur css path*/
                  </stylesheet>
              </action>
         </reference>
     </catalog_category_default>
</layout>

Now we try to add JavaScript file from the skin JS folder.

<?xml version="1.0"?>
<layout>
     <catalog_category_default>
         <reference name="head">
             <action method="addItem">
                   <type>skin_js</type>
                   <name>js/customJs.js</name>
              </action>
         </reference>
     </catalog_category_default>
</layout>

Now we try to add JavaScript file from the /js folder.

<?xml version="1.0"?>
<layout>
     <catalog_category_default>
         <reference name="head">
             <action method="addJs">
                   <script>myJs.js</script>
              </action>
         </reference>
     </catalog_category_default>
</layout>

Thanks for view this article.

Magento

How to Include Custom CSS and JS files On all CMS pages only in Magento?

Hello friends today I write an article on How to include Custom CSS and JS file on all CMS pages onbly in Magento?

In magento it’s very easy to add our custom CSS and JS file. You didn’t add the tag for CSS and JS file to add in all pages rather than you have to just add that thing in your .xml file as I show below.

Step 1 : First find that  in your custom theme’s layout folder the local.xml file exists or not. If local.xml file is not created in your custom theme layout folder then just create as below.

<?xml version="1.0"?>
<layout>
</layout>

Step 2 : Now you created local.xml file and we add the CSS file from the skin CSS folder.

<?xml version="1.0"?>
<layout>
     <cms_page>
          // this is a reference so it will add this in header part.
             <action method="addCss">// this is action for add css file
                 <stylesheet>
                           css/custom.css /*This is ur css path*/
                   // identify which css you want to include.
              </action>
         </reference>
     </cms_page>
</layout>

Now we try to add JavaScript file from the skin JS folder.

<?xml version="1.0"?>
<layout>
     <cms_page>
         <reference name="head">
             <action method="addItem">
                   <type>skin_js</type>
                   <name>js/customJs.js</name>
              </action>
         </reference>
     </cms_page>
</layout>

Now we try to add JavaScript file from the /js folder.

<?xml version="1.0"?>
<layout>
     <cms_page>
         <reference name="head">
             <action method="addJs">
                   <script>myJs.js</script>
              </action>
         </reference>
     </cms_page>
</layout>

Thanks for view this article.