Placeholder Forms

テーマコンポーネント
,
46

こんにちは :wave:

このコンポーネントありがとうございます :heart: まさに今達成しようとしていることにぴったりです。実際、最初に考えたのは、返信テンプレートコンポーネントと組み合わせることができれば素晴らしいだろうということでした。しかし、残念ながら、上記の投稿で説明されているように、それは不可能です。 :confused:

テンプレートとして使用するための回避策を見つけました。これは、新しいトピックへのリンクおよび新しい個人メッセージへのリンクと連携します。

以下にその方法を示します。

  1. プレースホルダーフォームを作成します（簡単にするために、OPの例を使用します）。

    Your email: =NAME=-=COUNTRY=@example.com

  1. 新しいトピックへのリンクを作成します。
    リンクで設定したのは次のとおりです。

    1. カテゴリ
    2. タイトル
    3. 本文

    空行を追加したい場合は、リンクが壊れないように \ を使用するか、表示されないようにするには   を使用して新しい行にスペースを追加します。これはテンプレートの一部となり、空行を作成します。

    <a href="https://meta.discourse.org/new-topic?category==CATEGORY=&title=This is a topic created by =NAME=&body=Hello :wave:
&nbsp;
This is a test topic... Let's see the placeholder form.
\
Your email: =NAME=-=COUNTRY=@example.com">Use template as new topic</a>

  1. トピックプレビューを作成します。

    Selected category

    =CATEGORY=

    Topic title

    This is a topic created by =NAME=

    Topic body

    Hello :wave:

    This is a test topic… Let’s see the placeholder form.

    Your email: =NAME=-=COUNTRY=@example.com

  1. 「Use template as new topic」ボタンを作成します（上記の例では、これはリンクですが、ボタンにすることもできます）。

    このテキストから [wrap] 要素を作成します。これにより、CSSでターゲットにしてスタイルを設定できるようになります。以下に追加します。

    <a href="https://meta.discourse.org/new-topic?category==CATEGORY=&title=This is a topic created by =NAME=&body=Hello :wave:
&nbsp;
This is a test topic... Let's see the placeholder form.
\
Your email: =NAME=-=COUNTRY=@example.com">[wrap=template-button]Use template as new topic[/wrap]</a>

    [wrap=template-button] のスタイリング
    次のようなものです :arrow_down_small:

    Common / CSS

    [data-wrap="template-button"] {
  background: var(--tertiary);
  color: var(--secondary);
  border-radius: var(--d-button-border-radius);
  padding: 0.5em 0.65em;
  transition: background 0.25s;
  &:focus,
  &:hover {
    background: var(--tertiary-hover);
    color: var(--secondary);
  }
}

    テンプレートボタンは次のようになります :arrow_down_small:

    template-button

デモ

Use template as new topic

この小さなチュートリアルが、同様のものを必要としている誰かの役に立つことを願っています :slightly_smiling_face:

編集：カテゴリ選択機能を追加し、さまざまなカテゴリでトピックを作成できるようにしました。

この投稿の生のバージョンを確認する…

「いいね！」 8