2

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?

4

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>
  • 1
    Custom 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 wrong – Prathap Gunasekaran Mar 19 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 Mar 19 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 Mar 19 at 9:23

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.