sexta-feira, 12 de agosto de 2016

FORÇANDO DOWNLOAD NO PHP



Pode acontecer de você ter um site e querer disponibilizar nele o download de certos arquivos — uma música em mp3 ou uma imagem em, por exemplo — e ocorrer que, quando o usuário clicar no link desse arquivo, ao invés de o dispositivo baixá-lo, irá abri-lo, sendo que a pretensão era mesmo o de fornecer o download.

E então, o que fazer?

Simples! Vamos fazer uma função em PHP para forçar o download.

Primeiro, vamos configurar o link disponibilizado para o usuário (por exemplo, na página index.php, a qual o usuário acessa e clica para baixar o arquivo pretendido):

<a href="baixar.php">Iniciar o download</a>

Então, o usuário verá nessa página o link Iniciar o download e ao clicar sobre ele, será remetido para o arquivo baixar.php, que, no caso aqui, está no mesmo diretório.

Então, vamos escrever na página baixar.php a codificação para efetuar o download do arquivo, no nosso exemplo, um livro em PDF (iliada.pdf), que está numa pasta chamada downloads.

<?php
$arquivo = 'iliada.pdf'; // Nome do Arquivo
$local = 'downloads/'; // Pasta que contém os arquivos para download
$local_arquivo = $local.$arquivo; // Concatena diretório e arquivo

if (stripos($arquivo, './') !== false || stripos($arquivo, '../') !== false || !file_exists($local_arquivo)) {  // se há erro, do tipo, arquivo inexistente
  echo 'O comando não pode ser executado.'; // notifica o erro ao usuário
} else { // se não houver erro, prepara o arquivo para ser baixado
  header('Cache-control: private');
  header('Content-Type: application/octet-stream');
  header('Content-Length: '.filesize($local_arquivo));
  header('Content-Disposition: filename='.$arquivo);
  header("Content-Disposition: attachment;  filename=".basename($local_arquivo));
// Envia o arquivo Download
  readfile($local_arquivo);
}
?>

Pronto, o arquivo será baixado pelo usuário ao invés de ser aberto no navegador.

Bom, mas no exemplo dado acima, o arquivo baixar.php só funcionará para o determinado arquivo (iliada.pdf). E quando o site oferece muitos arquivos? É preciso criar um código para cada um, cada qual em um arquivo php próprio?

Não, felizmente! É possível usar a mesma página com a função (no nosso exemplo, baixar.php) para forçar o download de tantos arquivos quanto se queira. Para isso, o link precisará fornecer duas variáveis com os valores para o diretório e nome do arquivo. Além disso, será preciso fazer duas pequenas alterações na função original, ficando assim:

<?php
$arquivo = $_GET['arquivo']; // variável do nome do Arquivo
$local = $_GET['local']// variável do nome da pasta onde está o arquivo para download
$local_arquivo = $local.$arquivo; // Concatena diretório e arquivo

if (stripos($arquivo, './') !== false || stripos($arquivo, '../') !== false || !file_exists($local_arquivo)) {  // se há erro, do tipo, arquivo inexistente
  echo 'O comando não pode ser executado.'; // notifica o erro ao usuário
} else { // se não houver erro, prepara o arquivo para ser baixado
  header('Cache-control: private');
  header('Content-Type: application/octet-stream');
  header('Content-Length: '.filesize($local_arquivo));
  header('Content-Disposition: filename='.$arquivo);
  header("Content-Disposition: attachment;  filename=".basename($local_arquivo));
// Envia o arquivo Download
  readfile($local_arquivo);
}
?>

Ao contrário de nomear o arquivo, o código agora vai usar o valor da variável $_GET['arquivo'], que deve ser fornecido no link. O mesmo ocorre com o diretório local do arquivo que será baixado, que receberá o valor fornecido pela variável $_GET['local'].

Nossa função está pronta. Agora, é preciso configurar o link para que ele forneça os dois valores requeridos: arquivo (nome do arquivo) e local (onde o arquivo está armazenado).

