Article #1

    Code

    <!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/imageposition.min.js"></script>
        <script src="/your-article-dist-path/plugins/style.min.js"></script>
    
        <!-- call -->
        <script>
        ArticleEditor('#entry', {
            plugins: ['imageposition', 'style'],
            css: ['/article-dist/arx-frame.min.css'],
            custom: {
                css: [
                    'https://fonts.googleapis.com/css2?family=Merriweather:ital,wght@0,400;0,700;1,400;1,700&family=Montserrat:ital,wght@0,400;0,700;1,400;1,700&display=swap',
                    '/path-to/content.css'
                ]
            },
            classes: {
                 blocks: {
                    'quote': 'quote'
                 }
            },
            styles: {
                paragraph: {
                    lead: {
                        title: "Lead",
                        classname: 'lead'
                    },
                    dropcap: {
                        title: "Dropcap",
                        classname: 'dropcap'
                    }
                },
                image: {
                    leader: {
                        title: "Leader",
                        classname: 'leader'
                    }
                }
            },
            image: {
                upload: '/upload-server-side-script/',
                select: '/path-to-images.json'
            }
        });
        </script>
    </body>
    </html>