Blogger में Without Image Recent Posts Widget कैसे Add करे ?

अगर आप अपने Blogger Blog में एक Recent Posts Widget Without Image जोड़ना चाहते हैं, तो यह तरीका आपके लिए बहुत आसान और उपयोगी है। इस widget में post title के अलावा कोई image या date नहीं दिखेगी, जिससे ब्लॉग fast load होगा और clean look मिलेगा।

Recent Posts Widget Without Image एक ऐसा widget होता है जिसमें आपके ब्लॉग की latest posts सिर्फ title और link के साथ दिखाई जाती हैं। इसमें कोई thumbnail image या post date नहीं होती।

Blogger में Without Image Recent Posts Widget कैसे Add करे ? 

नीचे दिए गए steps को ध्यान से follow करें:

• सबसे पहले Blogger में Login करें
• अब Dashboard पर जाएं
• Layout पर क्लिक करें
• जहां widget add करना हो वहां + Add a Gadget पर क्लिक करे
• अब HTML/JavaScript option को select करें
• नीचे दिया गया code copy करें और HTML/JavaScript content box में paste कर दें:

<!-- ✅ Stylish Recent Posts Widget Without Image & Date -->
<style>
.recent-posts-widget {
  font-family: 'Segoe UI', sans-serif;
  background: #fff;
  border: 1px solid #ddd;
  border-radius: 12px;
  padding: 15px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.05);
}
.recent-posts-widget h3 {
  font-size: 20px;
  margin-bottom: 15px;
  color: #333;
  text-align: center;
}
.recent-posts-list {
  list-style: none;
  padding: 0;
  margin: 0;
  counter-reset: postCount;
}
.recent-posts-list li {
  counter-increment: postCount;
  padding: 10px;
  margin-bottom: 10px;
  border-bottom: 1px dashed #eee;
  position: relative;
  padding-left: 30px;
}
.recent-posts-list li::before {
  content: counter(postCount) ".";
  position: absolute;
  left: 0;
  top: 10px;
  font-weight: bold;
  color: #1a73e8;
}
.recent-posts-info a {
  color: #1a73e8;
  font-weight: bold;
  font-size: 14px;
  text-decoration: none;
}
.recent-posts-info a:hover {
  text-decoration: underline;
}
</style>
<div class="recent-posts-widget">
  <h3>📝 Recent Posts</h3>
  <ul class="recent-posts-list" id="recent-posts-container"></ul>
</div>
<script>
  fetch('/feeds/posts/default?alt=json&max-results=5')
    .then(response => response.json())
    .then(data => {
      const container = document.getElementById('recent-posts-container');
      const posts = data.feed.entry;
      posts.forEach(post => {
        const title = post.title.$t;
        const url = post.link.find(l => l.rel === 'alternate').href;
        const li = document.createElement('li');
        li.innerHTML = `
          <div class="recent-posts-info">
            <a href="${url}" title="${title}">${title}</a>
          </div>
        `;
        container.appendChild(li);
      });
    });
</script>

1. HTML/JavaScript widget ko Save करें
2. Uske baad Layout settings bhi Save करें
3. Ab apna blog refresh करें

अब आपके Blogger Blog में Without Image Recent Posts Widget successfully add ho chuka hoga.