How To Create Automatic Internal linking In Blogger Websites

<!-- Stylish Internal Links Box (Key2blogging) -->
<div class='random-posts-box'>
  <h3 class='rp-title'>You May Also Like</h3>
  <div id='random-posts'>Loading...</div>
</div>

<style>
.random-posts-box {
  background: #fff;
  border: 4px solid #eee;
  border-radius: 12px;
  padding: 20px 20px;
  box-shadow: 0 0px 5px rgba(0,0,0,0.05);
  margin: 20px 0;
  font-family: system-ui;
  min-height: 300px;
}

.random-posts-box .rp-title {
  font-size: 21px;
  margin-top: 0;
  margin-bottom: 12px;
  font-weight: 600;
  color: #333;
  border-left: 4px solid #3f51b5;
  padding-left: 8px;
}

.random-posts-box ul {
  list-style: none;
  margin: 0;
  padding: 0;
  counter-reset: post-counter;
}

.random-posts-box li {
  margin: 5px 0;
  padding-left: 25px;
  position: relative;
}

.random-posts-box li::before {
  counter-increment: post-counter;
  content: counter(post-counter, decimal-leading-zero)!important;
  font-family: system-ui !important;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
  background: #3f51b5;
  color: #fff;
  font-size: 13px!important;
  font-weight: bold;
  width: 28px;
  height: 28px;
  line-height: 28px!important;
  border-radius: 50%;
  text-align: center;
  transition: background 0.3s ease; 
}
  
.random-posts-box li:hover::before {
  background: #F44336; 
}

.random-posts-box a {
  display: block;
  padding: 5px 12px;
  border-radius: 8px;
  text-decoration: none;
  color: #204ecf;
  font-size: 18px;
  font-weight: 500;
  transition: color 0.3s ease;
}

.random-posts-box a:hover {
  color: #F44336;
}
</style>

<script type='text/javascript'>
//<![CDATA[
var randomPostsConfig = {
  homePage: "https://example.blogspot.com",
  numPosts: 5,
  cacheKey: "randomPostsCache",
  cacheTime: 24 * 60 * 60 * 1000 
};

function renderRandomPosts(posts) {
  var container = document.getElementById("random-posts");
  var selections = [];
  while (selections.length < randomPostsConfig.numPosts && selections.length < posts.length) {
    var idx = Math.floor(Math.random() * posts.length);
    if (!selections.includes(idx)) selections.push(idx);
  }

  var html = "<ul>";
  selections.forEach(function(i) {
    var entry = posts[i];
    var title = entry.title.$t;
    var link = entry.link.find(l => l.rel === "alternate").href;
    html += '<li><a href="' + link + '">' + title + '</a></li>';
  });
  html += "</ul>";
  container.innerHTML = html;

  // Fade-in effect
  var ul = container.querySelector("ul");
  setTimeout(function() {
    ul.classList.add("show");
  }, 50); 
}

function randomPostsCallback(json) {
  if (!json.feed || !json.feed.entry) return;
  var posts = json.feed.entry;
  localStorage.setItem(randomPostsConfig.cacheKey, JSON.stringify({
    timestamp: Date.now(),
    posts: posts
  }));
  renderRandomPosts(posts);
}

(function() {
  var cache = localStorage.getItem(randomPostsConfig.cacheKey);
  if (cache) {
    try {
      var cachedData = JSON.parse(cache);
      if (Date.now() - cachedData.timestamp < randomPostsConfig.cacheTime) {
        renderRandomPosts(cachedData.posts);
        return;
      }
    } catch(e) { console.error("Cache error:", e); }
  }

  var script = document.createElement("script");
  script.src = randomPostsConfig.homePage +
    "/feeds/posts/summary?alt=json-in-script&max-results=30&callback=randomPostsCallback";
  script.async = true;
  document.head.appendChild(script);
})();
//]]>
</script>