How to add Header/Footer using Aspose.Html

Hello,

I am using Aspose.Html to generate pdf document from Html. Html file is dynamically generated by using freemarker Apache lib. so my requirement is like I have to add custom header/footer based on page number. header and footer is different. and if page number is one then showing diff header and page number is greater than one then showing diff header. header/ footer height, margin, orientation, all things set during adding header. please suggest.

  1. Converting HTML to PDF, how I can set orientation, margin, page size etc details??

@MadhuriMaru

Please check below code sample that sets different options during HTML to PDF conversion using Aspose.HTML for Java:

com.aspose.html.HTMLDocument htmlDocument = new com.aspose.html.HTMLDocument(dataDir + "input.html");
// Initialize PdfSaveOptions
com.aspose.html.saving.PdfSaveOptions options = new com.aspose.html.saving.PdfSaveOptions();
options.getPageSetup().setAdjustToWidestPage(true);
options.getPageSetup().getAnyPage().setMargin(new com.aspose.html.drawing.Margin(0));
com.aspose.html.drawing.Length width = com.aspose.html.drawing.Unit.fromMillimeters(210);
com.aspose.html.drawing.Length height = com.aspose.html.drawing.Unit.fromMillimeters(297);
options.getPageSetup().getAnyPage().setSize(new com.aspose.html.drawing.Size(width, height) );
// Output file path
String outputPDF = dataDir + "output.pdf";
// Convert HTML to PDF
com.aspose.html.converters.Converter.convertHTML(htmlDocument, options, outputPDF);

If you could please share sample source and expected output files with us, we will try to produce a sample code snippet that can be used to achieve your requirements and share with you.

  1. I want to add landscape/portrait orientation using javascript. In atached file you can see I am adding orintation or marging related things using js. You shared example I tried but I am confusing how I can add landscape as a orintation.

  2. I am sharing you one file that contains some js code to add header/footer. currently the file containing the code is about phantomjs. I am not sure how can I achieve dynamic user or project info in js file using Aspose.HTML. main thing is I want to generate header footer that is generated based on user data or page number.

TestFolder.zip (1.2 KB)

if javascript not able to get dynamic data then you can also share me if pageNumber is 1 then It will apply header and if pageNumber is greater than 1 then It will apply some other header.

@MadhuriMaru

Thanks for getting back to us.

Please note that we asked for sample HTML template which you want to convert into PDF along with expected output PDF with sample content. Nevertheless, we have checked the JS file that you have shared and we regret to inform you that Aspose.HTML does not offer feature to execute JavaScript while performing the conversion.

Furthermore, when you are talking about page numbers, does it mean Page Number text somewhere in HTML to assume if its one page or they are actual page numbers in the output PDF? In second case, Aspose.HTML does not offer any feature to edit/modify PDF files. You need to use Aspose.PDF in order to add header/footer in the PDF document according to page numbers.

You can assign different height and width to the Page Size in order to control the orientation. For example, if page is in landscape mode, you can switch height and width parameters in the Size() Class to produce a landscape oriented PDF.

Please take into account that as per our understanding of your use case, you need to generate PDF from an HTML template by specifying desired page size, margins, orientation, etc. Once the PDF is generated, you want to modify it and add different header/footer in it based on the page numbers.

If our understandings are correct, we would like to suggest you use Aspose.PDF instead of Aspose.HTML because, Aspose.PDF provides both capabilities i.e. HTML to PDF Conversion and Modifying PDF documents.

Please let us know in case you have further inquiry.

Thank you for your response.

If generated pdf having one page then we are showing simple text header on that pdf and if it’s having more than 1 page then we are showing dynamic header/footer. Please suggest how can I achieve this Aspose.PDF??

and if we are adding header/footer after html to PDF conversion done and again modify that pdf then is it taking performance issue ??

@MadhuriMaru

Please check following complete code example that uses Aspose.PDF. It takes an HTML template, converts it into PDF, and add different header/footer in output PDF.

