Formularios de marcador de posición

[Discourse]

	Resumen	Placeholder Forms te permitirá crear documentación dinámica, generando un formulario que reemplaza cualquier ocurrencia de un =PATRÓN= en tu publicación con el valor de un campo de entrada de texto o selección.
	Vista previa	Vista previa en Discourse Theme Creator
	Enlace al repositorio	https://github.com/discourse/discourse-placeholder-theme-component
	¿Nuevo en los temas de Discourse?	Guía para principiantes sobre el uso de temas de Discourse

Instala este componente de tema

Dado que este es un componente de tema #oficial mantenido por el equipo de Discourse, las solicitudes de #soporte, #contribuir:errores, #contribuir:ux y #contribuir:funciones pueden realizarse en las categorías correspondientes aquí en Meta, y etiquetadas con la etiqueta adecuada del componente de tema. Haz clic en un enlace a continuación para comenzar.

 Soporte  Error  UX  Función

Características

Agrega marcadores de posición a las publicaciones en este formato:

[wrap=placeholder key=NOMBRE description="Tu nombre"][/wrap]
[wrap=placeholder key=PAIS default=US defaults=FR,DE,US,CN,AU,CA][/wrap]

Tu correo electrónico: =NOMBRE=-=PAIS=@example.com

Y esto dará como resultado:

Esto se utiliza en listas de correo

Tu correo electrónico: =ZNAME=-=ZCOUNTRY=@example.com

Como se ve arriba, el texto dentro del contenedor se utilizará como una descripción larga.

[wrap=placeholder key=NOMBRE description="Tu nombre"]
Esto se utiliza en listas de correo
[/wrap]

Claves disponibles

• key: La clave que debe ser reemplazada en tu publicación
• default/defaults: valor(es) predeterminado(s)
• description: un texto de marcador de posición para la entrada

Ejemplos

# crear un nuevo plugin
rails g plugin =PLUGIN_NAME=
cd plugins/=PLUGIN_NAME=

Configurar cargas de archivos e imágenes a 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 …

---

Lo utilizamos para crear libros de ejecución, tutoriales y plantillas reutilizables (funcionará en bloques de código). ¡Comparte tus casos de uso!

Configuración

Traducción	Predeterminado
toolbar.builder	Agregar marcador de posición
builder.errors.no_key	Se requiere una clave.
builder.title	Agregar marcador de posición
builder.insert	Insertar
builder.key.label	Clave
builder.key.description	La =Clave= que se reemplazará en la publicación.
builder.description.label	Descripción
builder.description.description	Descripción mostrada en la entrada sin valor establecido.
builder.values.label	Valor(es) predeterminado(s)
builder.values.description	Valor(es) opcional(es) para tu marcador de posición, si se definen múltiples valores, se utilizará una lista desplegable.

¿Alojado por nosotros? Los componentes de tema están disponibles para usar en nuestros planes Standard, Business y Enterprise.

[j.jaffeux (Joffrey Jaffeux)]

El gran problema con el manejo de matemáticas de este tipo es que necesitas usar eval(), y eval es inseguro, por lo que debes utilizar alguna librería que proporcione una eval segura con un subconjunto limitado de la eval real. No estoy seguro de que queramos toda esta complejidad para un caso tan poco frecuente.

[Benjamin_D (Benjamin Decotte)]

@joffreyjaffeux

¡Prueba combinar esto con el componente de tema Plantilla de Respuesta!

Probé con ! y sería algo genial tipo vista previa del compositor con Redux en la publicación original, pero… Debe faltar algo. Si entiendo bien, el componente Plantilla de Respuesta toma el texto sin formato y busca “reemplazadores”, pero ¿el componente Formularios de Marcadores de posición no decora el texto cocinado?

Lo que intento es facilitar a mis usuarios que agreguen algunas preguntas y respuestas de cuestionario en un tema, con la mínima fricción técnica, clics o incluso pulsaciones de teclas, :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]
---
*¿Etiqueta(s)?*
[/wrap]

Esto produce:

Hasta ahora todo bien, pero desafortunadamente, los marcadores de posición =question= y =réponse= se mantienen en el compositor al pulsar el botón de la plantilla.

[j.jaffeux (Joffrey Jaffeux)]

Sí, no estoy seguro de qué estaba pensando cuando escribí esto… probablemente tenía en mente un caso de uso diferente, pero no lo recuerdo.

Definitivamente no puede funcionar de esta manera. Lo pensaré un poco… Ambos componentes del tema eran experimentos en ese momento y podrían merecer un mejor tratamiento, ya que la gente los ha estado utilizando con bastante frecuencia.

[Benjamin_D (Benjamin Decotte)]

@j.jaffeux

Lo pensaré un poco…

¡Gracias!

[Benjamin_D (Benjamin Decotte)]

No sé qué se cuece en la cocina del chef, pero como suelo llenarme de pistachos o lo que sea mientras espero, logré que funcionara (para mi caso específico, por supuesto, ya que apenas tengo idea de lo que hago, pero bueno… )

Add 2 replacers

[j.jaffeux (Joffrey Jaffeux)]

Idealmente, me gustaría poder permitir que los administradores definan sus propios reemplazadores, pero eval es riesgoso (y ni siquiera es posible con un CSP seguro), así que no estoy seguro de cómo podría lograr esto…

[sewid (Sebastian)]

En primer lugar: un componente de tema excelente y realmente útil.

