En el sitio web en el que estoy trabajando, necesito que haya un <textarea> donde el usuario pueda escribir una descripción y agregar variables definidas por el usuario como se muestra a continuación: 
Cuando se hace clic en uno de los botones, se agrega el texto correspondiente al <textarea> anterior. Luego, en el JS, uso el método replaceAll() para sustituir las variables agregadas con sus valores correspondientes.
Esto funciona y todo, pero me gustaría hacer algo como esto: 
Así que todavía quiero que el bloque de texto funcione igual que antes, pero sería como un carácter, donde si presionas la tecla de retroceso, se borraría todo el bloque. ¿Hay alguna manera de hacer esto (usando Vanilla JS)?
¡Gracias por adelantado!
No puede representar HTML en un área de texto. Lo que necesitará es un DIV de contenido editable: aquí hay algunos HTML y CSS aproximados.
<div contenteditable="true" > Hi, My Name Is BusinessName </div>