A página de acesso ao usuário pode ter vários links, cada qual para um arquivo específico. Por exemplo, digamos que o site (por exemplo, na página index.php) contenha quatro arquivos diferentes disponíveis para download: então eu devo ter quatro links, todos remetendo o sistema para o arquivo da função (baixar.php), acrescidos com as duas variáveis e seus respectivos valores.

Nossos exemplos de links:

<a href="baixar.php?arquivo=oceano.mp3&local=musicas/">Baixar música</a>
<a href="baixar.php?arquivo=iliada.pdf&local=livros/">Baixar livro</a>
<a href="baixar.php?arquivo=troia.jpg&local=imagens/">Baixar imagem</a>
<a href="baixar.php?arquivo=programa.exe&local=downloads/">Baixar programa</a>

Observe que todos os links vão para o mesmo arquivo da função, mas cada link fornece valores diferentes para as variáveis arquivo local. No primeiro, temos o arquivo para download descrito como oceano.mp3 (portanto, um arquivo de áudio em MP3) e o local como musicas/ (que é onde deve estar o referido arquivo). Então, quando o arquivo da função for rodado, ele vai pegar os valores dessas variáveis ($_GET['arquivo'] e $_GET['local']) e efetuar o download perfeitamente.

Prático, eficiente e muito útil!

quinta-feira, 4 de agosto de 2016

.HTACCESS - Segurança para a sua Web


Em tempos de terrorismo virtual, nada mais natural do que cuidar da segurança do seu site. Para tanto, é imprescindível fazermos bom uso do arquivo .htaccess, que, além de precauções contra má intenções de usuários espertos (leia-se hackers), oferece recursos diversos muito úteis. Vamos conhecê-los!

O .htaccess é basicamente um arquivo de configuração utilizado em servidores web, como Apache. Seu nome vem de Hypertext Access = acesso os hipertextos. O arquivo funciona a nível de diretórios e permite que administradores gerenciem e manipulem configurações e acessos de forma descentralizada.


As configurações presentes nesse arquivo são aplicadas ao diretório no qual ele se encontra e também a todos os seus subdiretórios, caso existam. Vale lembrar ainda que a presença de um outro .htaccess em um subdiretório anula a ação do que se encontra um nível acima. Ou seja, o .htaccess do subdiretório passa a valer para o mesmo e também para todas as suas subpastas. E assim por diante. É sempre bom ficarmos atentos a estes detalhes.


CRIAR UM ARQUIVO .HTACCESS

Crie um arquivo .htaccess facilmente usando um editor de texto qualquer, por exemplo o Bloco de Notas padrão do Windows. Salve-o como “.htaccess” (sem aspas e com o ponto antes do nome) sem extensão ao final. Logo, nada de “.htaccess.txt”, mas simplesmente ".htaccess". Nós o colocaremos no diretório raiz da nossa web.


PROTEGENDO O .HTACCESS

Primeiramente, proteja o seu arquivo configurador de inserções malévolas ou equivocadas com as seguintes instruções:

<files ~ "^.*\.([Hh][Tt][Aa])">
order allow,deny
deny from all
satisfy all
</files>



PERSONALIZANDO PÁGINAS ESPECIAIS

Com ele, você pode personalizar páginas especiais, por exemplo, a página de erro ("404 Not Found") e de redirecionamento em caso de falha do servidor (500). No nosso exemplo, vamos estabelecer uma pasta exclusiva para eles denominada "erros".

# páginas especiais
ErrorDocument 400 /erros/badrequest.html
ErrorDocument 401 /erros/authreqd.html
ErrorDocument 403 /erros/forbid.html
ErrorDocument 500 /erros/serverr.html



BLOQUEANDO LISTAGEM DE DIRETÓRIOS E ARQUIVOS

Você pode também utilizar o .htaccess para evitar a listagem de diretórios. Para evitar que o conteúdo de um diretório seja exibido quando algum usuário o acessar, por exemplo, quando o usuário usa um comando  do tipo www.seusite.com.br/nomedapasta” ou “www.seusite.com.br/imagens”.
Basta somente adicionar o snipper seguinte:

