Magento is not loading my scripts in an order i want - magento

I'm editing local.xml file to load some javascript, one of them is carosule.js and I want it only on my index page so I can use <cms_index_index> node but it is instantiated by init.js. How can I load them in an order I want?
<cms_index_index>
<reference name="head">
<action method="addItem">
<type>skin_js</type>
<name>js/mycaro.js</name>
</action>
</reference>
</cms_index_index>
<default>
<reference name="head">
<action method="addItem">
<type>skin_js</type>
<name>js/jquery.min.js</name>
</action>
<action method="addItem">
<type>skin_js</type>
<name>js/init.js</name>
</action>
</reference>
</default>
Currently it is loading in this order
<script type="text/javascript" src="http://localhost/m/skin/frontend/hs1st/default/js/jquery.min.js"></script>
<script type="text/javascript" src="http://localhost/m/skin/frontend/hs1st/default/js/init.js"></script>
<script type="text/javascript" src="http://localhost/m/skin/frontend/hs1st/default/js/mycaro.js"></script>

The loading of the plugin should not depend on the order of loading of the files. You need to trigger the loading of the plugin when the DOM has finished loading to be sure all the necessary files are loaded.
Let's say init.js contains something like this;
jQuery('#carousel').Carousel({option:optionvalue});
You'll want to wrap it in code to run when the DOM has finished loading, like this;
jQuery(window).ready(function () {
jQuery('#carousel').Carousel({option:optionvalue});
});
See https://api.jquery.com/ready/

Related

Load external Javascript before skin Javascript in Magento

I'm trying to add the Google Maps Javascript API to my Magento module.
The problem I'm having is that the core/text block that I am including, that contains the external Javascript inclusion tag, only ever appears after all of the addJs actions.
This means the script I have in pvtl_stores.js that targets the google object doesn't work as the google object hasn't been initialized yet.
Here is my local.xml file:
<layout>
<default>
<reference name="head">
<block type="core/text" name="google.maps" before="root">
<action method="setText">
<text><![CDATA[<script src="//maps.googleapis.com/maps/api/js"></script>]]></text>
</action>
</block>
<action method="addItem">
<type>skin_js</type>
<name>js/pvtl_stores.js</name>
</action>
</reference>
</default>
</layout>
Is there a way to have the core/text block load before the addJs actions?
By the way, if it isn't obvious by the question, I'm new to Magento programming!
upload you Js in root\js folder. And call this code in your app\design\frontend\base\default\template\page\html\head.phtml file at top.
<?php echo Mage::getBaseUrl(Mage_Core_Model_Store::URL_TYPE_JS)."/yourjs.js"; ?>
or just direct call that
<script src="//cdnjs.cloudflare.com/ajax/libs/jqueryui/1.11.2/jquery-ui.js"></script>
UPDATE
You have to download the js first then
go to app\design\frontend\rwd\default\layout page.xml (if you are using default theme otherwise go to yourtheme\default\layout) and you js here
<block type="page/html_head" name="head" as="head">
<action method="addJs">
<script>yourjs/yourjs.js</script>
</action>
<action method="addJs">
<script>prototype/prototype.js</script>
</action>

Hide discount code section in cart

