I created a module for Magento 2, with two files to add to the user registration page:
app/code/MyModulespace/ModuleName/view/frontend/web/css /mycss.css
app/code/MyModulespace/ModuleName/view/frontend/web/js/ myjs.js
How can I add these two files to the user registration page?
1 Answer 1
Create customer_account_create.xml at
app/code/MyModulespace/ModuleName/view/frontend/layout/customer_account_create.xml
<?xml version="1.0"?>
<page xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:View/Layout/etc/page_configuration.xsd">
<head>
<script src="MyModulespace_ModuleName::js/myjs.js"/>
<css src="MyModulespace_ModuleName::css/mycss.css" />
</head>
</page>
Also, keep Magento_Customer in a sequence of your module
app/code/MyModulespace/ModuleName/etc/module.xml
<?xml version="1.0"?>
<config xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:Module/etc/module.xsd">
<module name="MyModulespace_ModuleName" setup_version="1.0.0">
<sequence>
<module name="Magento_Customer"/>
</sequence>
</module>
</config>
Add custom js via
requirejs-config.js
app/code/MyModulespace/ModuleName/view/frontend/requirejs-config.js
var config = {
map: {
'*': {
myjs:'MyModulespace_ModuleName/myjs'
}
}
};
app/code/MyModulespace/ModuleName/web/js/myjs.js
define('jquery', function($) {
//Your custom js code here
}(jQuery)
);
Then you can use custom js in registration template
<script>
// <![CDATA[
require(['jquery','myjs'], function (,ドル myjs) {
//Your code
});
// ]]>
</script>
-
1Custom js shouldn't be added this way, it needs to be added via requirejs-config.js devdocs.magento.com/guides/v2.3/javascript-dev-guide/javascript/… correct me if am wrongPrathap Gunasekaran– Prathap Gunasekaran2019年03月19日 09:06:09 +00:00Commented Mar 19, 2019 at 9:06
-
1@PrathapGunasekaran you can also add custom Js directly with a layout. But as per the question, he needs custom js only in the registration page. So for that, we also need to override registration template and then include require js.Prince Patel– Prince Patel2019年03月19日 09:11:37 +00:00Commented Mar 19, 2019 at 9:11
-
Ok thank you, usually it happens when you add custom js without defining dependencies then if started showing function not defined. Anyway thanks for the information.Prathap Gunasekaran– Prathap Gunasekaran2019年03月19日 09:23:37 +00:00Commented Mar 19, 2019 at 9:23