# não indexar diretórios
Options -Indexes



CONTROLANDO O ACESSO A DIRETÓRIOS

Evite que você terceiros acessem determinados arquivos e pastas em seu site. Você possui um script qualquer instalado, por exemplo, e deseja evitar que visitantes acessem sua pasta “includes”. Mas, por outro lado, você precisa garantir que qualquer página do site em questão possa “chamar” sem problemas os arquivos contidos nesta pasta. Basta, então, adicionar um .htaccess com o seguinte conteúdo na tal pasta, no caso, a “includes”:

# acesso restrito
deny from all

Caso queira abrir exceção para um determinado IP, use o bloco a seguir:

# Acesso restrito!
order deny,allow
deny from all
allow from
NÚMERO DO IP



DEFININDO A PÁGINA INICIAL DO SITE

Defina que página deve abrir quando o usuário acessar sua web. O padrão é index.html ou index.php, mas você optar por outra qualquer, por exemplo empresa.php

A ordem a ser dada é:

# página inicial
DirectoryIndex index.html index.php index.html

No exemplo acima, os arquivos index.htm, index.html e index.php serão considerados como páginas de índice, obedecendo essa ordem. Ou seja, o sistema vai procurar por index.htm e, caso não a encontre, passará a procurar pela próxima indicada.
Se quiser informar outra, siga o mesmo procedimento:

# página inicial
DirectoryIndex empresa.html

Pelo exemplo acima, quando o usuário visitar o seu domínio, por exemplo, www.seusite.com.br, ele será automaticamente redirecionado para www.seusite.com.br/empresa.html.



URL AMIGÁVEIS


Com .htaccess, você também pode reescrever URLs para torná-las mais amigáveis, tanto para os motores de busca quanto para os visitantes.

Por exemplo, vamos dizer que você tem uma loja virtual e nela venda diversos produtos. Digamos, agora, que suas URLs possuem a seguinte estrutura:
http://www.meusite.com/produto.php?id=12

Simplifique a estrutura do exemplo para apenas:
http://www.meusite.com/produto-12.html

Então, reescreva produto.php?id=12 para produto-12.html fazendo assim:


RewriteEngine on
RewriteRule ^produto-([0-9]+)\.html$ produto.php?id=$1

Reescrevendo produto.php?id=12 para produto/hub-usb/12.html:

RewriteEngine on
RewriteRule ^produto/([a-zA-Z0-9_-]+)/([0-9]+)\.html$ produto.php?id=$2



REMOVENDO EXTENSÕES DE URLS

Remova a exibição das extensões dos arquivos das URLs, por exemplo, ao invés de seu visitante visualizar algo como contato.php na barra de endereços do navegador, ele pode visualizar simplesmente contato.

Faça isso acrescentando no .htaccess:

# removendo extensão php
RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-d
RewriteCond %{REQUEST_FILENAME}\.php -f
RewriteRule ^(.*)$ $1.php

No exemplo acima, a extensão .php será removida/escondida. Você pode também usar o mesmo snippet para esconder outras extensões de arquivos, como por exemplo .html. Basta realizar as devidas substituições.



FORÇAR DOWNLOAD DE CERTOS ARQUIVOS

Você pode forçar que um determinado tipo de arquivo (por exemplo os livros digitais em PDF) seja baixado pelo usuário, ao invés de esse arquivo ser executado direto.
Isso pode ser feito assim:

# forçar download de PDF
AddType application/octet-stream .pdf



FORÇAR TEXTO EM UTF-8

Para evitar problemas de codificação e renderização de páginas por causa da codificação de texto, force o uso da codificação UTF-8, padrão para nosso idioma:

#forçar UTF-8
<FilesMatch ".(php|htm|html|css|js)$">
AddDefaultCharset UTF-8
</FilesMatch>

terça-feira, 3 de maio de 2016

