{"id":609,"date":"2011-12-28T12:39:07","date_gmt":"2011-12-28T11:39:07","guid":{"rendered":"http:\/\/canaltic.com\/blog\/?p=609"},"modified":"2017-06-05T16:23:16","modified_gmt":"2017-06-05T15:23:16","slug":"flexpaper","status":"publish","type":"post","link":"https:\/\/canaltic.com\/blog\/?p=609","title":{"rendered":"FlexPaper"},"content":{"rendered":"<p><strong>FlexPaper<\/strong> es un visor de documentos PDF que se integra f\u00e1cilmente en una p\u00e1gina web. El cliente puede hojear el documento desde la misma p\u00e1gina web y sin tener instalado ning\u00fan programa espec\u00edfico para leerlo (Adobe Reader, Sumatra PDF, Foxit PDF Reader, etc). S\u00f3lo necesita disponer de un navegador web con el plugin de Flash Player. Esta soluci\u00f3n se puede utilizar de forma gratuita en iniciativas no comerciales con licencia GNU GPL. Descarga FlexPaper, sube a tu espacio web el visor y el documento, ambos en formato *.SWF, e ins\u00e9rtalo en el c\u00f3digo HTML de tu p\u00e1gina web.<\/p>\n<p><a class=\"thickbox\" title=\"FlexPaper\" href=\"http:\/\/canaltic.com\/blog\/html\/flexpaper\/fp.html?KeepThis=false&amp;TB_iframe=false&amp;height=490&amp;width=670\">Ver demo de FlexPaper<\/a><\/p>\n<h2>\u00a0Caracter\u00edsticas<\/h2>\n<ul>\n<li>FlexPaper proporciona una f\u00e1cil integraci\u00f3n de un documento PDF en cualquier p\u00e1gina web.<\/li>\n<li>Ofrece al usuario una barra de control que facilita la navegaci\u00f3n por las p\u00e1ginas del mismo.<\/li>\n<li>Admite realizar b\u00fasquedas de t\u00e9rminos en todo el documento.<\/li>\n<li>Se puede mostrar en modo \u201cpantalla completa\u201d y con diferentes zooms para facilitar su utilizaci\u00f3n en una pizarra digital.<\/li>\n<li>Es una alternativa para incorporar un documento PDF a una web local, es decir, sin acceso a Internet o cuando se estime conveniente no depender de un servicio de publicaci\u00f3n de documentos en l\u00ednea como <a title=\"Scribd.com\" href=\"hhttp:\/\/es.scribd.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Scribd.com<\/a>, <a title=\"Issuu.com\" href=\"http:\/\/issuu.com\/\" target=\"_blank\" rel=\"noopener noreferrer\">Issuu.com<\/a> , etc<\/li>\n<\/ul>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-615\" title=\"FlexPaper\" src=\"http:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper1.jpg\" alt=\"\" width=\"400\" height=\"100\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper1.jpg 400w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper1-300x75.jpg 300w\" sizes=\"auto, (max-width: 400px) 100vw, 400px\" \/><\/p>\n<h2>Instrucciones<\/h2>\n<p><strong>Paso 1. Crear el documento PDF<\/strong><\/p>\n<p>El proceso puede iniciarse a partir de un documento PDF que ya tengamos o bien generarlo partiendo de un documento de texto o presentaci\u00f3n de diapositivas. En este \u00faltimo caso se puede utilizar <a title=\"PDF Creator\" href=\"http:\/\/sourceforge.net\/projects\/pdfcreator\/\" target=\"_blank\" rel=\"noopener noreferrer\">PDFCreator<\/a>.<\/p>\n<ol>\n<li>Descarga e instala este programa.<\/li>\n<li>Desde el procesador de textos o de presentaciones donde tengas abierto el documento editable selecciona <strong>Archivo &gt; Imprimir<\/strong>.<\/li>\n<li>En el cuadro de di\u00e1logo <strong>Imprimir<\/strong> selecciona la impresora virtual de <strong>PDFCreator<\/strong> y haz clic en <strong>Aceptar<\/strong>.<\/li>\n<li>Introduce los metadatos y el nombre del archivo del documento final para obtener el archivo buscado.<\/li>\n<li>Si deseas experimentar directamente con FlexPaper puedes descargar este documento en formato PDF: <a title=\"Documento en formato PDF\" href=\"http:\/\/canaltic.com\/blog\/html\/flexpaper\/zip\/Paper_PDF.zip\">Paper_PDF.zip<\/a><\/li>\n<\/ol>\n<p><strong>Paso 2. Transformaci\u00f3n del documento PDF a SWF<\/strong><\/p>\n<p>FlexPaper no trabaja directamente con el archivo PDF sino que utiliza un archivo SWF resultado de una transformaci\u00f3n previa. Existen m\u00faltiples programas que realizan esta conversi\u00f3n pero en este caso se propone utilizar el software gratuito <a title=\"SWFTools\" href=\"http:\/\/www.swftools.org\/download.html\" target=\"_blank\" rel=\"noopener noreferrer\">SWFTools<\/a>.<\/p>\n<ol>\n<li>Inicia el programa <strong>SWFTools<\/strong>.<\/li>\n<li>Configura las opciones del formato de exportaci\u00f3n mediante: <strong>Edit &gt; Options &gt; Viewer &gt; No Viewer<\/strong> (Editar &gt; Opciones &gt; Visor &gt; No Visor) y <strong>Edit &gt; Options &gt; Quality &gt; Insert full fonts in SWF file &gt; yes<\/strong> (Editar &gt; Opciones &gt; Calidad &gt; Insertar fuentes completas en el archivo SWF &gt; s\u00ed).<\/li>\n<li>Abre el documento mediante <strong>File &gt; Open PDF<\/strong> (Archivo &gt; Abrir PDF) para localizar el PDF a transformar.<\/li>\n<li>Selecciona <strong>File &gt; Save as PDF &gt; All pages<\/strong> (Archivo &gt; Guardar como PDF &gt; Todas las p\u00e1ginas).<\/li>\n<li>Define la carpeta y nombre del SWF final. Clic en el bot\u00f3n <strong>Guardar<\/strong>. Al cabo de unos instantes ya dispondremos del archivo SWF con la informaci\u00f3n del PDF original.<\/li>\n<li>Si deseas experimentar directamente con FlexPaper puedes descargar esta presentaci\u00f3n en formato SWF: <a title=\"Documento en formato SWF\" href=\"http:\/\/canaltic.com\/blog\/html\/flexpaper\/zip\/Paper_SWF.zip\">Paper_SWF.zip<\/a><\/li>\n<\/ol>\n<p><strong>Paso 3. Conseguir el visor de FlexPaper<\/strong><\/p>\n<p>Descarga y descomprime el archivo <a title=\"FlexPaper 1.4.7\" href=\"http:\/\/canaltic.com\/blog\/html\/flexpaper\/zip\/flexpaper_1.4.7.zip\">flexpaper_1.4.7.zip<\/a>. Como resultado obtendr\u00e1s el visor <strong>FlexPaperViewer.swf<\/strong>.<\/p>\n<p>Esta soluci\u00f3n se ofrece de forma gratuita en el sitio web del proyecto <a title=\"Sitio web oficial de FlexPaper\" href=\"http:\/\/code.google.com\/p\/flexpaper\/downloads\" target=\"_blank\" rel=\"noopener noreferrer\">FlashPaper<\/a>. Puedes consultar este sitio para comprobar si existe una versi\u00f3n m\u00e1s actualizada. En el ZIP que se proporciona en la web oficial para ver la demo en local descomprime el archivo y haz doble clic sobre el fichero <strong>index.html<\/strong>. Si no se carga el documento de prueba en el visor quiz\u00e1s se deba a que es necesario configurar las <strong>restricciones de seguridad de almacenamiento local de Flash Player<\/strong>. Para ello haz clic derecho sobre la ventana de Flex Paper y elige <strong>Configuraci\u00f3n avanzada<\/strong>. En la pesta\u00f1a <strong>Avanzado<\/strong> pulsa en el bot\u00f3n C<strong>onfiguraci\u00f3n de ubicaci\u00f3n de confianza<\/strong>. Clic en el bot\u00f3n <strong>A\u00f1adir<\/strong> para incorporar la carpeta del equipo donde se est\u00e1 ejecutando la aplicaci\u00f3n. Es necesario reiniciar el navegador web para recoger los cambios.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-617\" title=\"FlexPaper\" src=\"http:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper3.jpg\" alt=\"\" width=\"400\" height=\"100\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper3.jpg 400w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper3-300x75.jpg 300w\" sizes=\"auto, (max-width: 400px) 100vw, 400px\" \/><\/p>\n<p><strong>Paso 4. Subir los archivos al servidor<\/strong><\/p>\n<p>Sube el visor <strong>FlexPaperViewer.swf<\/strong> y el documento <strong>Paper.swf<\/strong> a tu sitio web. Puede optar por utilizar una de estas alternativas que se sugieren:<\/p>\n<p><strong>Sitio web personal<\/strong>. Puedes crear una carpeta en tu espacio web personal y subir a \u00e9l estos dos archivos. Copia la URL de ambos. Ejemplo:<\/p>\n<blockquote><p><strong>Visor<\/strong>: http:\/\/canaltic.com\/&lt;nombre_carpeta&gt;\/FlexPaperViewer.swf<strong><br \/>\nDocumento<\/strong>: http:\/\/canaltic.com\/&lt;nombre_carpeta&gt;\/Paper.swf<\/p><\/blockquote>\n<p><strong>Google Sites<\/strong>. Si dispones de cuenta en Google, puedes acceder a Google Sites y crear un sitio y dentro del mismo crear una carpeta. Sube ambos archivos a la misma y luego haz clic en el enlace \u201cVer\u201d del archivo SWF que acabas de subir. Copia y pega en un bloc de notas la direcci\u00f3n que se muestra en la barra de direcciones del navegador. Es una direcci\u00f3n compleja donde debes eliminar el c\u00f3digo final a partir de \u201cFlexPaperViewer.swf\u201d. Obt\u00e9n la direcci\u00f3n del archivo con la presentaci\u00f3n sustituyendo simplemente en la URL anterior el nombre del archivo. Ejemplo:<\/p>\n<blockquote><p>Visor: https:\/\/&lt;codigo_alfanumerico&gt;\/site\/&lt;nombre_sitio&gt;\/&lt;nombre_carpeta&gt;\/FlexPaperViewer.swf<br \/>\nDocumento: https:\/\/&lt;codigo_alfanumerico&gt;\/site\/&lt;nombre_sitio&gt;\/&lt;nombre_carpeta&gt;\/Paper.swf<\/p><\/blockquote>\n<p><strong>DropBox<\/strong>. Si dispones de cuenta en DropBox, crea una carpeta en Public y dentro de esa carpeta sube ambos archivos. Desde el explorador de archivos del sistema windows haz clic derecho sobre cada archivo subido para elegir DropBox &gt; Copiar enlace p\u00fablico. Desde el interfaz web de Dropbox haz clic sobre el archivo y elige Copiar enlace p\u00fablico. Ejemplo:<\/p>\n<blockquote><p>Visor: http:\/\/dl.dropbox.com\/u\/&lt;numeros&gt;\/&lt;nombre_carpeta&gt;\/FlexPaperViewer.swf<br \/>\nDocumento: http:\/\/dl.dropbox.com\/u\/&lt;numeros&gt;\/&lt;nombre_carpeta&gt;\/Paper.swf<\/p><\/blockquote>\n<p><strong>Paso 5. Generar el c\u00f3digo HTML embed<\/strong><\/p>\n<p>En <a title=\"canalTIC\" href=\"http:\/\/canaltic.com\/blog\" target=\"_blank\" rel=\"noopener noreferrer\">canalTIC.com<\/a> se ha dise\u00f1ado un asistente que facilita la generaci\u00f3n del c\u00f3digo embed para la integraci\u00f3n de este visor:<\/p>\n<p><a class=\"thickbox\" title=\"Configurador de FlexPaper\" href=\"http:\/\/canaltic.com\/blog\/html\/flexpaper\/index.html?KeepThis=true&amp;TB_iframe=true&amp;height=500&amp;width=1015\">Configurador de FlexPaper<\/a><\/p>\n<p>En el asistente elegido despliega el combo <strong>Modelos de configuraci\u00f3n<\/strong> y selecciona una opci\u00f3n. En la secci\u00f3n de <strong>Vista previa<\/strong> se mostrar\u00e1 el aspecto que tendr\u00e1 el visor con esa configuraci\u00f3n. En los cuadros de texto: <strong>URL visor SWF<\/strong> y <strong>URL documento SWF<\/strong> sustituye esto valores por las direcciones de estos archivos alojados en tu espacio web. Cada modelo de configuraci\u00f3n define ciertos valores para algunos de los par\u00e1metros b\u00e1sicos y avanzados. Cuando hayas elegido un modelo es posible modificar manualmente el valor de todos los par\u00e1metros ofrecidos en el asistente. Para que el <strong>c\u00f3digo embed<\/strong> pille los cambios introducidos no olvides al final hacer clic en el enlace\u00a0<strong>recargar reproductor<\/strong>. Si todo va bien el reproductor se mostrar\u00e1 con la configuraci\u00f3n definida en el apartado vista previa.<\/p>\n<p><strong>\u00a0Paso 6. Copiar y pegar el c\u00f3digo HTML<\/strong><\/p>\n<p>Para concluir es necesario copiar y pegar el fragmento resultante de c\u00f3digo HTML en el c\u00f3digo de tu p\u00e1gina web.<\/p>\n<p><img loading=\"lazy\" decoding=\"async\" class=\"alignnone size-full wp-image-616\" title=\"FlexPaper\" src=\"http:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper2.jpg\" alt=\"\" width=\"400\" height=\"100\" srcset=\"https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper2.jpg 400w, https:\/\/canaltic.com\/blog\/wp-content\/uploads\/2011\/12\/flexPaper2-300x75.jpg 300w\" sizes=\"auto, (max-width: 400px) 100vw, 400px\" \/><\/p>\n<h2>\u00a0Descargas<\/h2>\n<ul>\n<li><a title=\"FlexPaper 1.4.7\" href=\"http:\/\/canaltic.com\/blog\/html\/flexpaper\/zip\/flexpaper_1.4.7.zip\">Visor de FlexPaper_1.4.7<\/a><\/li>\n<li><a title=\"Documento en formato PDF\" href=\"http:\/\/canaltic.com\/blog\/html\/flexpaper\/zip\/Paper_PDF.zip\">Documento en formato PDF<\/a><\/li>\n<li><a title=\"Documento en formato SWF\" href=\"http:\/\/canaltic.com\/blog\/html\/flexpaper\/zip\/Paper_SWF.zip\">Documento en formato SWF<\/a><\/li>\n<li><a title=\"Sitio web oficial de FlexPaper\" href=\"http:\/\/code.google.com\/p\/flexpaper\/downloads\" target=\"_blank\" rel=\"noopener noreferrer\">Sitio web oficial de FlexPaper<\/a><\/li>\n<\/ul>\n","protected":false},"excerpt":{"rendered":"<p>FlexPaper es un visor de documentos PDF que se integra f\u00e1cilmente en una p\u00e1gina web. El cliente puede hojear el documento desde la misma p\u00e1gina web y sin tener instalado ning\u00fan programa espec\u00edfico para leerlo (Adobe Reader, Sumatra PDF, Foxit PDF Reader, etc). S\u00f3lo necesita disponer de un navegador web con el plugin de Flash [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":614,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[16,91],"tags":[27],"class_list":["post-609","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-aplicaciones-web","category-multimedia","tag-flash"],"_links":{"self":[{"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/609","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=609"}],"version-history":[{"count":23,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/609\/revisions"}],"predecessor-version":[{"id":2845,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/posts\/609\/revisions\/2845"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=\/wp\/v2\/media\/614"}],"wp:attachment":[{"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=609"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=609"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/canaltic.com\/blog\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=609"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}