AD0-E720 practice question 3 of 10

An Adobe Commerce developer wants to completely overwrite _module. less of Orange_Checkout module, in their theme. Where would the developer place the file?

Full set: 50 questions
Answer options
A: Custom/theme/Orange_Checkout/frontend/web/css/_module.less
B: Custom/theme/web/css/source/Orange_Checkout/_module.less
C: Custom/theme/Orange_Checkout/web/css/source/_module.less Correct answer
Correct Answer:
C. Custom/theme/Orange_Checkout/web/css/source/_module.less
Explanation

To completely overwrite a module-specific LESS file, such as module.less, within a custom theme, the file must be placed in a directory path that mirrors the module's structure. The correct path is //web/css/source/. In this scenario, the theme directory is Custom/theme, the module is OrangeCheckout, and the file is module.less. This structure ensures that the Adobe Commerce fallback mechanism locates and uses the theme's version of the file, effectively replacing the original module's file during the static content deployment process.

Why Incorrect

A. Custom/theme/OrangeCheckout/frontend/web/css/module.less This path is incorrect because the frontend directory is not used for theme overrides. The theme's application area is defined in its theme.xml file, not in the directory structure.
B. Custom/theme/web/css/source/OrangeCheckout/module.less This path is incorrect for a complete file override. Placing files directly in the theme's web/css/source directory is typically for extending styles via extend.less, not for overwriting a specific module's file.

References

1. Adobe Commerce Frontend Developer Guide: The official documentation specifies the exact directory structure for overriding module styles. It states, "To override module styles, you need to add an overriding file in your theme folder according to the module it belongs to. For example, to override the module.less file of the MagentoReview module, you need to create a module.less file in the /MagentoReview/web/css/source directory."

Source: Adobe Commerce Developer Documentation

Section: Frontend Developer Guide > Theming > CSS > Preprocessing CSS > Override a module's styles. (The exact URL may change, but the path within the documentation remains consistent).

Scroll to Top