<!DOCTYPE html><html lang="es"><head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Entradas de Blogger por etiqueta</title><style> #blogger-entries { display: flex; flex-wrap: wrap; justify-content: space-between; } .entry { flex-basis: calc(50% - 10px); margin-bottom: 20px; border: 1px solid #ccc; padding: 10px; box-shadow: 2px 2px 5px rgba(0,0,0,0.1); } .entry img { width: 100%; height: auto; } .entry .date-author { font-size: 0.8em; color: #888; margin-bottom: 10px; }</style></head><body>
<h1>Entradas de Blogger por etiqueta</h1>
<div id="blogger-entries"></div>
<script>// Cambia 'etiqueta' por la etiqueta que deseas filtrarconst etiqueta = 'etiqueta';const url = `https://tu-blog.blogspot.com/feeds/posts/default/-/${etiqueta}?alt=json`;
fetch(url) .then(response => response.json()) .then(data => { const entries = data.feed.entry; const container = document.getElementById('blogger-entries'); let html = ''; entries.forEach(entry => { const title = entry.title.$t; const link = entry.link.find(link => link.rel === 'alternate').href; const author = entry.author[0].name.$t; const publishedDate = new Date(entry.published.$t).toLocaleDateString('es-ES', { year: 'numeric', month: 'long', day: 'numeric' }); let content = ''; if (entry.content && entry.content.$t) { content = entry.content.$t; } else if (entry.summary && entry.summary.$t) { content = entry.summary.$t; } let imageUrl = ''; const regex = /<img.*?src="(.*?)"/; const match = regex.exec(content); if (match) { imageUrl = match[1]; // Remove the image from the content content = content.replace(regex, ''); } html += `<div class="entry">`; html += `<h2><a href="${link}">${title}</a></h2>`; html += `<div class="date-author">${author} – ${publishedDate}</div>`; if (imageUrl) { html += `<img src="${imageUrl}" alt="${title}">`; } html += `<p>${content}</p>`; html += `</div>`; }); container.innerHTML = html; }) .catch(error => { console.error('Error fetching entries:', error); });</script>
</body></html>
prueba 1
<h1>Entradas de Blogger por etiqueta</h1>
<div id="blogger-entries"></div>
<script>// Cambia 'etiqueta' por la etiqueta que deseas filtrarconst etiqueta = 'etiqueta';const url = `https://tu-blog.blogspot.com/feeds/posts/default/-/${etiqueta}?alt=json`;
fetch(url) .then(response => response.json()) .then(data => { const entries = data.feed.entry; const container = document.getElementById('blogger-entries'); let html = ''; entries.forEach(entry => { const title = entry.title.$t; const link = entry.link.find(link => link.rel === 'alternate').href; const author = entry.author[0].name.$t; const publishedDate = new Date(entry.published.$t).toLocaleDateString('es-ES', { year: 'numeric', month: 'long', day: 'numeric' }); let content = ''; if (entry.content && entry.content.$t) { content = entry.content.$t; } else if (entry.summary && entry.summary.$t) { content = entry.summary.$t; } let imageUrl = ''; const regex = /<img.*?src="(.*?)"/; const match = regex.exec(content); if (match) { imageUrl = match[1]; // Remove the image from the content content = content.replace(regex, ''); } html += `<div class="entry">`; html += `<h2><a href="${link}">${title}</a></h2>`; html += `<div class="date-author">${author} – ${publishedDate}</div>`; if (imageUrl) { html += `<img src="${imageUrl}" alt="${title}">`; } html += `<p>${content}</p>`; html += `</div>`; }); container.innerHTML = html; }) .catch(error => { console.error('Error fetching entries:', error); });</script>
</body></html>
Tags:
portafolio