Tutorial: Criando e publicando um ePUB (ebook, livro digital) - 2ª parte



ESTRUTURA DO CONTEÚDO

Vimos no primeiro artigo desse tutorial que ao abrirmos um novo projeto no Sigil, o sistema já vem com alguns arquivos básicos, dentre os quais, um de conteúdo de texto, onde já podemos começar a escrever nosso livro: o arquivo Section0001.xhtml, que fica na pasta Text. Ele está configurado como o ponto inicial do projeto, ou seja, a seção de abertura do ePUB para quando o leitor abrir nosso livro digital, tal como a home de um site.
Para cada seção que criarmos, o programa vai gerar um novo arquivo de texto (formato xhtml) e vai nomeando-o sequencialmente: Section0002, Section0003, Section0004 etc. Mas você pode nomeá-los como quiser.


De fato, um livro é dividido por seções. Cada seção segue uma ordem de semântica, ou seja, de significado e aplicação. Vejamos alguns tipos comuns:
  • Capa (geralmente representada por uma imagem)
  • Folha de rosto ou título da página
  • Página de dados técnicos (informações da edição, catalogação, autor, editora, direitos autorais etc.)
  • Índice, glossário, sumário etc
  • Introdução, prefácio, prólogo, apresentação etc.
  • Dedicatória
  • Partes, unidades, capítulos etc.
  • Epígrafo, conclusão etc.
  • Bibliografia, e assim por diante.


CRIANDO A CAPA DO LIVRO

Logicamente, a primeira seção de um livro bem editado é a sua capa. Então, vamos pegar o arquivo de seção já existente (Section0001.xhtm) e vamos lhe aplicar a semântica da capa, para que ele seja destinado a tal fim.
Para tanto, clique com o botão esquerdo do mouse sobre o referido arquivo e siga os submenus Adicionar Semântica > Capa.



Assim, o sistema reconhecerá o tipo e destinação desse arquivo quando o leitor abrir o livro no dispositivo de leitura.
Mas também é interessante mudarmos o título da seção , para que a tabela de conteúdos dos sistema interprete facilmente que se trata da capa. Nós fazemos isso abrindo o arquivo toc.ncx e alterando o campo apropriado: onde consta "Iniciar", vamos reescrever "Capa".




Feito isso, você verá que a alteração já aparece na tabela de navegação do livro (Table Of Contents), na parte direita da Sigil.
Outra maneira de fazer isso é abrir o Editor de Tabela de Conteúdo pelo menu Tools > Table Of Contents > Edit Table Of Contents.... Uma janela suspensa aparece e exibe as seções existentes (no caso, apenas uma). Basca dar um novo nome para o campo TOC Entry para renomear o conteúdo.



Bom, agora só falta a gente montar a nossa capa propriamente dita, que na verdade vai ser uma imagem, cujas dimensões são 900px de largura por 1200px de altura. Faremos isso da seguinte forma: vamos selecionar o arquivo Section001.xhtml e abrir o menu Tools > Add Cover...
Na nova janela que se abre, vamos buscar o nosso arquivo de imagem JPG clicando no botão Other Files. Então eu localizei a imagem que eu criei e a incorporei ao projeto.

A minha capa ficou assim:



Você pode ver que a imagem foi incorporada no centro da nossa seção Capa, relativa ao arquivo Section0001.xhtml. Pode conferir também que o arquivo incorporado também consta no projeto, dentro da pasta Images, podendo ser reutilizado em outras partes do livro. Não é o nosso caso, mas acontece de uma mesma mídia aparecer mais de uma vez no conteúdo da obra, bastando apenas ser incorporada uma vez ao projeto para ser reutilizada quantas vezes se queira.


DANDO UMA OLHADA NO CÓDIGO DE PROGRAMAÇÃO


