Using Handlebars Helper Functions

Support
1

Hi,

I have the following HTML snippet in the Generate Asset block:

{{#each processedArticles}}
<div class="border-l-4 border-indigo-500 bg-indigo-50 p-6 rounded-r-lg mb-4">
  <div class="flex justify-between items-start mb-3">
    <h3 class="text-lg font-semibold text-gray-800">{{title}}</h3>
    <span class="text-sm text-gray-500 bg-white px-3 py-1 rounded-full">{{date}}</span>
  </div>
   <p class="text-gray-700 mb-4 leading-relaxed">{{content_summary}}</p>
   <a href="{{link}}" target="_blank" class="inline-flex items-center text-indigo-600 hover:text-indigo-800 font-medium">
     <i class="fas fa-external-link-alt mr-2"></i>
     View Article
   </a>
</div>
{{/each}}

Additionally; I created the following Handlebars helper function:

<script>
    // Handlebars Helper Functions
    Handlebars.registerHelper('content_summary', function(content) {
        return content.length > 300 ? content.substring(0, 300) + '...' : content;
    });
</script>

Somehow, I can’t get this to work. I also tried using {{content_summary content}} instead of just {{content_summary}}; this neither works.

Note: content is a valid key in processedArticles and simply using {{content}} works fine.

I have a feeling I’m missing something crucial about the usage of Handlebars helper functions. Any ideas how I can fix this?

2

It looks like you’re mixing two different ways of working with Handlebars here.

In your template, you’re trying to define a custom helper using <script>Handlebars.registerHelper(...)</script>, which would work in a browser-based setup where you’re rendering everything client-side. But in MindStudio, templates are rendered server-side, so any <script> tags or helper definitions in the template itself can’t run or be recognized.

Instead, you can use our built-in sample helper, which is designed exactly for this kind of thing. It lets you extract a portion of a string by word, line, or letter:

{{sample content 300 "letter"}}

Or, if you’d rather sample by words:

{{sample content 50 "word"}}

This should give you a clean, truncated summary without needing to define your own helper.

If you wanted to go deeper, a more advanced way of doing things would be to use a custom function to get all the variables in order before rendering the template, which is how I usually do it because it makes the final Generate Asset step a lot cleaner, since all you’re doing is plugging in variables instead of mixing logic/transformations in as well.

3

Thanks for the clarification! I’d like to report a minor issue I noticed with the Live Preview of the Generate Asset block.

When I use a plain variable, everything renders correctly in the preview:

image
image848×349 17.1 KB

However, when I include the sample helper, the Live Preview doesn’t render as expected. In fact, if the form is long and includes other variables, nothing renders at all - including plain variables.

Interestingly, when I run the workflow itself, the Generate Asset block works fine and returns the expected result (e.g., the first 10 characters). It seems the issue is limited to the preview function.

image
image853×289 19.9 KB

You may want to take a look at this. Thanks!