I am writing a Magento Extension that is trying to hide the Discount Code section on the checkout cart page. I wrote the following code to replace the current cart.phtml with my custom template.
<layout version="0.1.0">
<checkout_cart_index>
<reference name="checkout.cart">
<action method="setTemplate">
<template>company/module/cart.phtml</template>
</action>
</reference>
</checkout_cart_index>
</layout>
Everything looked good until I realized it even overwrote the template the cart page uses for an empty cart. I have tried many combinations for switch the "checkout_cart_index"
name to the reference name but I cannot get it to just replace that template. I further investigated and found in the default layout it sets the cart values here:
<reference name="content">
<block type="checkout/cart" name="checkout.cart">
<action method="setCartTemplate"><value>checkout/cart.phtml</value></action>
<action method="setEmptyTemplate"><value>checkout/cart/noItems.phtml</value></action>
I tried again using "SetCartTemplate" but I cannot get it to display yet alone behave as I am intending. Any ideas?
In your layout update
<checkout_cart_index>
<reference name="checkout.cart">
<action method="setCartTemplate"><value>path/to/your/cart.phtml</value></action>
<action method="setEmptyTemplate"><value>path/to/your/noItems.phtml</value></action>
<action method="chooseTemplate"/>
</reference>
</checkout_cart_index>
chooseTemplate will choose the right template
Try to Rewrite this core class to hide the discount code section in your cart page
Mage_Sales_Model_Quote_Address_Total_Discount

Magento set custom page title and description for sitemap pages

I am looking for a method to add custom page title and meta description to Magento defaults catalog/seo_sitemap/category/ & catalog/seo_sitemap/product/ pages.
I have done this before on the built-in contacts page by updating the contacts.xml file with:
<reference name="head">
   <action method="setDescription"><title>my description here</title></action>
<action method="setTitle"><title>My title here</title></action>
</reference>
This works absolutely fine. However, I currently do not know how I can apply this or a similar technique to the 2 pages I've outlined.
Do the same thing but apply it in the catalog.xml file. You could also set up a local.xml with the following:
<?xml version="1.0"?>
<layout version="0.1.0">
<catalog_seo_sitemap_category translate="label">
<reference name="head">
<action method="setDescription" module="catalog"><title>Custom description here</title></action>
<action method="setTitle" module="catalog"><title>Custom Site Map here</title></action>
</reference>
</catalog_seo_sitemap_category>
</layout>
You can apply the same method to catalog/seo_sitemap/product/

Magento Content below the Page

I am having trouble with Magento CE 1.7.0.2 displaying content of my custom block below the page. The block displays right on the page, but the content is copied below the page after the closing HTML tag.
The display layout plugin only shows my block referenced once, so I have no idea why this is happening. I'm using a default/custom package. Please help!!!!
My Layout, if it helps:
<?xml version="1.0"?>
<layout version="0.1.0">
<default>
<remove name="store_language" />
<remove name="store_switcher"/>
<remove name="footer_links" />
</default>
<makeorder_index_index>
<reference name="root">
<action method="setTemplate"><template>page/1column.phtml</template></action>
</reference>
<reference name="content">
<block type="makeorder/orderblock" output="toHtml" name="orderdispaly"
template="makeorder/orderdisplay.phtml"/>
</reference>
</makeorder_index_index>
</layout>
you should remove the output="toHtml" directive from your "makeorder/orderblock" block properties. What this does is basically says to display the contents of your block as soon as it's initialized - no matter where it should be placed. So it ends up rendered after the "root" block.

Displaying error messages when two forms are integrated in the same magento page

