Displaying preview panel automatically in markitup! editor

Question

I\'m using the markitup! as a markdown editor (example).

Currently, I need to press the preview button (green tick) to display the preview panel.

I would like t

Answer 1

Or you could do it by hacking it a little : in the source file add

autoShowPreview : false,

as a field in the options object so it will look like :

options = { id:                     '',
                nameSpace:              '',
                root:                   '',
                previewHandler:         false,
                previewInWindow:        '', // 'width=800, height=600, resizable=yes, scrollbars=yes'
                previewInElement:       '',
                previewAutoRefresh:     true,
                autoShowPreview :       true,  //custom option here : 
                previewPosition:        'after',
                previewTemplatePath:    '~/templates/preview.html',
                previewParser:          false,
                previewParserPath:      '',
                previewParserVar:       'data',
                resizeHandle:           true,
                beforeInsert:           '',
                afterInsert:            '',
                onEnter:                {},
                onShiftEnter:           {},
                onCtrlEnter:            {},
                onTab:                  {},
                markupSet:          [   { /* set */ } ]
            };

Then near the end of the document around line 610 there is the call to the init(); function. You can change it like this :

init();
if(options.autoShowPreview){
     preview();
     refreshPreview();
}

You can always disable it if not needed by modifying our custom prop at initialization time.