Menu

Examples

Predefined block classes

This example shows how Article can add predefined classes to all specified tags. You can see the result visually and click source code in the toolbar to see the added classes.

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">
        <h2>...</h2>
        <div class="arx-text">...</div>
    </textarea>

    <!-- js -->
    <script src="/your-article-dist-path/article-editor.min.js"></script>

    <!-- call -->
    <script>
    ArticleEditor('#entry', {
        css: '/your-article-dist-path/',
        custom: {
            css: ['/your-article-dist-path/custom-css-with-classes.css']
        },
        classes: {
            'p': 'my-paragraph',
            'h2': 'my-heading'
        }
    });
    </script>
</body>
</html>