News Schema Visualised

news_schema_visualised.js

javascript:(function() {
    var schemas = document.querySelectorAll('script[type="application/ld+json"]');
    var newsSchema = null;
    schemas.forEach(function(schema) {
        var json = JSON.parse(schema.innerText);
        if (json['@type'] === 'NewsArticle') {
            newsSchema = json;
        }
    });
    if (newsSchema) {
        var style = '<style>';
        style += 'body { font-family: Arial, sans-serif; line-height: 1.6; margin: 0; padding: 20px; }';
        style += '.container { max-width: 800px; margin: auto; }';
        style += 'h1 { font-size: 28px; color: #333; margin-bottom: 0.5em; }';
        style += 'p, .article-body { margin-bottom: 1em; }';
        style += 'img { max-width: 100%; height: auto; margin-top: 20px; }';
        style += '</style>';

        var article = '<div class="container">';
        article += '<h1>' + newsSchema.headline + '</h1>';
        article += '<p><strong>Published:</strong> ' + new Date(newsSchema.datePublished).toLocaleString() + '</p>';
        if(newsSchema.author && newsSchema.author.length > 0) {
            article += '<p><strong>Author:</strong> ' + newsSchema.author.map(a => a.name).join(', ') + '</p>';
        }
        article += '<p><strong>Description:</strong> ' + newsSchema.description + '</p>';
        if(newsSchema.image && newsSchema.image.length > 0) {
            article += '<img src="' + newsSchema.image[0].url + '">';
        }
        if(typeof newsSchema.articleBody === 'string') {
            article += '<div class="article-body"><strong>Article Body:</strong><p>' + newsSchema.articleBody.split('\n').join('</p><p>') + '</p></div>';
        } else {
            article += '<p class="warning">WARNING: Article Body was not found :( Some websites do not show this information to avoid the content of the article being shown to users such as this way. </p>';
        }
        article += '</div>';

        document.body.innerHTML = style + article;
    } else {
        alert('No News Schema found on this page.');
    }
})();