<!DOCTYPE html>
<html>
<head>
<title>Article Editor</title>
<meta charset="utf-8">
<!-- css -->
<link rel="stylesheet" href="/your-article-dist-path/article-editor.min.css" />
</head>
<body>
<!-- element -->
<textarea id="entry">
<p>Content</p>
</textarea>
<!-- js -->
<script src="/your-article-dist-path/article-editor.min.js"></script>
<script src="/your-article-dist-path/plugins/style.min.js"></script>
<!-- call -->
<script>
ArticleEditor('#entry', {
plugins: ['style'],
css: ['/article-dist/arx-frame.min.css'],
custom: {
css: [
'https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&family=PT+Serif:ital@0;1&display=swap',
'/path-to/content.css'
]
},
styles: {
paragraph: {
lead: {
title: "Lead",
classname: 'lead'
}
},
image: {
leader: {
title: "Leader",
classname: 'leader'
}
}
},
grid: {
gutter: '40px',
overlay: false
},
image: {
upload: '/upload-server-side-script/',
select: '/path-to-images.json'
}
});
</script>
</body>
</html>