Tools om het web vast te leggen en te converteren

Tips voor het schrijven van HTML voor conversie

Met de API van GrabzIt kunt u elke HTML converteren into PDF, DOCX, afbeeldingen en meer. Om dit te doen, moet u reguliere HTML doorgeven aan onze API. Bijvoorbeeld zoiets als de HTML die in het volgende voorbeeld wordt getoond.

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

Merk op dat dit HTML-voorbeeld de HTML- en BODY-tags bevat, maar dit is niet vereist als u alleen een HTML-fragment wilt converteren. Als u echter de HTML- en BODY-tags niet toevoegt, worden deze automatisch voor u toegevoegd, net als in een normale browser. Om dit tegen te gaan, kunt u een aantal CSS opgeven om extra opvulling en marges op de BODY-tag te verwijderen, zoals hieronder wordt weergegeven.

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

Als u JavaScript, afbeeldingen of CSS wilt opnemen in de HTML die u gaat converteren, kunt u deze bronnen bieden in een inline of verwezen landhuis. De onderstaande code laat bijvoorbeeld zien hoe u bronnen in de HTML op een inline manier kunt maken.

<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>

Zoals u in het bovenstaande voorbeeld kunt zien, bevinden JavaScript en CSS zich direct op de HTML-pagina en hoe de afbeelding is getransformeerd intof gegevens URL.

Als we in plaats daarvan naar deze bronnen wilden verwijzen, moeten we ervoor zorgen dat alle URL's die naar deze bestanden linken, absolute URL's gebruiken, die ook openbaar toegankelijk zijn. Dit betekent dat de URL alle informatie bevat die nodig is om een ​​bron te vinden. Het gebruik van absolute URL's is de belangrijkste reden afbeeldingen, CSS en JavaScript zijn niet weergegeven bij het converteren van HTML.

Hiervoor moeten JavaScript, CSS en afbeelding worden geplaatst into afzonderlijke bestanden en vervolgens verwezen in de HTML, die er ongeveer uit zou zien als het onderstaande voorbeeld.

<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>