Visor

Sometimes, the way that we want the plugin to be displayed to the author of the content differs from the one that we want to show to the final user. Thus, we can define an additional file plugins/<NameOfThePlugin>/visor/<NameOfThePlugin> in which we specify what the content should look like for the final user. Thus, a file that specifies how the plugin content should be displayed in the viewer can be defined in plugins/<NameOfThePlugin>/visor/<NameOfThePlugin>.js

export function <NameOfThePlugin>(base){
  return{
    init: function(){
    },
    getRenderTemplate: function(state, props){
    },

  }
}

As can be seen the tho methods used in this file are init and getRenderTemplate. The second one is the most commonly used and allows for defining a specific interface for the final user, instead of using the same one as in the editor. As happens in the editor's interface, a separate component can be defined in case React's advanced methods are needed.

In the section Rich plugins you will learn how to define a plugin with the capacity to link to other parts of the document.