Open
Description
Not sure where to put this is this isn't a React but a vanilla JS issue but designTags don't work. Here is a test case. Most of the below is just the editor_config variable. I expect it to say My name is Slim Shady, but my_name is never replaced with Slim.
<html>
<head>
<script src="https://editor.unlayer.com/embed.js"></script>
</head>
<body>
<div id="editor"></div>
<script>
const editor_config = {
"counters": {
"u_column": 1,
"u_row": 1,
"u_content_text": 1
},
"body": {
"id": "eCuoEyc7Vi",
"rows": [{
"id": "6HxSmnRARL",
"cells": [1],
"columns": [{
"id": "3p5hhU5Fly",
"contents": [{
"id": "ZU_roxPaie",
"type": "text",
"values": {
"containerPadding": "10px",
"anchor": "",
"fontSize": "14px",
"textAlign": "left",
"lineHeight": "140%",
"linkStyle": {
"inherit": true,
"linkColor": "#0000ee",
"linkHoverColor": "#0000ee",
"linkUnderline": true,
"linkHoverUnderline": true
},
"displayCondition": null,
"_styleGuide": null,
"_meta": {
"htmlID": "u_content_text_1",
"htmlClassNames": "u_content_text",
"description": ""
},
"selectable": true,
"draggable": true,
"duplicatable": true,
"deletable": true,
"hideable": true,
"locked": false,
"text": "<p style=\"line-height: 140%;\">My name is [[ my_name ]] Shady.</p>",
"_languages": {}
}
}],
"values": {
"border": {},
"padding": "0px",
"backgroundColor": "",
"_meta": {
"htmlID": "u_column_1",
"htmlClassNames": "u_column"
},
"deletable": true
}
}],
"values": {
"displayCondition": null,
"columns": false,
"_styleGuide": null,
"backgroundColor": "",
"columnsBackgroundColor": "",
"backgroundImage": {
"url": "",
"fullWidth": true,
"repeat": "no-repeat",
"size": "custom",
"position": "center"
},
"padding": "0px",
"anchor": "",
"hideDesktop": false,
"_meta": {
"htmlID": "u_row_1",
"htmlClassNames": "u_row"
},
"selectable": true,
"draggable": true,
"duplicatable": true,
"deletable": true,
"hideable": true,
"locked": false
}
}],
"headers": [],
"footers": [],
"values": {
"_styleGuide": null,
"popupPosition": "center",
"popupWidth": "600px",
"popupHeight": "auto",
"borderRadius": "10px",
"contentAlign": "center",
"contentVerticalAlign": "center",
"contentWidth": "500px",
"fontFamily": {
"label": "Arial",
"value": "arial,helvetica,sans-serif"
},
"textColor": "#000000",
"popupBackgroundColor": "#FFFFFF",
"popupBackgroundImage": {
"url": "",
"fullWidth": true,
"repeat": "no-repeat",
"size": "cover",
"position": "center"
},
"popupOverlay_backgroundColor": "rgba(0, 0, 0, 0.1)",
"popupCloseButton_position": "top-right",
"popupCloseButton_backgroundColor": "#DDDDDD",
"popupCloseButton_iconColor": "#000000",
"popupCloseButton_borderRadius": "0px",
"popupCloseButton_margin": "0px",
"popupCloseButton_action": {
"name": "close_popup",
"attrs": {
"onClick": "document.querySelector('.u-popup-container').style.display = 'none';"
}
},
"language": {},
"backgroundColor": "#F9F9F9",
"preheaderText": "",
"linkStyle": {
"body": true,
"linkColor": "#0000ee",
"linkHoverColor": "#0000ee",
"linkUnderline": true,
"linkHoverUnderline": true
},
"backgroundImage": {
"url": "",
"fullWidth": true,
"repeat": "no-repeat",
"size": "custom",
"position": "center"
},
"_meta": {
"htmlID": "u_body",
"htmlClassNames": "u_body"
}
}
},
"schemaVersion": 20
}
var editor = unlayer.createEditor({
id: 'editor',
projectId: ADDYOUROWNPROJECTIDHERE,
displayMode: 'email',
designTags: {
my_name: "Slim"
}
});
editor.addEventListener('editor:ready', function () {
editor.loadDesign(editor_config);
});
</script>
</body>
</html>
Metadata
Metadata
Assignees
Labels
No labels