How to implement upvote filtering for logged-in users in Webflow and MS while requiring authentication for voting? Answered

• 

  Memberstack Team

  • November 23, 2025 22:44
  • Official comment

  You can actually handle this with MemberScript #190 – Cross-plan Member Upvote/Downvoting. It’s built to let members across different subscription tiers upvote/downvote each other’s profiles, and it already includes logic to check whether a user is logged in before recording a vote.

  Here’s how it works in your case:

  • If a logged-in member clicks the upvote/downvote button, the vote is saved as expected.

  • If a visitor who isn’t signed in clicks, the script can trigger Memberstack’s signup/login modal instead of recording the vote. That way you’re prompting them to create an account before they can interact.

  This script is a good fit if your “like/upvote” buttons are tied to member profiles or directories. If you’re trying to add likes to general content (like blog posts or images), Script #190 might be overkill — in that case, a simpler “like button” script would be better, but the same login-check logic applies.

• 

  Julian Galluzzo

  • May 25, 2023 13:00

  Here's an easy solution - have 2 elements:

  1. The real like/upvote buttons
  2. A duplicated version

  Remove the action from the duplicated version, and add a sign up modal/redirect.

  Then, use the members/!members attributes to hide and show each of these elements to the correct people!

  P.S: This was a condensed version, but if it's confusing I'd be happy to make a more detailed loom for you!

  Good luck! 😃

  0
• 

  Dave Rajan

  • May 25, 2023 13:00

  ^ Superb, was looking for same!

  0
• 

  Dean Fankhauser

  • May 25, 2023 13:00

  Absolutely perfect. Thanks so much for your help.

  0
• 

  Julian Galluzzo

  • May 25, 2023 13:00

  No problem!! Let me know if anything else comes up 😃

  0
• 

  Inkyung Ko

  • November 16, 2024 10:14

  Hello all! I'm implementing upvote button on my webflow page using this awesome memberscript and make scenario #62-upvote button (thanks a ton!)

  But I wonder if I can show only upvoted items for logged-in users on a different page. Or maybe applying filters for upvoted items. If anyone has tips or know-hows to do this, I'd really appreciate your help!

  0
• 

  A J

  • November 16, 2024 10:17

  Hey Inkyung Ko, do you mean to say that a logged-in user should be able to see only the items that particular user has upvoted (in a different page / via filter)?

  If yes, the easiest approach would be to take inspiration from this memberscript. This memberscript allows you to show all items / saved items / unsaved items etc. just by adding attributes. But this is a liking / saving feature which is restricted to only that user, so other users won't be able to see how many people have favorited this item.

  In your case, you can have the logic of the upvote feature, but you can explore how you can combine the saved items feature that #106 memberscript provides in your use-case. Hope this gives you a rough idea about the approach.

  Hey Inkyung Ko, was just exploring if we can show upvoted items alone on a different page. And came up with this workaround, on the new page which I cloned from the existing upvotes page (as shown in tutorial), I have created a class 'hide' for the listing-wrap div in the upvotes section and I have set the display to 'none' by default via Style editor (shown in screenshot as well).

  Then I just added this code in the Before </body> tag section of the new page and that's it save and published.

  <script> 
  document.addEventListener('DOMContentLoaded', function() { 
  const memberstack = window.$memberstackDom; 
  const upvoteButtons = document.querySelectorAll('[ms-code="upvote-button"]'); 
  
  // Check if member has upvotes on page load 
  memberstack.getMemberJSON() 
  .then(function(memberData) { 
  if (memberData.data && memberData.data.upvotes) { 
  const upvotes = memberData.data.upvotes; 
  upvoteButtons.forEach(function(button) { 
  const cmsId = button.getAttribute('data-cms-id'); 
  const listingWrap = button.closest('.listing-wrap'); 
  if (upvotes.includes(cmsId)) { 
  listingWrap.classList.remove("hide");
  } 
  }); 
  } 
  }) 
  .catch(function(error) { 
  console.error('Error retrieving member data:', error); 
  }); 
  }); 
  </script>

  A quick showcase of the result for reference.

  Feel free to take the approach that you prefer better for your use-case. Hope this helps.

  

  0
• 

  Inkyung Ko

  • November 16, 2024 10:22

  A J oh wow this is exactly what i was looking for. thanks a ton!!

  0

Please sign in to leave a comment.