You can create a form directly in Webflow to allow members to submit products to your site. This tutorial shows you all the steps you need to follow to get the form set up and link it to your Webflow CMS.

Below are a few pieces of script that you can choose to use if you are planning on adding in automations later. If that's a bit advanced, feel free to omit the code and build as you would a normal form.

The product form should include the following fields:

Product Name

Attachments — an attachment field

Company Logo — an attachment field

Tags —‍Traditional drop down — these should match the tag collection list.  Be sure the text and value both match the tag.

Advanced — remove all the options, be sure to give it an ID of Tags and place the below script in the before </body> tag section of your member only home settings<script>$('.platform-item').each(function(){platformname = $(this).children('.platform-name').text();platformid = $(this).children('.platform-id').text();$('#platforms').append('<option value="'+platformid+'">'+platformname+'</option>');});</script>Product Website URL — a text field

Product description — a text area

Submit button — style accordingly and alter success message by following these steps;

1. Adjust and style text to read 'Submitting your product, please wait...' or similar.
2. Add in a Lottie file of three dots or a spinner to indicate the page is reloading; be sure to set it to loop.
3. Add the below success message script to before </body> tag section of your member only home settings:‍

<script>var Webflow = Webflow || [];Webflow.push(function() {$(document).on('submit', 'form', function() {setTimeout(function() { location.reload(true); }, 3000);});});</script>

Return to normal form state and be sure to hit publish.

Finish styling the rest of the product display section by adding a link to the product template page,  adding in a link for comments and formatting text to your preferences.

Thank you to Ben Parker and Nelson for their wonderful tutorials and scripts used in these steps! Including;

Success message refresh script — credit to Ben Parker for this script, taken from this webflow blog.

Append to drop down script code — credit to Nelson, The Pixel Geek, for this. Script adapted from this YouTube tutorial.

‍