Open pateras95 opened 4 years ago
@pateras95
public/scripts/myTool.js
unlayer.registerTool({
name: 'my_tool',
label: 'My Tool',
icon: 'fa-smile',
supportedDisplayModes: ['web', 'email'],
options: {},
values: {},
renderer: {
Viewer: unlayer.createViewer({
render(values) {
return "<div>I am a custom tool.</div>"
}
}),
exporters: {
web: function(values) {
return "<div>I am a custom tool.</div>"
},
email: function(values) {
return "<div>I am a custom tool.</div>"
}
},
head: {
css: function(values) {},
js: function(values) {}
}
}
});
add types if using typescript
type UnlayerWindow = Window & {
unlayer: UnlayerEditor; // define it with whatever you need
};
in your component
initEditor(): void {
const { unlayer } = (window as unknown) as UnlayerWindow;
this.editor = unlayer.createEditor({
id: "editor",
projectId: 6141,
safeHtml: false,
displayMode: "email",
tools: {
form: { enabled: false },
},
customJS: [`${window.location.origin}/scripts/myTool.js`],
});
}
@pateras95
public/scripts/myTool.js
unlayer.registerTool({ name: 'my_tool', label: 'My Tool', icon: 'fa-smile', supportedDisplayModes: ['web', 'email'], options: {}, values: {}, renderer: { Viewer: unlayer.createViewer({ render(values) { return "<div>I am a custom tool.</div>" } }), exporters: { web: function(values) { return "<div>I am a custom tool.</div>" }, email: function(values) { return "<div>I am a custom tool.</div>" } }, head: { css: function(values) {}, js: function(values) {} } } });
add types if using typescript
type UnlayerWindow = Window & { unlayer: UnlayerEditor; // define it with whatever you need };
in your component
initEditor(): void { const { unlayer } = (window as unknown) as UnlayerWindow; this.editor = unlayer.createEditor({ id: "editor", projectId: 6141, safeHtml: false, displayMode: "email", tools: { form: { enabled: false }, }, customJS: [`${window.location.origin}/scripts/myTool.js`], }); }
doesnt that defeat the purpose of the vuejs component? createViewer method is not available here. It must be passed as customJS Im basicly getting that error, can anyone help me out?
@pateras95
public/scripts/myTool.js
unlayer.registerTool({ name: 'my_tool', label: 'My Tool', icon: 'fa-smile', supportedDisplayModes: ['web', 'email'], options: {}, values: {}, renderer: { Viewer: unlayer.createViewer({ render(values) { return "<div>I am a custom tool.</div>" } }), exporters: { web: function(values) { return "<div>I am a custom tool.</div>" }, email: function(values) { return "<div>I am a custom tool.</div>" } }, head: { css: function(values) {}, js: function(values) {} } } });
add types if using typescript
type UnlayerWindow = Window & { unlayer: UnlayerEditor; // define it with whatever you need };
in your component
initEditor(): void { const { unlayer } = (window as unknown) as UnlayerWindow; this.editor = unlayer.createEditor({ id: "editor", projectId: 6141, safeHtml: false, displayMode: "email", tools: { form: { enabled: false }, }, customJS: [`${window.location.origin}/scripts/myTool.js`], }); }
doesnt that defeat the purpose of the vuejs component? createViewer method is not available here. It must be passed as customJS Im basicly getting that error, can anyone help me out?
I can't add custom tools either When I create the custom.js file it always says unlayer is not defined
+1 not able to pass customJS to the vue EmailEditor component
at this point this can be a feature request @umairsiddique?
Can you give me a demo
I was trying to add a custom tool on vue js component as the documentation for react shows with no luck. Can you demonstrate the correct way to add a new custom tool on vue .js