 |
概要 | AIボット会話ページへのドラッグ&ドロップアップロードとファイルプレビュー |
 |
リポジトリ | GitHub - VaperinaDEV/drag-drop-upload-file-previews-ai-bot-page: Drag & Drop Upload + File Previews for AI Bot Conversations page · GitHub |
 |
役に立ちましたか？ | > ./support --coffee |
 |
インストールガイド | テーマまたはテーマコンポーネントのインストール方法 |
 |
Discourseテーマ初心者ですか？ | Discourseテーマの使用に関する入門ガイド |
このテーマコンポーネントをインストール
こんにちは 
AIボット会話ページの入力欄にファイルをアップロードする場合、現在はアップロードボタン経由でのみ機能し、ファイルが添付されるとプレーンテキストの行にファイル名が表示されるだけで、プレビューも視覚的な表示もありません。実際に何を添付したかを示すインジケーターもありません。
このコンポーネントが追加する機能
- 会話パネル内のどこでもドラッグ&ドロップ可能 — テキストエリアだけでなく、パネル全体がドロップゾーンとして機能し、ドラッグ中はハイライト状態になります。
- 画像アップロード用の実際のサムネイル — クライアントサイドで生成され、テキストだけでなくファイル名とともに表示されます。
- 非画像ファイル用のカラーコード付き拡張子バッジ — (PDF、DOCX、XLSX、ZIP、MP3、コードファイルなど) 実際のプレビューが不可能なファイルタイプでも、アップロードリストが視覚的に把握しやすくなります。
- テーマ設定でカスタマイズ可能 —
default_badge_colorフォールバックカラーと、extension_colorsオブジェクトスキーマ設定により、管理者はテーマ設定UIから直接拡張子ごとにカラーを追加/上書きでき、コードの編集は不要です。
設定
| 設定項目 | 説明 |
|---|---|
default_badge_color |
明示的なカラーが設定されていない拡張子のためのフォールバックカラー（16進数） |
extension_colors |
組み込みのカテゴリカラーを上書き/拡張するための { extension, color } 行のオブジェクトスキーマリスト |
組み込みのカテゴリは、ドキュメント、スプレッドシート、プレゼンテーション、アーカイブ、オーディオ、ビデオ、コード、フォント、電子書籍など、ほとんどの一般的なファイルタイプを最初からカバーしているため、ほとんどのユーザーは extension_colors を変更する必要はありません。