Adding dynamic values from CMS to button

Design help Custom code
1

Hi,
I’m using Webflow + Memberstack and want to add a dynamic custom attribute to a checkout-button in a collection template page. I have the value (PRICEID) stored in the respective CMS collection for that page. I was hoping the following custom code would work to set the dynamic attribute:

> <script>
>   // Define a function to set the 'data-ms-price:add' attribute on buttons
>   function setButtonPrice(priceid) {
>   // Find all buttons with the combo class 'button buy'
>   var buyButtons = document.querySelectorAll('.button.buy');
>   
>   // Set the 'data-ms-price:add' attribute value on each button
>   for (var i = 0; i < buyButtons.length; i++) {
>     buyButtons[i].setAttribute('data-ms-price:add', priceId);
>     }
>   }
> 
>   // Wait for the Webflow API to load
>   Webflow.ready(function() {
> 
>   // Define the price ID from the item
>   var priceid = "[PRICED >>>> This is the "Add Field" from Webflow in the page settings]";
> 
>   // Set the 'data-ms-price:add' attribute on buttons
>   setButtonPrice(priceid);
>   });
> </script>

Unfortunately the response to that is “Price doesn’t exist”. Checking the browser console, I see that the PRICEID is set for var priceid. The error messages are:

error
error692×202 12.6 KB

Any idea what might be the issue?

2

This looks like the Memberstack script not getting loaded. So I’d venture to guess you need to double check your setup.

That aside…

Checkout the newly released feature from Webflow. That may solve (or maybe help?) to remove that custom code.

1 Like
3

This just made my day! This new feature release was 100% what I needed!!!