Calificación:
  • 0 voto(s) - 0 Media
  • 1
  • 2
  • 3
  • 4
  • 5
Mostrar PDF's alojados en Box en WordPress
#1
o muchos sabéis he tenido que pelear bastante para poder obtener un servicio gratuito de alojamiento de archivos en PDF (en mi web de buses manejo cientos de archivos de esta forma), que pueda mostrar online sin tener que realizar descargas.

Ayer el compañero idumaya del foro me preguntaba sobre alguna forma sencilla de hacerlo y le comenté de Box y me preguntó si podía explicarle el proceso.

Así que de eso trata este tutorial, voy a explicar cómo tener archivos PDF embebidos, que alojaremos en el servicio gratuito BOX y mostraremos embebidos en nuestro gestor de contenidos favorito, el poderoso WORDPRESS.

Espero que os guste.

PASO 1 . -

Lo primero es tener una cuenta gratuita en BOX.COM

Si todavía no tienes una cuenta ingresa al sitio web de box.com y registra tu cuenta.

La versión gratuita tiene sus limitaciones, lógicamente, aunque más adelante mostraré cómo es posible optimizar el ancho de banda.Durante el registro escoge la opción PERSONAL para poder acceder a una cuenta gratuita.

La opción gratuita te posibilita tener
  • 10 GB de almacenamiento

  • 250 MB de tamaño máximo de archivo

  • Y está limitado en el ancho de banda a consumir - máximo 10 gigas por mes (si te excedes los archivos quedarán bloqueados hasta el próximo mes)

Rellena el formulario de registro y, si es necesario, confirma tu cuenta


Si ya tienes una cuenta, SIMPLEMENTE INGRESA A ELLA CON TUS DATOS HABITUALES







PASO 2 . -

Una vez creada tu cuenta (o si ya tienes una cuenta disponible) iniciamos sesión con nuestros datos, haciendo clic en el botón correspondiente (Iniciar Sesión).







PASO 3 . -

Ya dentro de BOX tendremos acceso a nuestra plataforma para gestionar la subida/bajada de archivos.

Lo recomendable en estos momentos sería crear una carpeta para poder tener la información organizada.

Para crear una carpeta nueva haz clic en NEW y escoges FOLDER

[Imagen: 74851d1459958281-mostrar-pdfs-alojados-b...aso003.jpg]

En mi caso voy a denominarla MI PDF PARA WORDPRESS


El resto de opciones podemos dejarlas tal cual (puedes investigar más sobre esas opciones en los foros de Box).

Hacemos clic en OKAY





PASO 3 . -

Ahora deberíamos tener nuestra carpeta ya lista para poder ser utilizada.

[Imagen: 74854d1459958479-mostrar-pdfs-alojados-b...aso004.jpg]

Hacemos clic sobre ella para poder ingresar a su interior.

Nos aparecerán varias opciones, la que nos interesa es subir un archivo.

Podemos arrastrar el archivo o abrir el cuadro de diálogo de subida haciendo clic sobre el primer cuadro.

[Imagen: 74857d1459958666-mostrar-pdfs-alojados-b...so004c.jpg]





PASO 4 . -

¿Ya tienes tu archivo subido? Espero que sí.

En mi caso he subido un archivo llamado PROPOSAL. 

[Imagen: 74858d1459958828-mostrar-pdfs-alojados-b...aso005.jpg]





PASO 5 . -

Hacemos clic en el botón con [...] al lado del nombre del archivo para que se desplieguen las nuevas opciones para el archivo

[Imagen: 74859d1459959136-mostrar-pdfs-alojados-b...so005b.jpg]

De estas opciones vamos a escoger la siguiente

SHARING > EMBED WIDGET

[Imagen: 74860d1459959218-mostrar-pdfs-alojados-b...so005c.jpg]





PASO 6 . -

Una vez escogida la opción EMBED WIDGET se abrirá una ventana de configuración.

Configuramos el WIDGET A NUESTRO GUSTO.

[Imagen: 74861d1459959586-mostrar-pdfs-alojados-b...so005d.jpg]

En la parte inferior tienes una opción para poder previsualizar cómo va quedando el widget (se abrirá en una nueva ventana).



Una vez ya satisfecho con la configuración COPIAMOS EL CÓDIGO desde donde dice EMBED CODE

[Imagen: 74864d1459959777-mostrar-pdfs-alojados-b...so005f.jpg]





PASO 7 . -

A continuación nos dirigimos a nuestro sitio web en WordPress.

Iniciamos sesión en nuestro sitio y nos dirigimos (o creamos) al post y/o página donde queremos insertar nuestro widget.

