尤 川豪   ·  1月前
Exp. 1,209  ·  152 貼文  ·  114 留言

Devs.tw 新功能:巢狀回覆留言功能

網站上的留言、討論開始變多了

原本的整排留言,開始不夠使用,各留言需要支援自己的討論串,比較方便討論

所以新開發了巢狀回覆留言功能,但目前只支援 1 層的留言。目前應該很夠用!

順便分享開發概念:

資料庫結構 Database Schema

comments

  • id
  • post_id
  • comment_id
  • content
  • ...

留言資料表,多了 comment_id ,用以紀錄是在回覆哪一則留言。其餘欄位皆相同。

使用者介面設計 UI/UX

原本貼文下方的留言串是「上舊下新」、「留言文字框在最底部」,鼓勵用戶看完全部留言再參與討論。

這次的內層留言採取同樣思維,「上舊下新」,最底部有文字框,點擊之後可以留言。

同時也在「喜歡」按鈕的旁邊加上「回應」按鈕,當沒有內層留言的時候,可以省點文字框的空間。

此外,因為全站鼓勵討論、支援 Markdown 格式,所以留言不是那種扁平的單行留言系統,而是跟發表貼文一樣的文字框。

考量到空間需求,因此內層留言統一點擊後開啟 bootstrap modal 視窗使用。

  分享   共 120 次點閱
共有 6 則留言
尤 川豪   ·  1月前
Exp. 1,209  ·  152 貼文  ·  114 留言

留言範例,這是普通留言,支援各種 Markdown 格式。

 
尤 川豪   ·  1月前
Exp. 1,209  ·  152 貼文  ·  114 留言

這是給第一則普通留言的內層留言,同樣 支援 各種 Markdown 格式。

尤 川豪   ·  1月前
Exp. 1,209  ·  152 貼文  ·  114 留言

另一個內層留言的範例。

尤 川豪   ·  1月前
Exp. 1,209  ·  152 貼文  ·  114 留言

這是另一則普通留言。

 
尤 川豪   ·  1月前
Exp. 1,209  ·  152 貼文  ·  114 留言

內層留言功能,讓各留言能夠自成一個討論串,方便大家交流、討論。

尤 川豪   ·  1月前
Exp. 1,209  ·  152 貼文  ·  114 留言

另外附上之前的討論貼文:

https://devs.tw/post/13

https://devs.tw/post/16

 
您的留言
尤 川豪
Exp. 1,209  ·  152 貼文  ·  114 留言

關於作者

Devs.tw 作者,喜歡分享&建造新東西的工程師。

技術部落格:轉個彎日誌

歡迎在 Facebook 追蹤我!

不定期分享有趣技術文章!