Moduli di esempio

[Discourse]

	Summary	Placeholder Forms will let you build dynamic documentation, by creating a form that replaces any occurrence of a =PATTERN= in your post with the value from a text or selectable input field.
	Preview	Preview on Discourse Theme Creator
	Repository Link	https://github.com/discourse/discourse-placeholder-theme-component
	New to Discourse Themes?	Beginner’s guide to using Discourse Themes

Install this theme component

As this is an official theme component maintained by the Discourse team, support, bug, ux, and feature requests can be made in the respective categories here on Meta, and tagged with the appropriate theme component tag. Click on a link below to get one started.

 Support  Bug  UX  Feature

Features

Add placeholders to posts in this format:

[wrap=placeholder key=NAME description="Your name"][/wrap]
[wrap=placeholder key=COUNTRY default=US defaults=FR,DE,US,CN,AU,CA][/wrap]

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

And this will result in:

This is used in mailing list

Your email: =ZNAME=-=ZCOUNTRY=@example.com

As seen above, text inside the wrapper will be used as a long description.

[wrap=placeholder key=NAME description="Your name"]
This is used in mailing list
[/wrap]

Available keys

• key: The key that should be replaced in your post
• default/defaults: default value(s)
• description: a placeholder text for the input

Examples

# create a new plugin
rails g plugin =PLUGIN_NAME=
cd plugins/=PLUGIN_NAME=

Set up file and image uploads to S3

So, you want to use S3 to handle image uploads? Here’s the definitive guide, but also see Configure an S3 compatible object storage provider for uploads to see how to configure your app.yml. S3 registration Head over to https://aws.amazon.com/free/ and click on [Create a Free Account] During the create account process, make sure you provide payment information, otherwise you won’t be able to use S3. There’s no registration fee, you will only be charged for what you use, if you exceed the AWS F…

---

We use it to create runbooks, howtos and reusable templates (it will work in code blocks). Please share your use cases!

Settings

Translation	Default
toolbar.builder	Add Placeholder
builder.errors.no_key	A key is required.
builder.title	Add Placeholder
builder.insert	Insert
builder.key.label	Key
builder.key.description	The =Key= to be replaced in the post.
builder.description.label	Description
builder.description.description	Description displayed on input with no value set.
builder.values.label	Default value(s)
builder.values.description	Optional value(s) for your placeholder, if multiple values are defined, a select will be used.

Hosted by us? Theme components are available to use on our Standard, Business, and Enterprise plans.

Last edited by @JammyDodger 2024-06-13T22:28:45Z

Check document

Perform check on document:

[j.jaffeux (Joffrey Jaffeux)]

The big issue with math handling like this, is that you need to eval() and eval is unsafe, so you need to use some lib which provide a safe eval with a limited subset of the real eval. I’m unsure we want all this complexity for such a rare case.

[Benjamin_D (Benjamin Decotte)]

@joffreyjaffeux

Try combining this with the Reply Template theme component!

I tried ! and that would be a neat composer-preview-redux-in-OP kind of thing but… I must be missing something, if I understand correctly the Reply Template component takes the raw and looks for “replacers”, but the Placeholder Forms component decorates the cooked?

What I’m trying to do is ease my users into adding some quizz Q&As in a topic, with minimal technical friction, clicks or even key strokes, :heavy-sigh:

[wrap=placeholder key="question" description="question"][/wrap]
[wrap=placeholder key="réponse" description="réponse"][/wrap]

[wrap=template key="template-spoiler" action="reply" tagsList="#qui, #quand, #où, #comment"]

## Question
=question=
### Réponse
[spoiler]
=réponse=
[/spoiler]
---
*Étiquette(s) ?*
[/wrap]

which gives

so far so good, but unfortunately, the placeholders =question= and =réponse= are kept in the composer when hitting the template button

[j.jaffeux (Joffrey Jaffeux)]

Yes I’m not sure what I was thinking when I wrote this… I probably had a different use case in mind, but can’t remember.

It can’t work this way for sure. I will think a little bit about this… Both theme components were experiments at the time and might deserve better treatment as people have been using it quite frequently.

[Benjamin_D (Benjamin Decotte)]

@j.jaffeux

I will think a little bit about this…

Thank you !

[Benjamin_D (Benjamin Decotte)]

I don’t know what’s cookin’ in the chef kitchen, but as I usually stuff myself with pistachios or whatnot while waiting, I managed to make it work (for my specific use of course as I’ve almost no idea of what I’m doing, but hey… )

Add 2 replacers

[j.jaffeux (Joffrey Jaffeux)]

Ideally I would like to be able to let admin define their own replacers, but eval is risky (and not even possible with a secure csp) so I’m not sure how I could achieve this…

[sewid (Sebastian)]

First of all - great and really helpful theme component.