Sin embargo, creo que he encontrado un error. Si uso un marcador de posición en un fragmento de código que contiene comillas invertidas (`), no funciona. Un ejemplo es un fragmento de código SQL:

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

TABLENAME nunca se reemplaza (si existe un marcador de posición TABLENAME).

[AquaL1te]

Sería genial si esto también incluyera algunas condiciones tipo Jinja2. Para que, por ejemplo, alguien pudiera crear una clave red y mapearla al icono , orange se mapearía a . Pero puedo hacerlo sin eso, por supuesto, pero habría sido genial tener estas condiciones de prueba.

[maiki]

Me encanta este componente.

---

“¿Y vives realmente de la =NOUN_1=? ¡Qué vida tan =ADJECTIVE_1=!”

“De ella y con ella y de ella y en ella”, dijo =PERSON_1=. “Es mi hermano y mi hermana, y mis tías, y =NOUN_2=, y comida y bebida, y (=ADJECTIVE_2=) =VERBING_1=. Es mi =NOUN_3=, y no quiero otra. Lo que no tiene no vale la pena =VERBING_2=, y lo que no sabe no vale la pena =VERBING_3=. ¡Señor! ¡Las =NOUNS_1= que hemos tenido juntos! Ya sea en invierno o en verano, en primavera o en otoño, siempre tiene su =NOUN_4= y sus =NOUNS_2=. Cuando las =NOUNS_3= están en febrero, y mi =NOUNS_4= y el sótano están repletos de =NOUN_5= que no me sirven, y el =COLOR_1= =NOUN_6= corre junto a mi mejor ventana =NOUN_7=; o de nuevo cuando todo cae =ADVERB_1= y muestra parches de =NOUN_8= que huele a =FOOD_1=, y las =NOUNS_5= y =NOUNS_6= obstruyen los canales, y puedo =VERB_1= sobre =MOISTURE= =NOUN_9= sobre la mayor parte de la =NOUN_10= de ella y encontrar =FOOD_2= fresca para comer, ¡y cosas =ADJECTIVE_3= que la gente ha tirado de =NOUNS_7=!”

---

Original tomado de la versión de Standard Ebooks de The Wind in the Willows, disponible para leer en línea (busca By it and with it).

[Don]

Hola

Gracias por este componente Encaja perfectamente con lo que intento lograr ahora. De hecho, mi primer pensamiento fue que sería genial si se pudiera combinar con el componente Reply Template. Pero desafortunadamente no es posible, como explicaron las publicaciones anteriores.

---

He encontrado una solución para usarlo como plantilla, funciona con enlace a nuevos temas y enlace a nuevos mensajes personales.

Así es como lo hice:

1. Cree un formulario de marcador de posición (para simplificar, uso el ejemplo en OP)

Tu correo electrónico: =NAME=-=COUNTRY=@example.com

---

2. Cree un enlace a un nuevo tema:
   Configuré en el enlace:
3. categoría
4. título
5. cuerpo

Si desea agregar líneas vacías, use \ para que no rompa el enlace o para hacerlo invisible, puede usar   que agregará un espacio en la nueva línea. Será parte de la plantilla y creará una línea vacía,

<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>

---

3. Cree una vista previa del tema

Categoría seleccionada

=CATEGORY=

Título del tema

This is a topic created by =NAME=

Cuerpo del tema

Hello

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

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

---

4. Cree el botón “Usar plantilla como nuevo tema” (en el ejemplo anterior, este es un enlace, puede convertirlo en un botón)

Haga un elemento [wrap] con este texto. Esto lo hace disponible para apuntarlo con CSS y estilizarlo. Lo agrego a continuación.

<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>

Estilizando [wrap=template-button]
algo como

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

El botón de plantilla se verá así

---

Demo

Use template as new topic

---

Espero que este pequeño tutorial ayude a alguien que necesite algo similar

Editar: He configurado un selector de categorías que agrega la capacidad de crear temas en diferentes categorías.

---

Ver la versión sin formato de esta publicación…

[Lilly (Lillian)]

Eso es increíble Don, gracias. Esto en realidad se adapta muy bien a una de mis necesidades

[jericson (Jon Ericson)]

Algo a tener en cuenta es que los bloques de código a veces causan problemas:

usermod -aG sudo =USERNAME=

En este caso, highlight.js asume que esto es Java y convierte el bloque de código a:

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

Puedo arreglarlo indicando que en realidad es un comando de shell:

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

Eso da como resultado:

usermod -aG sudo =USERNAME=

Si todo lo demás falla, text evita que highlight.js interfiera con los marcadores de posición.

Una solución más general (que Meta Discourse debe estar usando) es cambiar la configuración default code lang de auto a plaintext o algo similar.

---

No es que importe mucho, pero usar java es una forma de evitar que el marcador de posición se expanda cuando quieres escribir sobre marcadores de posición.

[putty]

¿Puedes revisar el enlace de vista previa? Parece estar roto para mí.

[NateDhaliwal]

Esta es una característica increíble y puedo ver muchos usos para ella.
Sin embargo, en nuestra respuesta, ¿es posible ocultar el =(name)= hasta que el usuario comience a escribir en el cuadro de texto? Siento que los usuarios (especialmente los nuevos) pueden no comprender su propósito, o que parece un formato incorrecto.

[JammyDodger]

@putty

¿Puedes revisar el enlace de vista previa? Parece que no funciona para mí.

Creo que he conseguido que uno funcione de nuevo (:dedos_cruzados: :sonrisa_ligera:)

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

También lo he añadido a try.discourse.org para que puedas jugar más con él. :pulgar_hacia_arriba:

[pfaffman (Jay Pfaffman)]

Quizás podrías introducir un valor predeterminado que se muestre en su lugar.

[putty]

¡Eso funcionó! ¡Gracias!

[bangarang]

Esta solución alternativa ya no parece funcionar. ¿Existen otras opciones para combinar reply-template y placeholder-forms?