Example Description
In this example we created a custom comments section that does not require prior registration.
How We Built It
Collections
In addition to the database collections automatically added to your site if you have a blog, we added a collection for storing custom comments:
Post Comments Data collection: Contains information about your custom comments
Note: To simplify this example we set the collection permissions for adding and removing items to “anyone”, but best practice is to restrict permissions on the collection and use backend code with suppressAuth to read and write data to your collection.
Page Elements
In our site we added the following page elements:
Leave a Comment strip: Contains a customized form for adding comments:
2 text boxes: for user’s name and comment
Submission button
Hidden success message
Comment List repeater with the following items:
User name text
User comment text
Comment date
Code
When the page is ready, use the blog getPost() function to get the current post’s data and save it in a global variable.
Query the the Post Comments Data collection for post comments relating to the current post.
Assign the queried comments as the commentsList repeater data, triggering the onItemReady() function.
Bind the comment items to their relevant repeating items.
Add an onClick event handler to the submission button that generates a new comment and adds it to the collection. Each comment item contains:
The current post ID
User’s name from the input
User’s comment from the input
Insert this item into the collection and then do the following:
Show the success message
Reload the post comments including the new one
Clear the comment inputs
Related Examples
Did this help?
|
Thanks for your feedback!
Custom Like Button
Create your own custom like button.
Intermediate
Custom Post Page
Create your own customised blog post page.
Intermediate
Related Posts
Display related posts in your blog post page
Beginner