Documentation

With easy structure and different options, You can show your email builder

<div class='your selector'></div>
                

$('.your selector').emailBuilder({
  elementJsonUrl: 'elements.json',
  langJsonUrl: 'lang.json',
  lang: 'en',
  loading_color1: '#3B7694',
  loading_color2: '#09181F',
  showLoading: true,

  blankPageHtml: '',
  loadPageHtml: '',

  showContextMenu: true,
  showContextMenu_FontFamily: true,
  showContextMenu_FontSize: true,
  showContextMenu_Bold: true,
  showContextMenu_Italic: true,
  showContextMenu_Underline: true,
  showContextMenu_Strikethrough: true,
  showContextMenu_Hyperlink: true,


  showElementsTab: true,
  showPropertyTab: true,
  showCollapseMenu: true,
  showBlankPageButton: true,
  showCollapseMenuinBottom: true,


  showSettingsBar: true,
  showSettingsPreview: true,
  showSettingsExport: true,
  showSettingsSendMail: true,
  showSettingsSave: true,
  showSettingsLoadTemplate: true,
  showMobileView: true,

  showRowMoveButton: true,
  showRowRemoveButton: true,
  showRowDuplicateButton: true,
  showRowCodeEditorButton: true,

  onSettingsPreviewButtonClick: function(e) {},
  onSettingsExportButtonClick: function(e) {},
  onBeforeSettingsSaveButtonClick: function(e) {},
  onSettingsSaveButtonClick: function(e) {},
  onBeforeSettingsLoadTemplateButtonClick: function(e) {},
  onSettingsSendMailButtonClick: function(e) {},


  onBeforeChangeImageClick: function(e) {},
  onBeforePopupSelectImageButtonClick: function(e) {},
  onBeforePopupSelectTemplateButtonClick: function(e) {},
  onPopupSaveButtonClick: function(e) {},
  onPopupSendMailButtonClick: function(e) {},
  onPopupUploadImageButtonClick: function(e) {},


  onBeforeRowRemoveButtonClick: function(e) {},
  onAfterRowRemoveButtonClick: function(e) {},

  onBeforeRowDuplicateButtonClick: function(e) {},
  onAfterRowDuplicateButtonClick: function(e) {},

  onBeforeRowEditorButtonClick: function(e) {},
  onAfterRowEditorButtonClick: function(e) {},

  onBeforeShowingEditorPopup: function(e) {},
  onAfterLoad:function(e) {}
}});
                    

If you want to stop running function, you should use below code in before events

$('.bal-editor-demo').emailBuilder({
  onBeforeRowDuplicateButtonClick: function(e) {
      console.log('onBeforeRowDuplicateButtonClick html');
      e.preventDefault(); // return false;
  }
});

After declare below variable you can use API methods very easily

var  _builder= $('.bal-editor-demo').emailBuilder({ });

API Methods

_builder.setElementJsonUrl('value');

_builder.setLang('value');

_builder.setLangJsonUrl('value');

_builder.setBlankPageHtml('value');

_builder.setLoadPageHtml('value');

_builder.setShowContextMenu('value');

_builder.setShowContextMenu_FontFamily('value');

_builder.setShowContextMenu_FontSize('value');

_builder.setShowContextMenu_Bold('value');

_builder.setShowContextMenu_Italic('value');

_builder.setShowContextMenu_Underline('value');

_builder.setShowContextMenu_Strikethrough('value');

_builder.setShowContextMenu_Hyperlink('value');

_builder.setShowElementsTab('value');

_builder.setShowPropertyTab('value');

_builder.setShowCollapseMenu('value');

_builder.setShowBlankPageButton('value');

_builder.setShowCollapseMenuinBottom('value');

_builder.setShowSettingsBar('value');

_builder.setShowSettingsPreview('value');

_builder.setShowSettingsExport('value');

_builder.setShowSettingsSendMail('value');

_builder.setShowSettingsSave('value');

_builder.setShowSettingsLoadTemplate('value');

_builder.setShowRowMoveButton('value');

_builder.setShowRowRemoveButton('value');

_builder.setShowRowDuplicateButton('value');

_builder.setShowRowCodeEditorButton('value');

_builder.init();

_builder.setSettingsPreviewButtonClick(function);

_builder.setSettingsExportButtonClick(function);

_builder.setBeforeSettingsSaveButtonClick(function);

_builder.setSettingsSaveButtonClick(function);

_builder.setBeforeSettingsLoadTemplateButtonClick(function);

_builder.setSettingsSendMailButtonClick(function);

_builder.setBeforeChangeImageClick(function);

_builder.setBeforePopupSelectImageButtonClick(function);

_builder.setPopupSaveButtonClick(function);

_builder.setBeforePopupSelectTemplateButtonClick(function);

_builder.setPopupUploadImageButtonClick(function);

_builder.setBeforeRowRemoveButtonClick(function);

_builder.setAfterRowRemoveButtonClick(function);

_builder.setBeforeRowDuplicateButtonClick(function);

_builder.setAfterRowDuplicateButtonClick(function);

_builder.setBeforeRowEditorButtonClick(function);

_builder.setAfterRowEditorButtonClick(function);

_builder.setBeforeShowingEditorPopup(function);

_builder.setAfterLoad(function);

_builder.getContentHtml();

_builder.makeSortable();

Example API Methods

Firstly you should declare below variable for use API Methods,after this you can call any method very easily

var  _builder= $('.bal-editor-demo').emailBuilder();

Example : getContentHtml

_builder.getContentHtml();

Example : setAfterLoad

_builder.setAfterLoad(function(){
  console.log('setAfterLoad function');
});

Example : makeSortable

_builder.makeSortable();