Hi Team,
I'm customising ootb tabs component, need to override ootb js, is there a way to override ootb js of tabs component.
Thanks in advance,
Keerthi K.
Solved! Go to Solution.
Views
Replies
Total Likes
Hi @Keerthi0555
Identify the JS file: Find the JavaScript file associated with the tabs component that you want to customize. This file is likely included in your project or part of the third-party library used for the tabs.
Create a Custom JS file: Create a new JavaScript file in your project to hold your customizations. This file should contain the modifications you want to make.
Reference Custom JS file: Link your custom JavaScript file after the inclusion of the OOTB tabs JS file in your HTML. This ensures that your customizations override the OOTB behavior.
<script src="path/to/ootb-tabs.js"></script>
Remember to replace "path/to/ootb-tabs.js" and "path/to/your-custom-tabs.js" with the actual paths to the OOTB tabs JavaScript file and your custom JavaScript
For overriding clientlibs, we create hook clientlibs by adding category:[cq.authoring.editor.sites.page.hook]
Here is an example for customing ootb clientlibs
https://sourcedcode.com/blog/aem/aem-touch-ui-show-hide-tabs-by-style-system-configuration
Hi @Keerthi0555
Identify the JS file: Find the JavaScript file associated with the tabs component that you want to customize. This file is likely included in your project or part of the third-party library used for the tabs.
Create a Custom JS file: Create a new JavaScript file in your project to hold your customizations. This file should contain the modifications you want to make.
Reference Custom JS file: Link your custom JavaScript file after the inclusion of the OOTB tabs JS file in your HTML. This ensures that your customizations override the OOTB behavior.
<script src="path/to/ootb-tabs.js"></script>
Remember to replace "path/to/ootb-tabs.js" and "path/to/your-custom-tabs.js" with the actual paths to the OOTB tabs JavaScript file and your custom JavaScript