Create a custom block

This example shows how to create your own block.

    Select any block in the template and click the "plus" button on the toolbar, in the Misc section you will see the added block icon.

    Code

    <!DOCTYPE html>
    <html>
        <head>
            <title>Revolvapp</title>
            <meta charset="utf-8">
    
            <!-- css -->
            <link rel="stylesheet" href="/your-folder/revolvapp.css" />
        </head>
        <body>
            <!-- element -->
            <div id="myemail"></div>
    
            <!-- js -->
            <script src="/your-folder/revolvapp.js"></script>
    
            <script>
            // Custom block
            Revolvapp.add('block', 'block.myblock', {
                mixins: ['block'],
                type: 'myblock',
                title: 'My block',
                icon: '<svg ...></svg>',
                section: 'misc',
                build: function() {
    
                    // block
                    this.block = this.app.create('tag.block', {
                        padding: '40px'
                    });
    
                    // components
                    var image = this.app.create('tag.image', {
                        placeholder: true
                    });
    
                    var text = this.app.create('tag.text', {
                        html: this.lang.get('placeholders.lorem'),
                        margin: '10px 0 0 0'
                    });
    
                    // add
                    this.block.add(image);
                    this.block.add(text);
                }
            });
    
            // Call
            Revolvapp('#myemail', {
                editor: {
                    path: '/your-path-to-revolvapp-folder/',
                    template: '/your-path-to-template-file.html'
                },
                image: {
                    upload: '/my-backend-upload/'
                }
            });
            </script>
        </body>
    </html>

    Usage

    See more about how to create your own block in Revolvapp.