A janela central do Sigil originalmente faz uma pré-visualização da seção, tal como se estivéssemos abrindo o livro num dispositivo de leitura já no formato final do projeto. Por isso, o ícone Book View fica selecionado por padrão.
Mas, ao lado desse ícone, fica o Code View, o botão para verter a exibição do arquivo para o modo de programação. Mude para esse modo e dê uma olhada no que acontece: ao invés de ver a capa, como antes, agora verá um emaranhado de códigos, semelhantes aos de uma página de internet.


Aliás, se você tiver o mínimo conhecimento da linguagem HTML, poderá fazer várias edições no seu projeto e incrementar ainda mais o seu livro. Vamos arriscar alguma coisa?
Primeiro, vejamos o código original de um arquivo de seção:

<?xml version="1.0" encoding="utf-8" standalone="no"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN"
"http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title></title>
</head>

<body>
</body>

</html>

Temos aqui uma série de instruções técnicas que permite o dispositivo reconhecer o arquivo e abri-lo, tal como um navegador abre uma página de internet.
As partes que serão úteis para qualquer programação que possamos fazer são:

  • Head: dentro das chaves <head> e </head> nós podemos escrever instruções de configuração e estilização da folha, por exemplo, alterar a cor de fundo da página, a cor dos textos e configurar as margens (espaço vazio das bordas da folha).
  • Body: é entre as chaves <body> e </body> que fica todo o conteúdo da seção: textos, imagens etc. Aqui é então o corpo (body) do arquivo, a área visível da página ao leitor. Por exemplo, ao incorporarmos a imagem para a nossa capa, o programa automaticamente inseriu na body as instruções para a exibição do arquivo de imagem, instruindo ainda o seu alinhamento, a extinção da margem e o tamanho redimensionável. Assim, a body da capa ficou desta maneira:

<body>
<div style="text-align: center; padding: 0pt; margin: 0pt;">
<svg xmlns="http://www.w3.org/2000/svg" height="100%" preserveAspectRatio="xMidYMid meet" version="1.1" viewBox="0 0 900 1200" width="100%" xmlns:xlink="http://www.w3.org/1999/xlink">
<image height="1200" width="900" xlink:href="../Images/capa.jpg"></image>
</svg>
</div>

</body>

ARRISCANDO UMA PROGRAMAÇÃO

Vamos codificar alguma coisa, para incrementar nossa capa?
Então alteraremos a cor de fundo (background-color) da folha, que originalmente é branco, para um tom de azul escuro.
Para tanto, vamos escrever essa instrução dentro das tags da head, que então ficará assim:

<head>
     <title>Cover</title>

     <style type="text/css">
              body{
                   background-color: #015;
              }
     </style>

</head>

