TinyMCE template variable didn't display value

Question

I'm using this function using the template plugin to display a varible in tinymce content. But that didn't work, the variable was showing as its name

function tinySetup(config)
{
if (typeof tinyMCE === 'undefined') {
    setTimeout(function() {
        tinySetup(config);
    }, 100);
    return;
}


if(!config)
    config = {};

//var editor_selector = 'rte';

if (typeof config.editor_selector != 'undefined')
    config.selector = '.'+config.editor_selector;

default_config = {
    selector: ".rte" ,
    plugins : "template colorpicker link image paste pagebreak table contextmenu filemanager table code media autoresize textcolor anchor",
    template_replace_values : {
            username : "Some User",
            staffid : "991234"
    },
    theme : "advanced",
    mode : "textareas",

    theme_advanced_buttons3_add : "template",
    browser_spellcheck : true,
    toolbar1 : "code,|,bold,italic,underline,strikethrough,|,alignleft,aligncenter,alignright,alignfull,formatselect,|,blockquote,colorpicker,pasteword,|,bullist,numlist,|,outdent,indent,|,link,unlink,|,anchor,|,media,image",
    toolbar2: "",
            theme_advanced_fonts : "Andale Mono=andale mono,times;"+
    "Arial=arial,helvetica,sans-serif;"+
    "Arial Black=arial black,avant garde;"+
    "Book Antiqua=book antiqua,palatino;"+
    "Comic Sans MS=comic sans ms,sans-serif;"+
    "Courier New=courier new,courier;"+
    "Georgia=georgia,palatino;"+
    "Helvetica=helvetica;"+
    "Impact=impact,chicago;"+
    "Symbol=symbol;"+
    "Tahoma=tahoma,arial,helvetica,sans-serif;"+
    "Terminal=terminal,monaco;"+
    "Times New Roman=times new roman,times;"+
    "Trebuchet MS=trebuchet ms,geneva;"+
    "Verdana=verdana,geneva;"+
    "Webdings=webdings;"+
    "Wingdings=wingdings,zapf dingbats",
    external_filemanager_path: ad+"/filemanager/",
    filemanager_title: "File manager" ,
    external_plugins: { "filemanager" : ad+"/filemanager/plugin.min.js"},
    language: iso,
    skin: "prestashop",
    statusbar: false,
    relative_urls : false,
    convert_urls: false,
    entity_encoding: "raw",
    extended_valid_elements : "em[class|name|id]",
    valid_children : "+*[*]",
    valid_elements:"*[*]",
    menu: {
        edit: {title: 'Edit', items: 'undo redo | cut copy paste | selectall'},
        insert: {title: 'Insert', items: 'media image link | pagebreak'},
        view: {title: 'View', items: 'visualaid'},
        format: {title: 'Format', items: 'bold italic underline strikethrough superscript subscript | formats | removeformat'},
        table: {title: 'Table', items: 'inserttable tableprops deletetable | cell row column'},
        tools: {title: 'Tools', items: 'code'}
    }
};

$.each(default_config, function(index, el)
{
    if (config[index] === undefined )
        config[index] = el;
});

tinyMCE.init(config);
}

But the variable is not displaying a value a got {$username} in place of 'Some User'

My text is "T-shirt délavé à manches courtes et col rond. Matière douce et extensible pour un confort inégalé. Pour un look estival, portez-le avec un chapeau de paille ! {$username}"

Answer 1

I fixed the problem by adding the template block

templates : [
        {
            title: "Product price",
            content: "Prix du produit {$product_price}",
            description: "Adds an editing timestamp."
        }
      ]