HtmlLoadOptions options = new HtmlLoadOptions();
options.getPageInfo().setLandscape(true);
options.getPageInfo().setHeight(PageSize.getA4().getWidth());
options.getPageInfo().setWidth(PageSize.getA4().getHeight());
options.getPageInfo().setMargin(new MarginInfo(72,72,72,72));
//options.setRenderToSinglePage(true);
Document document = new com.aspose.pdf.Document(dataDir + "input.html", options);
document.save(dataDir + "HTMLtoPDF.pdf");

document = new Document(dataDir + "HTMLtoPDF.pdf");

String evenHtmlHeader = "<h3>Even Page Number Header</h3>";
String evenHtmlFooter = "<h3>Even Page Number Footer</h3>";
String oddHtmlHeader = "<h3>Odd Page Number Header</h3>";
String oddHtmlFooter = "<h3>Odd Page Number Footer</h3>";

for(com.aspose.pdf.Page page : document.getPages())
{
 if(page.getNumber()%2 == 0){
  HeaderFooter header = new HeaderFooter();
  HeaderFooter footer = new HeaderFooter();

  header.setMargin(new MarginInfo(0,0,0,0));
  footer.setMargin(new MarginInfo(0,0,0,0));

  header.getParagraphs().add(new HtmlFragment(evenHtmlHeader));
  footer.getParagraphs().add(new HtmlFragment(evenHtmlFooter));

  page.setHeader(header);
  page.setFooter(footer);
 }
 else{
  HeaderFooter header = new HeaderFooter();
  HeaderFooter footer = new HeaderFooter();

  header.setMargin(new MarginInfo(0,0,0,0));
  footer.setMargin(new MarginInfo(0,0,0,0));

  header.getParagraphs().add(new HtmlFragment(oddHtmlHeader));
  footer.getParagraphs().add(new HtmlFragment(oddHtmlFooter));

  page.setHeader(header);
  page.setFooter(footer);
 }
}
document.save(dataDir + "PDFWithHeaderFooter.pdf");

There is no such known issue in terms of performance while achieving such kind of requirements. However, if you notice any issue, please feel free to let us know.

Hello,

I am facing issue while converting HTML file to pdf using Aspose.HTML. here I am sharing my template file. could you please check and revert back me ??

Html file containing SVG and device icon but while I converted it to PDF it’s totally different. Please suggest.

One more thing, could you please share link for some sample template so based on that we can get more idea.

plan.zip (64.5 KB)

Thanks,
Madhuri

@MadhuriMaru

We were able to notice the issue at end while testing the scenario. Therefore, we have logged it as HTMLJAVA-778 in our issue management system. We will further look into its details and keep you posted with the status of its correction. Please be patient and spare us some time.

We apologize for the inconvenience.

There are no sample templates which can be suggested as every type of HTML file should be supported and converted to PDF using the API. In case an issue occurs while processing a specific type of document, you are always encouraged to report here and we will address it accordingly.

Hi, the title of this post is “How to add Header/Footer using Aspose.Html”, yet the sample given is using Aspose.Pdf. The feature page for Aspose.Html lists as a feature “Apply header and footer during HTML to PDF”.

Can we see an example of how the headers and footers are added using Aspose.Html?

Thank you

@bigtonyk

Please check the below page of the documentation where an example is given to add information in the header/footer section of the HTML document using CSS Style.

Thank you for the reply, but I’m not sure how that answers my question. On the feature page for the .net version of the Apose.Html product found here it states “Apply header and footer during HTML to PDF”.

The documentation at the link provided demonstrates an experimental css attribute used when saving an xps document.

@bigtonyk

The link was shared for the code snippet to apply the header footer in the HTML file using CSS Style. As far as conversion is concerned, you can simply replace the HTML to XPS Conversion code with HTML to PDF Conversion by using the respective SaveOptions. We hope this helps.

Is there any way to provide a dynamic variable that is also a string for “-aspose-content” while using the CSS Extensions?

@abisharma

We need to investigate the feasibility of this requirement. Can you please share a sample use case for our reference how you want to run the things? We will log an investigation ticket and share the ID with you.