Script Artikel Terkait Ditengah Postingan - XWAPPER

Script related artikel yang muncul ditengah-tengah postingan, kalau anda menyukainya, silakan salin kode dibawah ini:

<style>
/* Style XWapper Related Post - Fix & Clean */
.xwapper-inline-related {
    margin: 20px 0;
    padding: 15px;
    border-left: 5px solid #3498db;
    background: #f1f8ff;
    display: flex;
    flex-direction: column;
    gap: 5px;
}
.xw-label-tag {
    color: #3498db;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 1px;
}
.xw-link-related {
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 700;
    color: #2c3e50 !important;
    text-decoration: none !important;
}
.xw-link-related:hover {
    text-decoration: underline !important;
    color: #2980b9 !important;
}
</style>

<div id="xw-related-placeholder"></div>

<script>
// Script otomatis mengambil 1 artikel random dari feed blog
(function() {
    var placeholder = document.getElementById('xw-related-placeholder');
    // Mengambil feed secara acak
    var randomNum = Math.floor(Math.random() * 10) + 1; 
    var script = document.createElement('script');
    script.src = '/feeds/posts/default?alt=json-in-script&start-index=' + randomNum + '&max-results=1&callback=showXWRelated';
    document.body.appendChild(script);
})();

function showXWRelated(json) {
    var container = document.getElementById('xw-related-placeholder');
    if (json.feed.entry) {
        var entry = json.feed.entry[0];
        var title = entry.title.$t;
        var link = "";
        for (var i = 0; i < entry.link.length; i++) {
            if (entry.link[i].rel == 'alternate') {
                link = entry.link[i].href;
                break;
            }
        }
        
        var html = '<div class="xwapper-inline-related">';
        html += '<span class="xw-label-tag">BACA JUGA :</span>';
        html += '<a class="xw-link-related" href="' + link + '">' + title + '</a>';
        html += '</div>';
        container.innerHTML = html;
    }
}
</script>

Cara Pemasangan

Pergi ke tema, edit HTML. cari kode <data:post.body/>, paste script tadi tepat dibawahnya.

Biasanya kode ini ada lebih dari satu (tergantung template). Coba cari yang kedua atau ketiga dan letakkan script dibawahnya.