I'm only 2 weeks old to Magento but I believe I'm getting my head around it well. I have a task to enable language translations on the store front, which works well using inline translation but that only works for elements that Magento has created upon page generation.

This gets tricky for me because once the page is generated, an AJAX call is made which returns HTML and inserts that in to the page. The inline translation doesn't allow me to translate that from the store front, understandably.

My idea at the moment is to hack the inline translator code to allow me to edit injected HTML but I'm struggling to find the code in Magento that creates the red dotted line around elements. Could somebody give me a pointer to where this is please.

Alternatively, I'm open for suggestions for doing this.

We have a custom product importer that some ex-developer has created. This works by reading an XML file that a client supplies us and some voodoo happens and the products appear in the store. One idea we have here is to put the translation data in to that importer.

I should add that the injected HTML is stored in files on the file system.


  • I've since figured out that translatable elements have a tag attribute like the following: <a translate="[{"shown":"Home - English","translated":"Home - English","original":"Home","location":"Link label","scope":"Mage_Page"}]">X</a>
    – Ste
    Commented Aug 20, 2014 at 15:51

2 Answers 2


To recognize elements on the page from the translator that weren't on the page when Dom Ready fired you call reinitElements. The core class Mage_Core_Model_Translate_Inline doesn't cast the inline translator to a window object, however, so you'll need to rewrite this class and modify it to do so:


<script type="text/javascript">
    new TranslateInline('translate-inline-trig', '<?php echo $ajaxUrl ?>', '<?php
        echo Mage::getDesign()->getArea() ?>');


<script type="text/javascript">
    window.translateInline = new TranslateInline('translate-inline-trig', '<?php echo $ajaxUrl ?>', '<?php
        echo Mage::getDesign()->getArea() ?>');
    $('body').observe('ajax:complete', window.translateInline.reinitElements);

Rather than 'hack' the inline translator to recognize elements it already does it but we're telling prototype to listen for finished ajax calls and then call reinit when that has finished.


I don't know what the potential frontend performance implications will be for an ajax-heavy frontend site.

  • 1
    My response wont fit in a reply so I've hosted my reply on pastebin. pastebin.com/wDwiewLT
    – Ste
    Commented Aug 20, 2014 at 16:28

Fixed with


Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.