I have created 1 custom tab on the checkout page and it's working fine I follow below link to add the tab on cart page.

Magento 2 - Add step on checkout

I want to add a link name as "Create an account".On click of that link, I want to redirect the page on create account page.

2 Answers 2


Useful link how to add the link in a tag

Best Way Of Getting Base URL Inside KnockoutJS .html File

checkout-login-step.js file

    function (
    ) {
        'use strict';
         * check-login - is the name of the component's .html template
        return Component.extend({
            defaults: {
                template: 'Lalitmohan_Checkoutstep/check-login'

            //add here your logic to display step,
            isVisible: ko.observable(true),
            isLogedIn: customer.isLoggedIn(),
            //step code will be used as step content id in the component template
            stepCode: 'isLogedCheck',
            //step title value
            stepTitle: 'custom step 2',

             * @returns {*}
            initialize: function () {
                // register your step
                    //step alias
                    //observable property with logic when display step or hide step

                    _.bind(this.navigate, this),

                     * sort order value
                     * 'sort order value' < 10: step displays before shipping step;
                     * 10 < 'sort order value' < 20 : step displays between shipping and payment step
                     * 'sort order value' > 20 : step displays after payment step

                return this;

             * The navigate() method is responsible for navigation between checkout step
             * during checkout. You can add custom logic, for example some conditions
             * for switching to your custom step
            navigate: function () {

            getBaseUrl: function() {
                return url.build('customer/account/create');
             * @returns void
            navigateToNextStep: function () {

check-login.html file

<!--Use 'stepCode' as id attribute-->
<li data-bind="fadeVisible: isVisible, attr: { id: stepCode }">
   <div class="step-title" data-bind="i18n: stepTitle" data-role="title"></div>
   <div id="checkout-step-title"
       <p>You Are <span data-bind="if: isLogedIn">Already</span> <span data-bind="if: !isLogedIn">not</span> Logged-in</p>
       <span data-bind="if: !isLogedIn"><a href="#" data-bind="attr: { href: getBaseUrl() }" >Create an Account</a></span>
       <form data-bind="submit: navigateToNextStep" novalidate="novalidate">
           <div class="actions-toolbar">
               <div class="primary">
                   <button data-role="opc-continue" type="submit" class="button action continue primary">
                       <span><!-- ko i18n: 'Next'--><!-- /ko --></span>

In your xml you can add a new item under the step like so:

 <item name="create-account-link" xsi:type="array">
    <item name="component" xsi:type="string">VENDOR_MODULE/js/view/create-account-link

Then create a js file for it.


], function (Component) {
    'use strict';

    return Component.extend({
        defaults: {
            template: 'VENDOR_MODULE/create-account-link'


Then create the html for it: web/template/create-account-link.html

<a href.... you get the idea ... ></a>
  • how to write link <a href=" " ></a> ?
    – sky
    Commented Jul 25, 2018 at 10:16
  • <a href="YOURURL/customer/account/create/">Create an account</a> Something like this, there might be a Magento specific way to create the dynamic path but i'm unsure how to do that.
    – Sanne
    Commented Jul 25, 2018 at 10:24
  • @sanne thanks for your help but I got the answer from another link. Commented Jul 25, 2018 at 10:36
  • @Sanne, can we add link for New address button in checkout? Commented Mar 29, 2019 at 10:00
  • @jafarpinjar Probably, your best bet is to look at how Magento currently adds the new address button and just copy the functionality :)
    – Sanne
    Commented Mar 29, 2019 at 10:04

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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