0

I want to add class in magento 2 checkout page for designing. Is it Possible to do.?

Thanks.

If I add a class in New Address button like below code in shipping.html file.

<button type="button"
            data-bind="click: showFormPopUp, visible: !isNewAddressAdded()"
            class="action action-show-popup primary s2">
        <span data-bind="i18n: 'New Address'"></span></button>
    <div id="opc-new-shipping-address" data-bind="visible: isFormPopUpVisible()">
        <!-- ko template: 'Magento_Checkout/shipping-address/form' --><!-- /ko -->
    </div>
4
  • Where you have to add class in checkout? and you are using one step checkout ? Commented Mar 22, 2017 at 11:08
  • In shipping address fields and all fields and progress bars also
    – Moin Malek
    Commented Mar 22, 2017 at 11:15
  • Which place you want to add class, in shipping.html file? Commented Mar 24, 2017 at 4:52
  • I am adding class in button tag class name="primary s2"
    – Moin Malek
    Commented Mar 24, 2017 at 5:18

2 Answers 2

1

I think you need to check in Magento Checkout module. You can check in app\design\frontend\your-package\themename\Magento_Checkout\templates\cart. If module doesn't exist in theme copy required files from vendor\magento\module-checkout\view\frontend\templates to app\design\frontend\your-package\themename\Magento_Checkout\templates\cart\ and add class there in phtml file.

OR

you can add classes in html file by copy files from vendor\magento\module-checkout\view\frontend\web\template\ to app\design\frontend\your-package\themename\Magento_Checkout\web\template.

After making any change in html file. You can run commands in this sequence:

sudo php bin/magento setup:upgrade
sudo chmod -R 777 var
sudo chmod -R 777 pub
sudo php bin/magento setup:static-content:deploy
sudo php bin/magento cache:flush
sudo php bin/magento cache:clean
sudo chmod -R 777 var
sudo chmod -R 777 pub
sudo php bin/magento indexer:reindex design_config_grid

also clear browser cache.

Thanks

7
  • yes it is in theme folder but when adding classes it will not take
    – Moin Malek
    Commented Mar 22, 2017 at 12:46
  • You deployed static content after change, sudo php bin/magento setup:static-content:deploy Commented Mar 22, 2017 at 12:59
  • No i just compile using sudo php/bin magento setup:di:compile
    – Moin Malek
    Commented Mar 22, 2017 at 13:16
  • After making any change you need to run cache clear & static content deploy commands. Commented Mar 23, 2017 at 7:16
  • Yes I all do...
    – Moin Malek
    Commented Mar 23, 2017 at 11:27
0

Copy file from

vendor/magento/module-checkout/view/frontend/web/template/shipping.html

and add to below file path

app/design/frontend/YourVendor/YourTheme/Magento_Checkout/web/template/shipping.html

Now you can add button class in this file.

Let me know if you have any query from this.

Run below commands

php bin/magento setup:upgrade

php bin/magento setup:static-content:deploy

php bin/magento cache:clean

3
  • Hello @S H Patel I am also do above method but can not get output
    – Moin Malek
    Commented Mar 24, 2017 at 7:34
  • Check file path is correct or not. I have checked and tested code, works for me. Commented Mar 24, 2017 at 7:41
  • Yes i am checking all paths
    – Moin Malek
    Commented Mar 24, 2017 at 7:43

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.