AI Bot - 新しい質問モーダル

:information_source: 概要 AI Bot - 新規質問モーダル
:hammer_and_wrench: リポジトリ GitHub - VaperinaDEV/aibot-new-question-modal
:question: インストールガイド テーマまたはテーマコンポーネントのインストール方法
:open_book: Discourseテーマ初心者の方へ Discourseテーマ使用の初心者ガイド

<!- 自動インストールボタンの「repoName」と「repoURL」を入力してください →

このテーマコンポーネントをインストール

こんにちは :wave:

Discourse AI - AI Bot が必要です。

このテーマコンポーネントは、ask.discourse.com のホームページ機能をモーダル化したものです。これにより、受信者の AI Bot と新しい会話を作成できます。

このモーダルはフルスクリーンなので、別のページにいるような印象を与えます。あるいは、そのような印象を与えることが目標でした。

主な部分:

アバター: aibot のアバターには常に回転しているスピナーがあり、書き込み中も示します。

aibot-spinner


AIメッセージ: ここでも HTML を使用できます。
Screenshot 2024-10-20 at 16.27.18


クイックリンク: 質問はいくつでも追加できます。
クイックリンクの表示は設定で制限されており、モーダルを開くたびにシャッフルされます。

max quick links desktop デフォルト: 5
max quick links mobile デフォルト: 3


最近の会話: このボタンは、in:messages, @aibot-username パラメータを持つ /search ページにリダイレクトします。
Screenshot 2024-10-20 at 16.33.38


モーダルについては以上です。テーマ設定ですべてを変更、カスタマイズできます。 :slight_smile:

AI Bot モーダルを開くボタンは、サイドバーの 3 つの場所に配置できます。

  1. sidebar-footer-actions

  2. before-sidebar-sections

  3. after-sidebar-sections

テーマ設定でボタンのスタイルを変更できます。


テーマ設定を見てみましょう

テーマ設定
  • quick_links: ここでクイックボタンの質問を設定できます。
  • max quick links desktop: デスクトップに表示されるクイックリンクの最大数
  • max quick links mobile: モバイルに表示されるクイックリンクの最大数
  • show_for_groups: 必須設定。サイドバーボタンを表示するグループ名を追加します。
  • aibot_id: 必須設定。これに使用する AI Bot ID を追加します。
  • aibot_username: 必須設定。これに使用する AI Bot ユーザー名を追加します。
  • aibot_avatar: 必須設定。モーダルに表示される AI Bot の画像をアップロードします。
  • sibebar aibot button postition: サイドバーボタンの位置を選択します。
    • sidebar-footer-actions (デフォルト)
    • before-sidebar-sections (サイドバーの上部)
    • after-sidebar-sections (サイドバーの下部)
  • sibebar aibot button style: サイドバーボタンのスタイルを選択します。
    • btn-primary (デフォルト)
    • btn-default
  • sidebar aibot button border-radius: サイドバーボタンの角丸を変更します。
  • sidebar aibot button before icon: サイドバーボタンのアイコンを変更します。
  • aibot recent messages icon: 最近の会話ボタンのアイコンを変更します。
  • modal background: モーダルの背景を変更します。
  • modal content wrapper background: モーダルのコンテンツラッパーの背景を変更します。
  • modal content wrapper border radius: モーダルのコンテンツラッパーの角丸を変更します。
  • quick buttons style: クイックボタンのスタイルを選択します。
    • btn-primary (デフォルト)
    • btn-default
  • quick buttons border radius: クイックボタンの角丸を変更します。
  • mobile quick buttons wrapper border radius: モバイルクイックボタンラッパーの角丸を変更します。
  • aibot avatar spinner primary color: アバター スピナーのプライマリ カラーを変更します。デフォルトは var(--tertiary) です。
  • aibot avatar spinner secondary color: アバター スピナーのセカンダリ カラーを変更します。デフォルトは #ffffff です。
  • aibot message border color: これはメッセージの右側にある境界線です。デフォルトは var(--tertiary) です。
  • textarea border-radius: テキストエリアの角丸を変更します。
  • send button border radius: 送信ボタンの角丸を変更します。
  • recent messages button border radius: 最近の会話ボタンの角丸を変更します。
  • recent messages button color: 最近の会話ボタンの色を変更します。アイコンの色も変更されます。
  • recent messages button hover color: 最近の会話ボタンのホバー時の色を変更します。
  • recent messages button hover background: 最近の会話ボタンのホバー時の背景を変更します。
  • recent messages button border: 最近の会話ボタンの境界線を変更します。
  • spinner loader border: モーダルのスピナーローダーの境界線を変更します。メッセージを送信すると表示されます。
  • spinner loader border right color: スピナーローダーの右側の色を変更します。

テーマ翻訳もあります…

テーマ翻訳
  • aibot_modal_title: モーダルのタイトルです。
  • aibot_message: モーダル内の AI Bot のメッセージです。
  • input_placeholder: テキストエリアのプレースホルダーです。
  • input_submit: 送信ボタンのタイトルです。
  • input_length: テキストが短すぎる場合に表示されるメッセージです。
  • disclaimer: モーダルのテキストエリアの下に表示されるテキストです。
  • new_question: サイドバーボタンのテキストです。
  • recent_messages: モーダルの最近の会話ボタンのテキストです。

このテーマコンポーネントは、AI Bot の個人メッセージから共有ボタンを非表示にします。 discourse_ai.ai_bot.default_pm_prefix テキストはデフォルトの AI PM タイトルであり、会話の件名に応じて自動的に変更されます。 /admin/customize/site_texts で変更できます。


クレジット: Discourse Ask Theme

「いいね!」 14