madelinecodes Posted August 13 Share Posted August 13 I am trying to change one product to have the status of "Hold" instead of "Sold." So far I have been able to figure out how to change ALL products to "Hold" but cannot successfully target a single product. Do you have any recommendations? Here is the page: https://www.melissaandersonstudio.com/landscapes Product: https://www.melissaandersonstudio.com/paintings/p/deep-dive The working code that changes all products to "Hold" <script> document.addEventListener("DOMContentLoaded", function() { var soldBadges = document.querySelectorAll('.product-mark.sold-out'); soldBadges.forEach(function(badge) { badge.textContent = 'Hold'; }); }); </script> Link to comment
Lesum Posted August 14 Share Posted August 14 @madelinecodes Hi! You can add this code under Website > Pages > Website Tools > Code Injection > Header to change the 'Sold' status text to 'Hold' just for the product you mentioned: <script> document.addEventListener("DOMContentLoaded", function() { // Change text based on product URL const productLink = document.querySelector('a[href="/paintings/p/deep-dive"]'); if (productLink) { const soldOutMark = productLink.querySelector('.product-mark.sold-out'); if (soldOutMark) { soldOutMark.textContent = 'Hold'; } } // Change text based on product page ID if (document.body.id === 'item-669578a801b30a20bf975a78') { const soldOutMarkOnPage = document.querySelector('.product-mark.sold-out'); if (soldOutMarkOnPage) { soldOutMarkOnPage.textContent = 'Hold'; } } }); </script> If my comments were useful, please like or mark my solution as answer so others can scroll to it quickly. Sam Web Developer & Digital Designer ☕ Did you find my contribution helpful? Buy me a coffee? Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment