In order to show members the products and comments they are submitting, you need to set up a member template page. In this tutorial, learn how to set up your template with sections for product submission, any previous comments submitted, and any previous products submitted.
We need a way to show members the products and comments they are submitting. To do that we'll set up a quick and basic member template page with sections for a product submission form, any previous comments submitted, and any previous products submitted.
- Copy and paste the navbar from the member home page — be sure to add a Logout and a Profile to the navbar (these will be linked and connected to Memberstack later).
- Add a section, container and div.
- Add a div, give it a class and set to display flex, horizontal, align center, justify left, don't wrap.
- Add in a header that says "Welcome Back", then next to it add in a header and bind to CMS member name.
- Add in a grid set to two columns and two rows.
- Copy and paste the Submit form from the member home page in column 1. Be sure to include the success script before the </body> tag section of your products template page settings;
<script>var Webflow = Webflow || [];Webflow.push(function() {$(document).on('submit', 'form', function() {setTimeout(function() { location.reload(true); }, 3000);});});</script>
- Add a div block into column 2.
- Add a div block into column 2.
- Add in a header that says "Previous Comments".
- Add in a collection list and bind to Product Comments collection.
- Set filter so that Member ID equals Current Member.
- Change collection list to a grid with one column and auto rows.
- Add in three text blocks and bind to collection list for
- Product nameDateComment
- Add in a div block and put in column 1, row 2.
- Add in header that says "Submitted Comments".
- Add in a collection list and bind to your Submitted Products collection.
- Set filter so that Member ID equals Current Member.
- Add in paragraph and bind to Product Name.
- Add in additional fields as desired.