Visualização de PDFs no WordPress

Ao adicionar uma mídia no formato PDF, o WordPress insere um texto com link para baixar o arquivo ou visualizar seu conteúdo, se o navegador do usuário assim permitir. Para exibir seu conteúdo diretamente no post, de modo incorporado (embeded), é necessário fazer uso de um plugin ou de código com ativação de terceiros, como o Slideshare.

O Slideshare é uma plataforma que hospeda os arquivos PDF/PPT de apresentações de slides, permitindo sua exibição diretamente por lá ou incorporado ao seu site através de uma tag “iframe”. Também possui uma rede social de usuários, já que todos que querem subir arquivos por lá ou interagirem com outros publicadores (para curtir publicações e seguir usuários) precisam abrir uma conta.

É uma boa plataforma com muitos recursos, mas o conteúdo fica “preso” na plataforma. Até 2017, existia a possibilidade de fazer um “re-upload” do arquivo, para fazer uma atualização, mas esse recurso deixou de estar disponível – sé se jogar fora o antigo e subir de novo como uma nova apresentação.

Tags iframe e object

Você pode manter os arquivos PDF no seu site hospedando-os com seu site. Além disso, a visualização de seu conteúdo incorporada à página pode ser feita através de tags HTML. As mais utilizadas e com maior compatibilidade entre os navegadores são as tags “iframe” e “object”, com as seguintes sintaxes:

Uma tag pode ser usada dentro da outra, garantindo ainda mais compatibilidade. Mais algumas opções podem ser consideradas e incluídas através do code generator do site PDF object – mas que geralmente são ignoradas pelos interpretadores padrão de Java Script dos browsers. O texto dentro da tag é opcional, para o caso do navegador não ter suporte para fazer a exibição do PDF. E esse é um ponto fraco desse método: a dependência do navegador.

Plugins

Os plugins do WordPress também permitem manter os arquivos no seu site, com a visualização direto no post. Cada um tem vantagens e desvantagens. Veja alguns exemplos dos mais usados:

Simple PDF Viewer: inclusão através de shortcode, usa o Google Document Viewer. Tem um menu de opções na parte “configurações” para incluir ou não um botão de download (embaixo e imenso) e largura/altura da janela do documento (ou usar 100%). Os controles de avanço/retrocesso de páginas, zoom e botão para expandir para tela cheia aparecem ao movimentar o mouse sobre o conteúdo (ou bater com um dedo uma vez).

PDF Embedder: inclusão através de code shortcode. Tem um menu de opções na parte “configurações” para alterar largura/altura da janela do documento (ou usar 100%) e a posição do menu de controle (outras opções só na versão paga). Os controles de avanço/retrocesso de páginas, zoom e botão para expandir para tela cheia podem aparecer embaixo ou em cima do documento.

PDFjs Viewer: inclusão através de shortcode, usa a biblioteca PDF.js viewer do Mozilla. Sua visualização pode não ser tão bonita quanto dos outros plugins, sendo bem carregada, mas é bem completa, com controles de avanço/retrocesso de páginas, zoom e botão para expandir para tela cheia. Também posui menu lateral com miniatura de slides e outras opções.

Para incluir o PDF, use o botão “Add PDF” no alto do modo de edição de post/página. As definições de altura e largura (em px ou %) e a inclusão de algumas opções acontecem diretamente pelo shortcode, conforme segue o exemplo (entre colchetes):

O parâmetro “fullscreen” somente faz aparecer um link em cima para exibir o PDF com os controle ocupando a guia toda. No menu lateral direito, aparecem as opções de modo tela cheia, download (ou não), impressão (ou não) e outros.

Observação: para converter seu arquivo de apresentação (ODP, PPT, PPTX, etc) para PDF, o conversor padrão do Libre Office faz uma boa compressão das imagens sem perda de qualidade. Para outras opções, veja o post Criando arquivos PDF.