説明例
In this example we created a custom comments section that does not require prior registration.
どのように構築したか
コレクション
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.
ページ要素
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
コード
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
関連例
これは役に立ったか?
|
ご意見ありがとう!
カスタムいいねボタン
自分だけの「いいね!」ボタンを作ろう。
中級
Custom Post Page
Create your own customised blog post page.
中級
関連記事
Display related posts in your blog post page
初心者