How i can change checkout steps Label in magento 2? http://prntscr.com/nr9rrr
- Did you try my solution?Arunprabakaran M– Arunprabakaran M2019-05-21 08:50:53 +00:00Commented May 21, 2019 at 8:50
- using custom module or theme ???Ronak Rathod– Ronak Rathod2019-05-21 09:06:08 +00:00Commented May 21, 2019 at 9:06
- yes in custom theme. i have tried below method but it didn't worked for me. might be there is something which i have missed.sudo55– sudo552019-05-21 10:04:18 +00:00Commented May 21, 2019 at 10:04
2 Answers
Magento 2 having onepage 2 step checkout.
- Shiping
- Review & Payment
For changing Label for Shipping
copy a file /vendor/magento/module-checkout/frontend/web/js/view/shipping.js. create a new file in app/design/frontend/{vendorname}/{themename}/Magento_Checkout/web/js/view/shipping.js
change in function stepNavigator.registerStep 3rd argument shipping to custom label.
stepNavigator.registerStep( 'shipping', '', $t('Custom Label'), this.visible, _.bind(this.navigate, this), 10 );
same way we can change for review and payment step in payment.js file.
- there is no such file exists. prntscr.com/nrppfssudo55– sudo552019-05-22 05:43:10 +00:00Commented May 22, 2019 at 5:43
- check inside /vendor/magento/module-checkout/frontend/web/js/view folder.Shekhar Suman– Shekhar Suman2019-05-22 05:44:40 +00:00Commented May 22, 2019 at 5:44
- show me all file inside view folder.Shekhar Suman– Shekhar Suman2019-05-22 05:55:24 +00:00Commented May 22, 2019 at 5:55
- oky sorry, i got this file. for testing i changed the label directly in pub/..., as u said. prntscr.com/nrpz1t but it did not worked. prntscr.com/nrpzdmsudo55– sudo552019-05-22 06:13:58 +00:00Commented May 22, 2019 at 6:13
- run php bin/magetno cache:clean and cache:flush cmd, then after clear you browser history and check.Shekhar Suman– Shekhar Suman2019-05-22 06:25:50 +00:00Commented May 22, 2019 at 6:25
You can achieve this using a mixin.
Create a requirejs-config.js file in your design folder e.g. app/design/frontend/custom/theme/Magento_Checkout/requirejs-config.js
var config = { 'config': { 'mixins': { 'Magento_Checkout/js/view/shipping': { 'Magento_Checkout/js/view/checkout/shipping-mixin': true } } } }; Now create your mixin under the same directory e.g. app/design/frontend/custom/theme/Magento_Checkout/web/js/view/checkout/shipping-mixin.js
define([ 'jquery', 'ko', 'Magento_Checkout/js/model/step-navigator' ], function($, ko, stepNavigator) { 'use strict'; var mixin = { initialize: function() { this._super(); $.each(stepNavigator.steps(), function(index, step) { if (step.code === 'shipping') { step.title = 'Your step title'; } }); } }; return function(target) { return target.extend(mixin); } }); - 1This works very well and doesn't rewrite any files. Thank youZankar– Zankar2019-11-29 11:46:14 +00:00Commented Nov 29, 2019 at 11:46