TiTo JuanPe media
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 20px;
background-color: #f4f4f4;
}
h1 {
text-align: center;
}
#posts-container {
display: grid;
grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
gap: 20px;
max-width: 1200px;
margin: 0 auto;
}
.post {
text-align: center;
}
.post iframe {
width: 100%;
height: auto;
border: none;
margin-bottom: 10px;
}
.video iframe {
aspect-ratio: 16 / 9;
}
.instagram iframe {
aspect-ratio: 4 / 5;
}
.post a {
text-decoration: none;
color: #007BFF;
}
TiTo JuanPe media
const posts = [
«https://www.instagram.com/p/Bvy-P0EHrXQ/»,
«https://www.instagram.com/p/CQ4Z1SdqkN-/»,
«https://www.instagram.com/p/Cl9Diqetdr4/»,
«https://www.instagram.com/p/CHyUqEOqU65/»,
«https://www.youtube.com/watch?v=GQ04Ef5ppus»,
«https://www.youtube.com/watch?v=9lBGR4cKcIQ»,
«https://www.youtube.com/watch?v=LvG-4uLmnG8»,
«https://www.youtube.com/watch?v=r9T2AQgtbbI»,
«https://www.instagram.com/p/BtWFYIllM15/»,
«https://www.instagram.com/p/BtMOQ6vjSaK/»,
«https://www.instagram.com/p/BfSplVthga0/»,
«https://www.instagram.com/p/BaSHtH2hEKA/»,
«https://www.youtube.com/watch?v=v_R19yOhOa0»,
«https://www.youtube.com/watch?v=ZuanUvWTsVM»,
«https://www.youtube.com/watch?v=J5j9ezlSuLY»,
«https://www.youtube.com/watch?v=rNTyWuUef2Y»,
«https://www.instagram.com/p/BLfoqlCDzUK/»,
«https://www.instagram.com/p/BLE1yzyDC5H/»,
«https://www.instagram.com/p/BSXMwoRBF6Y/»,
«https://www.instagram.com/p/BW-deBHBC30/»,
// Agrega más URLs de Instagram y YouTube aquí
];
function createInstagramPost(url) {
const postDiv = document.createElement(‘div’);
postDiv.className = ‘post instagram’;
const embedUrl = `${url}embed`;
const iframe = document.createElement(‘iframe’);
iframe.src = embedUrl;
iframe.allowTransparency = ‘true’;
iframe.frameBorder = ‘0’;
iframe.scrolling = ‘no’;
iframe.allow = ‘encrypted-media’;
const link = document.createElement(‘a’);
link.href = url;
link.target = ‘_blank’;
link.textContent = ‘Ver en Instagram’;
postDiv.appendChild(iframe);
postDiv.appendChild(link);
return postDiv;
}
function createYouTubePost(url) {
const videoId = url.split(‘v=’)[1];
const embedUrl = `https://www.youtube.com/embed/${videoId}`;
const postDiv = document.createElement(‘div’);
postDiv.className = ‘post video’;
const iframe = document.createElement(‘iframe’);
iframe.src = embedUrl;
iframe.frameBorder = ‘0’;
iframe.allow = ‘accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture’;
iframe.allowFullscreen = true;
const link = document.createElement(‘a’);
link.href = url;
link.target = ‘_blank’;
link.textContent = ‘Ver en YouTube’;
postDiv.appendChild(iframe);
postDiv.appendChild(link);
return postDiv;
}
function createPostElement(url) {
if (url.includes(‘instagram.com’)) {
return createInstagramPost(url);
} else if (url.includes(‘youtube.com’)) {
return createYouTubePost(url);
}
}
const postsContainer = document.getElementById(‘posts-container’);
posts.forEach(url => {
const postElement = createPostElement(url);
postsContainer.appendChild(postElement);
});
innocreatividad 