I have the login form and register form, integrated in the same page. ie, in the login page itself.
I am having a problem in showing the error messages, as if error occurs in any one of the forms, then the error messages are displayed in both the login and register sections.
for example, suppose if we provide wrong login data to login, then the error message is displayed on the top of both the login and register forms, since both the forms are in the same page.
If we try to register with an already existing email address, then also, error message saying email already exists, displayed on the top of login form and register form.
My requirement is that i need to display the error message only in the corresponding form.
In order to integrate both login and register form in to the login page itself, i changed the file \app\design\frontend\anz\default\layout\customer.xml and it is as follows
Layout for customer login page
<customer_account_login translate="label">
<label>Customer Account Login Form</label>
<!-- Mage_Customer -->
<remove name="right"/>
<remove name="left"/>
<reference name="root">
<action method="setTemplate"><template>page/1column.phtml</template></action>
</reference>
<reference name="content">
<block type="customer/form_login" name="customer_form_login" template="customer/form/login.phtml"/>
</reference>
<!-- Mage_Customer -->
<remove name="right"/>
<remove name="left"/>
<reference name="root">
<action method="setTemplate"><template>page/1column.phtml</template></action>
</reference>
<block type="page/html_wrapper" name="customer.form.register.fields.before" translate="label">
<label>Form Fields Before</label>
<!--action method="setMayBeInvisible"><value>1</value></action-->
<action method="setElementClass"><value>rewards</value></action>
</block>
<block type="enterprise_customer/form" template="customer/form/userattributes.phtml" name="customer_form_user_attributes">
<action method="setFormCode"><code>customer_account_create</code></action>
<action method="setEntityModelClass"><code>customer/customer</code></action>
</block>
<block type="enterprise_customer/form" template="customer/form/userattributes.phtml" name="customer_form_address_user_attributes">
<action method="setFormCode"><code>customer_register_address</code></action>
<action method="setEntityModelClass"><code>customer/address</code></action>
</block>
<reference name="content">
<block type="customer/form_register" name="customer_form_register" template="customer/form/register.phtml">
<action method="append"><block>customer.form.register.fields.before</block><alias>form_fields_before</alias></action>
<action method="append"><block>customer_form_user_attributes</block></action>
<action method="append"><block>customer_form_address_user_attributes</block></action>
</block>
</reference>
<update handle="customer_form_template_handle"/>
</customer_account_login>
I am a newbie in magento. Any help would be greatly appreciated.
I changed your code a little bit. Please tell me where your forms are rendered?
<customer_account_login translate="label">
<label>Customer Account Login Form</label>
<!-- Mage_Customer -->
<remove name="right"/>
<remove name="left"/>
<reference name="root">
<action method="setTemplate"><template>page/1column.phtml</template></action>
</reference>
<block type="page/html_wrapper" name="customer.form.register.fields.before" translate="label">
<label>Form Fields Before</label>
<!--action method="setMayBeInvisible"><value>1</value></action-->
<action method="setElementClass"><value>rewards</value></action>
</block>
<block type="enterprise_customer/form" template="customer/form/userattributes.phtml" name="customer_form_user_attributes">
<action method="setFormCode"><code>customer_account_create</code></action>
<action method="setEntityModelClass"><code>customer/customer</code></action>
</block>
<block type="enterprise_customer/form" template="customer/form/userattributes.phtml" name="customer_form_address_user_attributes">
<action method="setFormCode"><code>customer_register_address</code></action>
<action method="setEntityModelClass"><code>customer/address</code></action>
</block>
<reference name="content">
<block type="customer/form_login" name="customer_form_login" template="customer/form/login.phtml"/>
<block type="customer/form_register" name="customer_form_register" template="customer/form/register.phtml">
<action method="append"><block>customer.form.register.fields.before</block><alias>form_fields_before</alias></action>
<action method="append"><block>customer_form_user_attributes</block></action>
<action method="append"><block>customer_form_address_user_attributes</block></action>
</block>
</reference>
<update handle="customer_form_template_handle"/>
</customer_account_login>
Welcome to Magento Theming :-)
First, it's generally a better practice to use local.xml layout file under your custom theme (it's not there by default, it's for the end implementer to use). This way, you won't have to needlessly merge changes into customer.xml to keep it up to date.
In your local.xml, you can use the <update /> directive to include the layout update xml from one handle into another (which is effectively what you are doing already):
<customer_account_login>
<update handle="customer_account_create" />
</customer_account_login>
You will need to customize your create template customer/form/register.phtml and remove its <?php echo $this->getMessagesBlock()->getGroupedHtml() ?> call.
I tried a simple way to achieve the requirement. There may be better ways to do this, but I think this one is simple.
I had created a hidden variable and I put those hidden variable in forms to identify which form is submitted. These hidden variable is passed as a parameter after completing the corresponding action. Then I provided an if block to display the messages according to the parameter value.
I did this all by overriding the Mage Customer module.

Resources