Isso feito, quando o dispositivo de leitura abrir nosso livro, ele será instruído pela head (que configura o processamento da body) a usar um estilo (style) que definimos para a cor de fundo da página (background-color) para uma cor específica (#015), no caso, um azul escuro.



Pronto! Nossa capa já está pronta e, por agora, já basta de código. Vamos à parte mais prática.


CRIANDO UMA NOVA SEÇÃO DO LIVRO

A próxima seção do nosso livro será um folha de dados técnicos, que trará o título, o nome do autor, dados da edição e da editora etc.

Com o botão direito do mouse, clique sobre a pasta Text e na opção Add Blank HTML Files do menu suspenso.

O programa então cria um novo arquivo de texto com o nome Section0002.xhtml.



Talvez seja um erro desta versão, porém o Sigil não faz a entrada de um novo arquivo na tabela de conteúdo (TOC), para indexar a seção ao sistema, de modo a exigir que a façamos manualmente. Mas, isso não será capaz de tirar nossa paz. Vamos indexá-lo fazendo assim:

Abra o arquivo toc.ncx.
Veja que já há uma entrada para aquele primeiro arquivo , que nós usamos para a capa do livro (Section0001.xhtml).

A entrada dele é essa:

<navPoint id="navPoint-1" playOrder="1">
<navLabel>
<text>Capa</text>
</navLabel>
<content src="Text/Section0001.xhtml"/>
</navPoint>




A primeira linha diz que foi criado um ponto de navegação identificado como navPoint-1, cuja ordem da página é 1.
A segunda linha abre a tag do rótulo da seção <navLabel>, que então é definido na terceira linha, entre as tags <text> e </text>. É aqui que damos um nome para a seção, nome esse que aparecerá no índex do livro (na tabela de conteúdo, o TOC).
A quarta linha do bloco do código apenas traz a tag de fechamento do rótulo.
Na linha seguinte temos a referência do arquivo que traz essa seção (<content src="Text/Section0001.xhtml"/>).
Por fim, temos a tag de fechamento do bloco.

Então, como cada seção criada precisa ter um bloco desse como entrada na tabela de conteúdo, vamos copiar e colar um bloco de navPoint para nossa nova seção, observando as alterações correspondentes, ficando assim:

<navPoint id="navPoint-2" playOrder="2">
<navLabel>
<text>Dados bibliográficos</text>
</navLabel>
<content src="Text/Section0002.xhtml"/>

</navPoint>

Note que, na primeira linha, alteramos o numeral da ordem do ponto de navegação duas vezes, pois nosso novo arquivo será a segunda seção (segundo ponto de navegação).
Também alteramos a terceira linha, descrevendo nossa seção como "Dados bibliográficos".
Na quinta linha, informamos o arquivo relacionado, no caso aqui,  "Section0002.xhtml".



Feito isso, a seção já estará listada na tabela de conteúdos (na coluna da direita da tela do Sigil.) e pronta para finalmente receber um conteúdo.





EDITANDO CONTEÚDOS

Enfim, chegou a hora do escritor tomar o lugar do programador. Aberto nosso arquivo Section0002.xhtml, que vai conter os dados bibliográficos do livro, podemos então começar a compor o conteúdo.
Tudo o que temos de fazer é escrever:


Escrevemos acima o título do livro, o nome do autor, a descrição da edição e o ano de seu lançamento, além do nome de nossa fictícia editora. Dessa forma é que podemos compor nossa obra, seja escrevendo, seja importando um texto de outro documento.
Na continuação do nosso tutorial, vamos trabalhar a estilização dos textos, parágrafos, alinhamento dos objetos etc.

Continua...




segunda-feira, 2 de maio de 2016

Tutorial: Criando e publicando um ePUB (ebook, livro digital) - 1ª parte



O QUE É UM LIVRO DIGITAL

Os livros em papel ainda resistem, mas é evidente que a popularização dos dispositivos digitais fadam os maços de papeis ao desuso, ou pelo menos a uma sensível diminuição — o que a ecologia agradece. Em contrapartida, nós temos os livros em formato digital, ou seja, o e-book (eletronic book: livro eletrônico).
Um livro digital é, portanto, um documento de texto a ser aberto por um programa específico.
Você encontra um vastíssimo e crescente acervo de títulos na internet, inclusive no Google Play Livros, muitos deles distribuídos gratuitamente.
São infinitas as vantagens de uma versão eletrônica. Por exemplo, você pode fazer uma busca dinâmica pelo conteúdo, procurando por uma palavra ou frase. Pode também fazer edições, grifando trechos ou anexando comentários. Além disso, os e-books não se limitam a textos e imagens estáticas, mas podem igualmente conter vídeos, animações e links. E ainda: alguns programas oferecem até recurso de narração. Ou seja, você nem precisa ler.


FORMATOS DE E-BOOKS E PROGRAMAS DE LEITURA

O formato PDF (Portable Document Format: formato de documento portátil) despontou como a alternativa inicial. Um PDF é como a fotocópia de um livro comum. Aliás, é comum encontrarmos arquivos desse tipo criados a partir de imagens escaneadas de uma publicação em papel.
A extensão desses arquivos é .pdf e há vários leitores desse formato, sendo o principal o Adobe Reader.
Entretanto, sobretudo em função da diversidade dos dispositivos eletrônicos, viu-se a necessidade de um formato  de livro cuja disposição das páginas se adaptasse às variadas dimensões de telas, assim como ocorreu com os sites responsivos. E isso, era inviável no formato PDF.
Foi aí que surgiu o ePUB (eletronic Publication: publicação eletrônica), cuja principal vantagem em relação ao tipo PDF é exatamente proporcionar um ajustamento automático do conteúdo do livro (textos, imagens etc.) de acordo com a resolução do dispositivo de leitura do livro. A estrutura de um arquivo ePUB é similar a de páginas de internet. Na verdade, um livro nesse formato é como um site responsivo: dinâmico e prático para o usuário. A extensão desse tipo de arquivo é .epub.
Há também grande variedade de softwares de leitura de arquivos ePUB. O que estamos utilizando é o Universal Book Reader (ver aqui).


Porém, nós recomendamos que você experimente outros programas e compare suas funcionalidades.


EDITANDO UM EPUB

Há, mas talvez você não se contente apenas em desfrutar da leitura dos livros digitais e, sim, pretenda mostrar seus dotes de escritor. Pois bem! Aqui vamos começar um tutorial para criação e publicação de um arquivo ePUB.
Existem até programas que oferecem a conversão automática de determinados arquivos de textos (como PDF ou documento do Microsoft Word) para ePUB. Contudo, nenhum deles se mostrou totalmente eficiente na conversão. Alguns deixam bugs que inviabilizam a rolagem correta das páginas, além de quase sempre não conseguirem criar uma boa disposição do seu conteúdo.
Por isso, o bom mesmo é criar um ePUB na raça, editando-o do zero e ajustando o seu conteúdo manualmente, garantido assim total controle do projeto e deixando-o perfeito, como se queira.
Para tanto, o software que utilizamos é o Sigil, que você baixa grátis diretamente do site oficial do programa (faça o download aqui).


Mas não se preocupe: criar um ePUB com o Sigil não é nenhum bicho-de-sete-cabeças e nós vamos te ajudar passo a passo.


CONHECENDO O SIGIL

Rode o programa e dê uma olhada inicial nos seus recursos. Você (de cima para baixo) uma barra de menus, uma barra de ícones de formatações e funções e as janelas de edição.

Inicialmente, vá no menu Ver e certifique-se que as janelas Navegador do Livro e Table Of Contents estejam habilitadas para visualização. A primeira diz respeito à estrutura dos dispositivos do arquivo (como a relação de páginas, imagens e fontes usados no livro) e a segunda janela mostra a tabela de conteúdo (como o índice comum de um livro). Entre elas, na janela central, fica o próprio visualizador do livro.


A disposição do Sigil deve aparecer assim:




SALVANDO UM ARQUIVO

Antes de tudo, salve o seu primeiro arquivo pelo menu Ficheiro > Guardar, ou pelo atalho Ctrl+S. Dê um nome ao seu livro, defina a pasta onde vai salvá-lo e vamos em frente. Nós aqui demos o nome Experimentos e fomos conferir na pasta como o arquivo ficou. Ei-lo:





INFORMAÇÕES DO SEU LIVRO

Vamos agora dar algumas informações técnicas ao nosso livro, como o título, autor e editora.
Abra o menu Tools > Editor de Metadados (ou use Crtl+8) para exibir o formulário de dados técnicos.
No campo Título, escreva Experimentos; em Autor, digite seu nome e dê OK.



Abra novamente o editor de metadados para apreciarmos outros detalhes. Veja que há também uma caixa de seleção para o idioma do livro (essa informação é interessante para que as pessoas encontre seu livro pela busca de idiomas) e, logo abaixo, uma tabela de outros dados, no caso, contendo apenas uma linha, que traz a data do livro. O Sigil apresenta automaticamente a data corrente, mas você poderá editar e informar a que quiser, correspondente à data de criação ou publicação do seu livro.
Além disso, vamos acrescentar um dado técnico ao nosso livro, clicando no botão Adicionar Básico (à direita desse formulário).
Uma tabela de dados técnicos surge. Dê uma olhada nas opções para ver o que mais desejaria acrescentar às informações básicos do arquivo. No caso, vamos informar o nome da editora clicando na opção Editor.



Depois de dar OK, você verá que uma linha foi acrescida na tabela de dados, correspondente ao item Editor, para o qual, vamos dar o valor da editora que vai publicar nosso livro, ficticiamente descrita como Editora Luz.


Dessa mesma maneira, você poderá acrescentar outras informações técnicas, como data de criação, data de publicação, assunto, créditos da capa (Coverage) e direitos autorais (Rights).
Essas informações aparecem quando o arquivo final for selecionado pelos dispositivos ou for explorado pelos mecanismos de busca.


ESTRUTURA DE UM ARQUIVO EPUB

Embora você não precise saber desses detalhes, fazemos questão de explicar a parte burocrática do projeto, para um melhor entendimento do que estamos fazendo.
Como já dissemos, um arquivo final ePUB é como um site: ele é uma compilação de vários arquivos internos, formando uma estrutura bem definida e organizada.
Os arquivos internos são as páginas (separadas em capítulos e seções), as mídias (figuras, vídeos, animações etc.) e arquivos de configuração do ePUB.


Dentre os arquivos de configuração, temos o content.opf, que é a home do livro, como a página de abertura de um site. É o código principal de estruturação do ePUB, contendo, por exemplo, as informações técnicas que inserimos no formulário de metadados (título, autor, idioma etc.).

Uma de suas seções é o <manifesto>, relaciona todos os itens da compilação (os já existentes e os que viermos a inserir no nosso projeto). Dê uma olhada e veja que já há dois itens: o primeiro é o arquivo toc.ncx (veremos a seguir) e o segundo é uma página de texto, que o Sigil automaticamente introduziu, para começarmos a escrever o nosso livro.
Abra o arquivo toc.ncx e tente entendê-lo: ele traz a tabela de conteúdo que irá compor o nosso livro. É como o mapa de um site, ou uma espécie de índice da obra. Esse índice é o que aparece quando abrimos um livro digital por um dispositivo de leitura, pelo qual navegamos pela obra, por exemplo, passando de um capítulo para outro.



Sempre que inserirmos uma seção do livro (capa, folha de rosto, página de índice, capítulos etc.), ela deve aparecer listada aqui, para permitir a correta navegação do livor quando o arquivo estiver finalizado. Seus itens estarão também listados na janela Table Of Contents do Sigil.
Ao começarmos um arquivo em branco, como fizemos aqui, o programa traz um único item: uma página chamada Iniciar, que corresponde ao arquivo de texto nomeado automaticamente como Section0001.xhtml, que está na pasta Text (veja na janela de Navegação do Livro, à esquerda).



Pela imagem acima, vemos (à esquerda) a referida página Section0001.xhtml na pasta Text, sua inscrição no arquivo toc.ncx (janela central) e sua exibição na tabela de conteúdos (janela à direita) sob a inscrição Iniciar.
Cada item, ou seção do livro (capa, índice, introdução, capítulo etc.) é um ponto de navegação listado no mapa do TOC, dessa maneira:

<navPoint id="navPoint-1" playOrder="1">
    <navLabel>
        <text>Iniciar</text>
    </navLabel>
    <content src="Text/Section0001.xhtml"/>

</navPoint>

No caso do item acima, temos o primeiro ponto de navegação (navPoint-1), cujo descrição, ou rótulo (Label) foi automaticamente inserido como "Iniciar", e está relacionado ao arquivo de texto "Section0001.xhtml" dentro da pasta Text (<content src="Text/Section0001.xhtml"/>).

Muito bem, já vimos como o ePUB é estruturado. A seguir, na nossa próxima postagem, vamos começar a trabalhar o conteúdo do livro.

Continua...


Tags: como criar um ebook, como criar um epub, como criar um livro digital, tutorial como usar o Sigil, aprenda passo a passo a escrever e publicar um livro digital.

quarta-feira, 23 de março de 2016