Changing the discount form on review and payment page of onepage checkout

[maxedout]

Hello Guys/Gals,

I have been trying to override the default 'Apply Discount Code' form in the last step of checkout, the Review and Payments step. I want to change the word 'Discount' to 'Coupon' and add 'here' to the placeholder for the input. I did this already on the cart's totals section and in there it would have worked from the translation file, I just prefer to have it 'hard' coded. I have tried through the translation file and through overriding the actual files. Obviously I am doing something wrong or it would work.

Does anyone have experience in modifying these files?

Thanks


Platform: Magento 2.2.6
Theme: Ultimo 2.8.0, using a child as per 'best practices'

[Manish Mittal]

Hello @maxedout

You can simply follow below translations dev docs to change text:

https://devdocs.magento.com/guides/v2.0/frontend-dev-guide/translations/xlate.html

https://devdocs.magento.com/guides/v2.0/frontend-dev-guide/translations/translate_practice.html

[maxedout]

Hello Manish,

I was checking out the M2.2 version of those links, the straight tranlation csv doesn't work without being a package? Because I have been trying that approach.

[gelanivishal · Accepted solution]

Hello @maxedout,

Seems that the JS template translation is read from js-translation.json which is generated during setup:static-content:deploy execution. In order to populate data in this file a new language package has to be created for the project.

So instead of adding the CSV at the theme level like app/design/<area>/<vendor>/<theme-name>/i18n/xx_XX.csv we need to add it in the language package.

To create a new Language Package first from project document root we will need to create the following directories:

mkdir -p app/i18n/<project-name>/<xx_xx>

Important: USE lowercase DIRECTORY NAMES ONLY camcelcased folder names will not work

Then change directory to the newly created folders:

cd app/i18n/<project-name>/<xx_xx>

Now you can create a composer.json (optional) file with the following content:

{                                                     
    "name": "<project-name>/<xx_xx>",                             
    "description": "<sample description>", //Ex:English (United States) language
    "version": "<version-number>", //100.0.1                             
    "license": [                                      
        "OSL-3.0",                                    
        "AFL-3.0"                                     
    ],                                                
    "require": {                                      
        "magento/framework": "100.0.*"                
    },                                                
    "type": "magento2-language",                      
    "autoload": {                                     
        "files": [                                    
            "registration.php"                        
        ]                                             
    }                                                 
}                     

Next create we need a language.xml file with the following contents:

<language xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="urn:magento:framework:App/Language/package.xsd">
    <code>xx_XX</code> <!-- example: <code>en_US</code> -->
    <vendor><project-name></vendor>
    <package><xx_xx></package> <!-- example: <package>en_us</package> -->
</language>

After than registration.php containing the following content is needed:

\Magento\Framework\Component\ComponentRegistrar::register(
    \Magento\Framework\Component\ComponentRegistrar::LANGUAGE,
    '<project-name>_<xx_xx>',
    __DIR__
);

Now we can create our translation CSV. If you already have one inside the theme folder something like app/design/<area>/<vendor>/<theme-name>/i18n/xx_XX.csv you can just move it to app/i18n/<project-name>/<xx_xx>/xx_XX.csv

Now from the project document root we need to run these commands:

find pub/static -name js-translation.json -exec rm -rf {} \;

We need to delete the js-translation.json which has been already created before running the setup:static-content:deploy

Now we run static content deploy:

php bin/magento setup:static-content:deploy <xx_XX>

Once that's done we clear the cache:

php bin/magento cache:clean
php bin/magento cache:flush

We can verify if the translation files for JS template has been generated by finding all the js-translation.json inside the pub/static folder.

find pub/static -name js-translation.json

This will provide the list of all the translation files generated for JS templates.

--
If my answer is useful, please Accept as Solution & give Kudos

[maxedout]

That worked perfectly, awesome.


Thank you so much