[Imagen: 74865d1459959907-mostrar-pdfs-alojados-b...aso006.jpg]

En mi caso voy a crear una entrada de ejemplo

[Imagen: 74866d1459959987-mostrar-pdfs-alojados-b...aso007.jpg]

A continuación hacemos clic en la opción PARA EDITAR CÓDIGO COMO TEXTO

[Imagen: 74867d1459960083-mostrar-pdfs-alojados-b...aso008.jpg]






PASO 8 . -

¿Recuerdas el código que habíamos copiado en BOX?

Pues simplemente lo copiamos en WordPress

[Imagen: 74868d1459960177-mostrar-pdfs-alojados-b...aso009.jpg]

Una vez pegado el código puedes volver al modo normal de edición en WordPress, debería aparecer una caja mostrando la zona donde quedará ubicado el visor de PDF

[Imagen: 74869d1459960305-mostrar-pdfs-alojados-b...aso010.jpg]

Ahora ya podemos guardar/actualizar la página/post y lanzarlo en el navegador.

[Imagen: 74870d1459960464-mostrar-pdfs-alojados-b...so010a.jpg]






PASO 9 . - OPCIONAL - PARA AHORRAR ANCHO DE BANDA

Como comenté al inicio, Box ofrece un ancho de banda que será suficiente para la mayoría de usuarios con sitios web pequeños-medianos.

Sin embargo, si quieres mantener tu ancho de banda algo más controlado puedes evitar que los usuarios descarguen los archivos pero que sí puedan visualizarlos.

Para ello sigue los siguientes pasos

Haz clic en el botón SHARED

[Imagen: 74871d1459960754-mostrar-pdfs-alojados-b..._new01.jpg]

Aparecerá una ventana como la siguiente

[Imagen: 74872d1459960799-mostrar-pdfs-alojados-b..._new02.jpg]

Hacemos clic en el engranaje que se muestra en la ventanita

[Imagen: 74873d1459960855-mostrar-pdfs-alojados-b..._new03.jpg]

Se abrirán nuevas opciones después de unos segundos

[Imagen: 74874d1459960900-mostrar-pdfs-alojados-b..._new04.jpg]

De estas opciones la que nos interesa es la última.

[Imagen: 74875d1459960956-mostrar-pdfs-alojados-b..._new05.jpg]

ALLOW DOWNLOAD

Al desactivarla los USUARIOS PODRÁN VER EL ARCHIVO PERO NO DESCARGARLO con lo que nos ahorramos una buena parte del ancho de banda.

[Imagen: 74876d1459961074-mostrar-pdfs-alojados-b..._new06.jpg]





Espero que os haya gustado.

No manejo mucho Box pero si tenéis alguna duda con gusto intento resolverla. Mejor con mención a mi nick para poder responder lo antes posible.

Gracias por haberlo revisado.
#2
Interesante aporte, muy bueno. Lo añado a mis favoritos por si algún día me hace falta colgar un pdf. Gracias por tu tutorial.
I'm back! 


Posibles temas similares...
Tema Autor Respuestas Vistas Último mensaje
Bombilla Temas Wordpress GRATIS calidad PREMIUM nicarao 9 262 03-10-2018, 05:44 PM
Último mensaje: DamianUzcanga
  100 Temas WordPress Gratis 2018 (Parte 5) Sprystate 1 102 07-09-2018, 01:10 PM
Último mensaje: York0x
  100 Temas WordPress Gratis 2018 (Parte 4) Sprystate 0 58 06-09-2018, 10:54 PM
Último mensaje: Sprystate
  100 Temas WordPress Gratis 2018 (Parte 3) Sprystate 0 71 06-09-2018, 10:19 PM
Último mensaje: Sprystate
  100 Temas WordPress Gratis 2018 (Parte 2) Sprystate 1 69 06-09-2018, 10:11 PM
Último mensaje: York0x
  100 Temas WordPress Gratis 2018 (Parte 1) Sprystate 0 68 06-09-2018, 09:29 PM
Último mensaje: Sprystate
  Agregar un anuncio de adsense desde el editor de temas de WordPress cmascreativo.ml 1 55 06-09-2018, 06:20 AM
Último mensaje: jcifuentes
  Top 3 plugins para build wordpress PabloA3 2 81 06-09-2018, 04:37 AM
Último mensaje: jcifuentes
  Mi experiencia con wordpress en producción yuma2009 7 265 03-09-2018, 10:34 PM
Último mensaje: yuma2009
  Como usar el plugin WordPress Popular Posts cmascreativo.ml 1 48 02-09-2018, 08:35 AM
Último mensaje: ReyNexo23



Usuarios navegando en este tema: 1 invitado(s)