Ver documentos de Word, Excel, Powerpoint y PDF en tu web

visualizador office online

A WordPress puedes subir cualquier tipo de archivo de Word, Excel, Powerpoint o ficheros PDF y luego enlazarlos para que tus visitantes puedan verlos o descargarlos pero ¿y si ofrecemos verlos directamente en nuestra web?

No me refiero a ofrecer un enlace que lleve al previsualizador de Google Docs, que eso ya lo vimos, sino incrustar directamente el documento en nuestra web, dentro de una entrada o página.

Hay varias maneras de conseguirlo, y una de las más inmediatas es usar la tecnología de Google Drive, en concreto su script de previsualización, para hacerlo. El proceso es muy sencillo.

Abre tu plugin de funciones o archivo functions.php y añade el siguiente código:

//Ver documentos inline
function verdoc($attr, $content) {
return '<iframe src="http://docs.google.com/gview?url='.$attr['href'] .'&embedded=true" style="width:550px; height:650px;" frameborder="0"></iframe>';
}
add_shortcode('verdoc', 'verdoc');

Lo único que tienes que personalizar de este código son los parámetros widht y height, para que se ajusten al ancho de tu tema WordPress, que en el ejemplo están puestos a 550 y 650, los de mi blog personal.

Con este paso hemos creado un shortcode, que podremos usar en nuestro editor de WordPress para mostrar – incrustados – todos los formatos de documento que el visualizador de Google Drive puede mostrar, o sea: PDF, DOC, XLS, PPT, PPS, etc.

Para mostrar un documento solo tenemos que usar el shortcode de este modo:

[verdoc href="http://midominio.es/nombre_del_archivo.doc"]

Y lo que obtenemos es que nuestros visitantes puedan ver directamente el documento en nuestra web …

ver documento incrustado en wordpress

Si, ya sé, alguno ya está pensando eso de «Vale Fernando, mola mucho pero ¿no hay un plugin que haga lo mismo?, que a mi me da dentera tocar código«.

Pues si, para los más miedicas hay un plugin estupendo llamado Google doc embedder que viene a hacer lo mismo.

Como en el código anterior, ofrece un shortcode, en este caso del tipo [gview href="http://midominio.es/nombre_del_archivo.doc"], pero para facilitar más las cosas también tienes un botón en el editor visual que lo hace aún más sencillo de usar.

VALORA Y COMPARTE ESTE ARTÍCULO PARA MEJORAR LA CALIDAD DEL BLOG…
(7 votos, promedio: 3.6)

¿Te gustó este artículo? ¡Ni te imaginas lo que te estás perdiendo en YouTube!

AVISO: Esta publicación es de hace 3 años o más. Si es un código o un plugin podría no funcionar en las últimas versiones de WordPress, y si es una noticia podría estar ya obsoleta. Luego no digas que no te hemos avisado.

13 comentarios en “Ver documentos de Word, Excel, Powerpoint y PDF en tu web”

  1. Buenas, he implementado el código en mi wp y funciona perfectamente, el único problema es que siempre me dice el mismo error y es que no localiza el archivo. He inspeccionado el elemento y la variable $attr no aloja nada ) a pesar de que en el shortcode si inserto una dirección. Una solución que he encontrado es cambiando parte del código, modificando la llamada $attr[«href»] por $attr[«src»] y en el shortcode tambien [verdoc src=»…»]

  2. Que tal Fernando, pensé que sería una nueva alternativa a la de utilizar google drive, ya que anteriormente publiqué un shortcode parecido, sin embargo parece que el usuario debe iniciar sesión en google par apoder ver los documentos, no se si coon este método se soluciona eso ya que no todos tienen cuenta en gmail.
    Estoy haciando una variante para mostrar mis documentos subidos con un custom field para que se muestre el documento únicamente a los usuarios registrados.
    PD. Sabes de alguna función que se pueda utilizar para mostrar los documentos con un sistema como el de scribd que me parece mucho mejor que el de google?. Pero tomando los archivos subidos a tu host, o al menos si conoces algún script libre o pago para tal acción.
    Muchas gracias.

    1. PD. EL enlace donde indicas a no ofrecer un enlace que lleve al previsualizador de Google Docs, es el tuto que publiqué anteriormente, ese shortcode lo que hace es incrustar directamente el documento en nuestra web para poder visualizarlo utilizando el sistema de google y «a la vez» nos brinda el enlace de descarga del documento desde nuestro hosting, en ningún momento muestra únicamente un enlace para previsualizarlo en google docs. El motivo de mostrar un enlace de descarga además de incrustarlo se debe a que el visualizador no permitía descargar el documento.

  3. SlideOnline.com

    Hola, tengo dos cosas para comentar/preguntar.

    En primer lugar, en algunas ocasiones dependiendo del formato de la URL, sería bueno encapsular con urlencode el valor de href, para evitar que se deforme.

    En segundo lugar, me gustaría escuchar su opinión si esta funcionalidad les sirve, ya que en estoy evaluando la posibilidad de ofrecer algo del estilo pero utilizando el player que tenemos en el sitio. Me gustaría saber qué opinan. Tenemos un plugin para WordPress pero previamente el usuario necesita haber subido la presentación. De esta manera la PPT puede estar alojada en cualquier servidor externo. Qué opinan?

  4. No me gusta, esta solución te obliga a alojar los documentos en Google Drive para luego poder visualizarlos

  5. Felipe Sebastian Rios Barraza

    Hola, yo instale el plugin pero las imagenes de los pdf no se ven correctamente, no se visualizan todos los colores, como si tuvieran una calidad de imagenes de 8bits, me podrian explicar cual podria ser el problema?, gracias.

  6. Hola, tengo instalado este plugging, y he cargado un pdf de 13 megas gracias al pluggin Add from server. Pero al subir este archivo de 13 megas solo me da la opción de descargarlo, no se puede ver.. pero con otro archivo de 8 megas, subido de la forma tradicional, si se ve.. ¿Sabes que puede estar pasando?

    Gracias!!

  7. Buenas, yo estoy tratando de pre visualizar en mi página, pero en una nueva pestaña, un documento tipo word, pero lo descarga directamente, alguien podría ayudarme con este problema?

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

 

Ir arriba Ir al contenido