Ferramentas para capturar e converter a Web

Dicas para escrever HTML para conversão

A API do GrabzIt permite converter qualquer HTML into PDF, DOCX, imagens e muito mais. Para fazer isso, você precisa passar HTML regular para nossa API. Por exemplo, algo como o HTML mostrado no exemplo a seguir.

<html>
<body>
<h1>Hello World</h1>
</body>
</html>

Observe que este exemplo HTML incluiu as tags HTML e BODY, mas isso não é necessário se você deseja converter apenas um trecho de HTML. No entanto, se você não adicionar as tags HTML e BODY, elas serão adicionadas automaticamente para você, exatamente como em um navegador normal. Para combater isso, você pode especificar um CSS para remover qualquer preenchimento e margens extras na tag BODY, como mostrado abaixo.

<style>
body{margin:0;padding:0}
</style>

Se você deseja incluir JavaScript, imagens ou CSS no HTML que você irá converter, poderá fornecer esses recursos em um solar inline ou referenciado. Por exemplo, o código abaixo mostra como criar recursos no HTML de maneira embutida.

<html>
<head>
<script>
document.getElementsByTagName('H1')[0].innerText = 'Goodbye';
</script>
<style>
h1{
color:red;
}
</style>
</head>
<body>
<img width="16" height="16" alt="star" src="data:image/gif;base64,R0lGODlhEAAQAMQAAORHHOV
SKudfOulrSOp3WOyDZu6QdvCchPGolfO0o/XBs/fNwfjZ0frl3/zy7////wAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA
AAAAAAAAAAAAAAAAAAAAAAAAAACH5BAkAABAALAAAAAAQABAAAAVVICSOZGlCQAosJ6mu7fiyZeKqNKToQGDsM8hBADgUXoGA
iqhSvp5QAnQKGIgUhwFUYLCVDFCrKUE1lBavAViFIDlTImbKC5Gm2hB0SlBCBMQiB0UjIQA7" />
<h1>Hello World</h1>
</body>
</html>

Como você pode ver no exemplo acima, o JavaScript e o CSS estão contidos diretamente na página HTML e como a imagem foi transformada intou URL de dados.

Se quisermos fazer referência a esses recursos, precisaremos garantir que todos os links de URLs para esses arquivos usem URLs absolutos, que também são acessíveis ao público. Isso significa que o URL contém todas as informações necessárias para localizar um recurso. Não usar URLs absolutas é o principal motivo imagens, CSS e JavaScript não renderizaram ao converter HTML.

Para fazer isso, JavaScript, CSS e imagem precisariam ser colocados into arquivos separados e, em seguida, referenciados no HTML, que se pareceriam com o exemplo abaixo.

<html>
<head>
<script src="http://www.example.com/myscript.js"></script>
<link rel="stylesheet" type="text/css" href="http://www.example.com/mystyle.css">
</head>
<body>
<h1>Hello World</h1>
<img width="16" height="16" alt="star" src="http://www.example.com/star.gif" />
</body>
</html>