But I think I found a bug. If I use a placeholder in a code snippet, that contains backticks (`), it is not working. An example is a SQL code snippet:

DELETE FROM `=TABLENAME=`
WHERE id NOT IN(
        SELECT
            id FROM (
                SELECT
                    id FROM `=TABLENAME=`
                ORDER BY
                    id DESC
                LIMIT 20
) subquery);

TABLENAME gets never replaced (if there is a TABLENAME placeholder).

[AquaL1te]

Sarebbe bello se includesse anche delle condizioni simili a Jinja2. In modo che, ad esempio, qualcuno possa creare una chiave red e associarla all’icona , orange verrebbe associata a . Ma posso farne a meno ovviamente, sarebbe stato bello avere queste condizioni di test.

[maiki]

Adoro questo componente.

---

"E vivi davvero del =NOUN_1=? Che vita =ADJECTIVE_1=! "

“Ne vivo e con esso e su esso e in esso,” disse =PERSON_1=. “È mio fratello e mia sorella, e zie, e =NOUN_2=, e cibo e bevande, e (=ADJECTIVE_2=) =VERBING_1=. È il mio =NOUN_3=, e non ne voglio altro. Ciò che non ha non vale la pena =VERBING_2=, e ciò che non sa non vale la pena =VERBING_3=. Signore! i =NOUNS_1= che abbiamo passato insieme! Sia in inverno che in estate, in primavera o in autunno, ha sempre il suo =NOUN_4= e i suoi =NOUNS_2=. Quando a febbraio ci sono i =NOUNS_3=, e la mia =NOUN_4= e la cantina sono piene di =NOUN_5= che non mi servono, e il =COLOR_1= =NOUN_6= scorre vicino alla mia migliore finestra =NOUN_7=; o ancora quando tutto si abbassa =ADVERB_1= e mostra chiazze di =NOUN_8= che profumano di =FOOD_1=, e i =NOUNS_5= e i =NOUNS_6= intasano i canali, e posso =VERB_1= circa =MOISTURE= =NOUN_9= su gran parte del =NOUN_10= e trovare fresco =FOOD_2= da mangiare, e cose =ADJECTIVE_3= che la gente ha lasciato cadere dai =NOUNS_7=!”

---

Originale tratto dalla versione Standard Ebooks di The Wind in the Willows, disponibile per lettura online (cerca By it and with it).

[Don]

Ciao

Grazie per questo componente Corrisponde perfettamente a ciò che sto cercando di ottenere ora. In realtà, il mio primo pensiero è stato che sarebbe fantastico se potesse essere combinato con il componente Reply Template. Ma sfortunatamente non è possibile, come spiegato nei post precedenti.

---

Ho trovato una soluzione per usarlo come modello, funziona con link a nuovi argomenti e link a nuovi messaggi personali.

Ecco come l’ho fatto:

1. Crea un modulo segnaposto (per semplicità uso l’esempio nell’OP)

La tua email: =NAME=-=COUNTRY=@example.com

---

2. Crea un link a un nuovo argomento:
   Ho impostato nel link:
3. categoria
4. titolo
5. corpo

Se vuoi aggiungere righe vuote, usa \ in modo che non interrompa il link o per renderlo invisibile puoi usare   che aggiungerà uno spazio nella nuova riga. Sarà parte del modello e creerà una riga vuota,

<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">Usa il modello come nuovo argomento</a>

---

3. Crea un’anteprima dell’argomento

Categoria selezionata

=CATEGORY=

Titolo dell’argomento

This is a topic created by =NAME=

Corpo dell’argomento

Hello

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

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

---

4. Crea il pulsante “Usa il modello come nuovo argomento” (nell’esempio sopra questo è un link, puoi trasformarlo in un pulsante)

Crea un elemento [wrap] da questo testo. Questo lo rende disponibile per essere indirizzato con CSS e stilizzato. Lo aggiungo qui sotto.

<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]Usa il modello come nuovo argomento[/wrap]</a>

Styling [wrap=template-button]
qualcosa come

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);
  }
}

Il pulsante del modello apparirà così

---

Demo

Usa il modello come nuovo argomento

---

Spero che questo piccolo tutorial aiuti qualcuno che ha bisogno di qualcosa di simile

Modifica: Ho impostato un selettore di categorie che aggiunge la possibilità di creare argomenti in diverse categorie.

---

Controlla la versione raw di questo post…

[Lilly (Lillian Louis)]

Fantastico Don, grazie. Questo soddisfa molto bene una delle mie esigenze

[jericson (Jon Ericson)]

Qualcosa da notare è che i blocchi di codice a volte causano problemi:

usermod -aG sudo =USERNAME=

In questo caso, highlight.js presume che si tratti di Java e converte il blocco di codice in:

<code>
  usermod -
  <span class="hljs-type">aG</span> 
  <span class="hljs-variable">sudo</span> 
  <span class="hljs-operator">=</span>
  USERNAME=
</code>

Riesco a risolvere segnalando che si tratta in realtà di un comando shell:

    ```shell
    usermod -aG sudo =USERNAME=
    ```

Ciò si traduce in:

usermod -aG sudo =USERNAME=

Se tutto il resto fallisce, text impedisce a highlight.js di interferire con i placeholder.

Una soluzione più generale (che Meta Discourse deve utilizzare) è cambiare l’impostazione default code lang da auto a plaintext o qualcosa di simile.

---

Non che importi molto, ma usare java è un modo per evitare che il placeholder si espanda quando si vuole scrivere sui placeholder.

[putty (Derek Putnam)]

Puoi controllare il link di anteprima? Mi sembra che sia rotto.

[NateDhaliwal]

Questa è una funzionalità straordinaria e posso vederne molti usi.
Tuttavia, nella nostra risposta, è possibile nascondere =(nome)= finché l’utente non inizia a digitare nella casella di testo? Ritengo che gli utenti (specialmente quelli nuovi) potrebbero non capirne lo scopo, o che sembri una formattazione errata.

[JammyDodger]

@putty

Puoi controllare il link di anteprima? Mi sembra che non funzioni.

Penso di averne trovato uno funzionante ( )

https://discourse.theme-creator.io/theme/Discourse/placeholder-forms

L’ho aggiunto anche a try.discourse.org così puoi giocarci più a fondo.

[pfaffman (Jay Pfaffman)]

Forse potresti inserire un valore predefinito che verrà visualizzato al suo posto.

[putty (Derek Putnam)]

Ha funzionato! Grazie!

[bangarang]

Questo workaround non sembra più funzionare.

Ci sono altre opzioni per combinare reply-template e placeholder-forms?