Hackaday.comのようなコメントシステムを作成する方法
2020年1月24日
作成者: Devon Winrick
おお、何が起こったの?
この投稿は、FastCommentsを使用してhttps://hackaday.comに似たコメントシステムを作成するデモです。
コピーすることはお勧めしませんが、これはFastCommentsの柔軟性を示しています。
FastCommentsをこのように見せるのは簡単です! 私たちはそれ用のUIを構築しました!例えば、FastCommentsがこのページに一致するように構成した設定は次の通りです:
コード内で行う場合も同様に簡単です。
いくつかのオプションを設定するだけです。実際には7つです。ここにコードスニペットがあります(カスタムCSSは省略)。この方法で挿入できるCSSは限られています。CSSを定義するためには上記のUIを使うことをお勧めします。また、UIはCSSを圧縮してくれますが、customCSSプロパティを定義すると最適化は適用されません。
これらのそれぞれは何を意味するのでしょうか?
- commentCountFormat = コメントスレッド上のタイトルの形式。 "[count]"は実際のローカライズされたカウントに置き換えられます。
- commentCountUpdated = コメントカウントが変更されたときに呼び出される関数。これを使用してページの上部にコメント数を設定します。
- headerHTML = "返信を残す"ボックスの上に表示されるHTML。この場合、見出し要素を挿入するために使用します。
- hideAvatars = Hackadayにはアバターがないため、これをtrueに設定して非表示にします。
- inputAfterComments = 返信ボックスをコメントフィードの下部に再配置します。
- absoluteDates = デフォルトの日付形式(例:"11分前")を絶対日付に変更します。
- customCSS = カスタムスタイリング
すべての設定オプションはこちらに文書化されています。
