Preview images in current draft

Posted by @jsamlarose, Last update about 1 month ago

A quick and simple way to preview images (markdown image links) in the current Draft.


  • script

    // Search for markdown image links in the current draft and preview them in an HTML preview
    // Get the content of the current draft
    let content = draft.content;
    // Regular expression to match markdown image links
    let regex = /!\[.*?\]\((.*?)\)/g;
    // Array to store image URLs
    let imageUrls = [];
    // Match markdown image links and extract image URLs
    let match;
    while ((match = regex.exec(content)) !== null) {
    // If there are image URLs, create an HTML preview
    if (imageUrls.length > 0) {
        let html = "<html><head><style>body { background-color: #333; color: white; }</style></head><body>";
        // Add image tags to the HTML
        for (let url of imageUrls) {
            html += `<img src="${url}" style="width: 100%;"><br>`;
        html += "</body></html>";
        // Create an HTMLPreview object and load the HTML content
        let preview = HTMLPreview.create();;
        if ( {  
          // continue button was pressed  
        else {  
          // cancel button was pressed  
    } else {
        app.displayInfoMessage("No markdown image links found.");


  • After Success Default
    Notification Error
    Log Level Error
Items available in the Drafts Directory are uploaded by community members. Use appropriate caution reviewing downloaded items before use.