diff --git a/app/javascript/vue/protocol/modals/reorderable_items_modal.vue b/app/javascript/vue/protocol/modals/reorderable_items_modal.vue
index 99aa89014..ef4b9b85a 100644
--- a/app/javascript/vue/protocol/modals/reorderable_items_modal.vue
+++ b/app/javascript/vue/protocol/modals/reorderable_items_modal.vue
@@ -24,7 +24,7 @@
                 <strong v-if="includeNumbers" class="step-element-number">{{ index + 1 }}</strong>
                 <i v-if="item.attributes.icon" class="fas" :class="item.attributes.icon"></i>
                 <span :title="item.attributes.name" v-if="item.attributes.name">{{ item.attributes.name }}</span>
-                <span v-else class="step-element-name-placeholder">{{ item.attributes.placeholder }}</span>
+                <span v-else :title="getTitle(item)">{{ getTitle(item) }}</span>
               </div>
             </div>
           </Draggable>
@@ -73,6 +73,12 @@
         this.$nextTick(() => {
           $(this.$refs.modal).modal('hide');
         });
+      },
+      getTitle(item) {
+        let $item_html = $(item.attributes.text);
+        $item_html.remove('table, img');
+        let str = $item_html.text().trim();
+        return str.length > 56 ? str.slice(0, 56) + "..." : str;
       }
     }
   }