Ejemplo: Cómo mostrar presentaciones y PDFs

Este post demuestra diferentes formas de mostrar documentos y presentaciones en tus artículos.

1. PDF embebido con iframe

Puedes embeber un PDF directamente en el post. Coloca tu PDF en public/documentos/ y usa:

Para usar tu propio PDF:

1. Coloca tu archivo PDF en public/documentos/presentacion.pdf
2. Cambia src="/documentos/presentacion-ejemplo.html" por src="/documentos/presentacion.pdf"

2. Enlace de descarga

También puedes ofrecer un enlace directo para descargar o abrir en nueva pestaña:

3. Google Slides embebido

Para embeber una presentación de Google Slides:

1. Abre tu presentación en Google Slides
2. Ve a Archivo → Compartir → Publicar en la web
3. Selecciona la pestaña Insertar y copia el código iframe
4. Pégalo en tu post:

4. SlideShare embebido

Para presentaciones de SlideShare:

<iframe 
  src="//www.slideshare.net/slideshow/embed_code/key/TUCODIGO" 
  width="100%" 
  height="485"
  frameborder="0" 
  marginwidth="0" 
  marginheight="0" 
  scrolling="no"
  allowfullscreen>
</iframe>

5. Imágenes de diapositivas

Si prefieres mostrar capturas de pantalla de tu presentación:

Código de ejemplo

El código para embeber un PDF es simple:

<iframe 
  src="/documentos/tu-archivo.pdf" 
  width="100%" 
  height="600"
  style="border: 2px solid #e5e7eb; border-radius: 0.5rem;">
</iframe>

Consejos

• PDFs: Coloca los archivos en public/documentos/ para que sean accesibles
• Peso: Optimiza tus PDFs para web (< 5MB recomendado)
• Móvil: Los iframes funcionan bien en móvil, pero considera ofrecer también un enlace de descarga
• Privacidad: Para Google Slides, asegúrate de configurar los permisos de compartición adecuadamente

---

Estructura de archivos recomendada:

public/
  documentos/
    presentacion-ejemplo.pdf
    otro-documento.pdf
  images/
    diagrama1.png
    diagrama2.png