diff --git a/app/javascript/template_builder/i18n.js b/app/javascript/template_builder/i18n.js
index 83807881..1fcbebc1 100644
--- a/app/javascript/template_builder/i18n.js
+++ b/app/javascript/template_builder/i18n.js
@@ -1,4 +1,5 @@
 const en = {
+  quantity: 'Quantity',
   prefillable: 'Prefillable',
   signature_id: 'Signature ID',
   error_message: 'Error message',
@@ -176,6 +177,7 @@ const en = {
 }
 
 const es = {
+  quantity: 'Cantidad',
   prefillable: 'Rellenable',
   signature_id: 'ID de Firma',
   error_message: 'Mensaje de error',
@@ -353,6 +355,7 @@ const es = {
 }
 
 const it = {
+  quantity: 'Quantità',
   prefillable: 'Precompilabile',
   signature_id: 'ID firma',
   error_message: 'Messaggio di errore',
@@ -530,6 +533,7 @@ const it = {
 }
 
 const pt = {
+  quantity: 'Quantidade',
   prefillable: 'Pré-preenchível',
   signature_id: 'ID da Assinatura',
   error_message: 'Mensagem de erro',
@@ -707,6 +711,7 @@ const pt = {
 }
 
 const fr = {
+  quantity: 'Quantité',
   prefillable: 'Pré-remplissable',
   signature_id: 'ID de signature',
   error_message: 'Message d\'erreur',
@@ -884,6 +889,7 @@ const fr = {
 }
 
 const de = {
+  quantity: 'Menge',
   prefillable: 'Vorausfüllbar',
   signature_id: 'Signatur-ID',
   error_message: 'Fehlermeldung',
diff --git a/app/javascript/template_builder/payment_settings.vue b/app/javascript/template_builder/payment_settings.vue
index d54ea09f..7bbb10e3 100644
--- a/app/javascript/template_builder/payment_settings.vue
+++ b/app/javascript/template_builder/payment_settings.vue
@@ -52,17 +52,17 @@
         @click.stop
       >
         <input
-          v-if="field.preferences.formula"
-          type="number"
-          :placeholder="t('price')"
-          disabled="true"
+          v-if="'price_id' in field.preferences"
+          v-model="field.preferences.price_id"
+          placeholder="Price ID: price_XXXXX"
           class="input input-bordered input-xs w-full max-w-xs h-7 !outline-0"
           @blur="save"
         >
         <input
-          v-else-if="'price_id' in field.preferences"
-          v-model="field.preferences.price_id"
-          placeholder="Price ID: price_XXXXX"
+          v-else-if="field.preferences.formula"
+          type="number"
+          :placeholder="t('price')"
+          disabled="true"
           class="input input-bordered input-xs w-full max-w-xs h-7 !outline-0"
           @blur="save"
         >
@@ -75,7 +75,7 @@
           @blur="save"
         >
         <label
-          v-if="field.preferences.price && !field.preferences.formula"
+          v-if="(field.preferences.price || field.preferences.price_id) && (!field.preferences.formula || ('price_id' in field.preferences))"
           :style="{ backgroundColor: backgroundColor }"
           class="absolute -top-1 left-2.5 px-1 h-4"
           style="font-size: 8px"
@@ -184,7 +184,6 @@
         >{{ t('learn_more') }}</a>
       </div>
       <li
-        v-if="!('price_id' in field.preferences)"
         class="mb-1"
       >
         <label
@@ -195,7 +194,7 @@
             width="18"
           />
           <span class="text-sm">
-            {{ t('formula') }}
+            {{ 'price_id' in field.preferences ? t('quantity') : t('formula') }}
           </span>
         </label>
       </li>