How to get Dynamic Text field to work!


I’am new to HTML and Caspar CG

I want to run my HTML code Inside Caspar and change the text in Caspar…

I’ve watched nearly all of the tutorials on Youtube and tried to find information on the forums…

So what do I need to do to change my text inside Caspar?
How do I “link” f0 to my code?



The HTML producer in CasparCG server expects to be able to call 4 core functions in the Javascript of your template. The four primary functions are:

  1. play() - called when the template is run (client F2 key). Your code for play() defines how the template adds your template content onto the display.

  2. update(str) - This function receives the data sent by the client as either XML wrapped text or as JSON (tick box in the client inspector for the template item). Your code has to parse the str string into the elements, then copy the values into the HTML elements. Invoked as part of the play() request or when you send new data using the F6 function key.

  3. stop() - This function is called when the client sends the stop command (function key F1). Your code in the stop function defines how the template removes data from the screen (cut, fade, move etc).

  4. next() - This function is called when the template runs in several time blocks, pausing at the end of each block. A call to next() runs the next phase of the timeline animation.

There are a couple of excellent articles about how to create templates and write the Javascript written by Reto Inderbitzin. The first of these is available at

There are other functions such as invoke() that you can examine once you have the basic set of functions operating.