- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
modal pop-up based on atrribute value
Hi,
I do not know a lot about programming so hopefully someone want to help me with a wish we have for customer notification.
I have created a basis jquery modal pop-up for my customers. But I do not want to bother all customers. Only customers that buy a specific configurable product option. For example I want to only show pop-up if somebody buys a blue t-shirt and not when it is yellow.
Is it posible to only show based on specific attribute value of product? If so, can you please help how?
The code i have so far
<script>
require(
[
'jquery',
'Magento_Ui/js/modal/modal'
],
function(
$,
modal
) {
var options = {
type: 'popup',
responsive: true,
innerScroll: true,
modalClass: 'custom-popup-modal',
buttons: [{
text: $.mage.__('Sluiten'),
class: '',
click: function () {
this.closeModal();
}
}]
};
var popup = modal(options, $('#custom-popup-modal'));
$( document ).ready(function() {
$('#custom-popup-modal').modal('openModal');
});
}
);
</script>
Thank you.
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Re: modal pop-up based on atrribute value
You have to override js file from path:
vendor/magento/module-catalog/view/frontend/web/js/catalog-add-to-cart.js
To
app/design/frontend/YourTheme/Packadge/Magento_Catalog/web/js/catalog-add-to-cart.js
You have to customise and add your required functionality on add to cart event.
It may help you to resolve issue.
It issue resolve, please click on 'Kudos' & Accept as Solution!
- Mark as New
- Bookmark
- Subscribe
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
Re: modal pop-up based on atrribute value
Hi @martijndocter ,
For this please follow below link
In the JS check for the particular attribute value and trigger popup modal opening.
For overriding the JS, please follow the standard approach of mixins.
https://devdocs.magento.com/guides/v2.4/javascript-dev-guide/javascript/js_mixins.html
Hope this helps you!
Problem Solved! Click 'Kudos' & Accept as Solution!