I have a Vf page which renders as a word document. This word document needs to have a header & a footer with page counter & image (logo). The same code for rendering page as PDF doesnt work in style class.
[SalesForce] How to add header & footer in VF page whose content type is word
Related Solutions
I think the issue you are having is that the 'template' for the header and footer gets displayed in the main content. Otherwise the header and footer do display correctly - at least they did for me. I found the solution to remove the 'template' in another post. Check it out here
<apex:page sidebar="false" contentType="application/msword" cache="true">
<html xmlns:o='urn:schemas-microsoft-com:office:office' xmlns:w='urn:schemas-microsoft-com:office:word' xmlns='<a target="_blank" href="http://www.w3.org/TR/REC-html40'" rel="nofollow">http://www.w3.org/TR/REC-html40'</a>>
<head>
<style>
p.MsoHeader, li.MsoHeader, div.MsoHeader{
margin:0in;
margin-top:.0001pt;
mso-pagination:widow-orphan;
tab-stops:center 3.0in right 6.0in;
}
p.MsoFooter, li.MsoFooter, div.MsoFooter{
margin:0in;
margin-bottom:.0001pt;
mso-pagination:widow-orphan;
tab-stops:center 3.0in right 6.0in;
}
@page Section1{
size:8.5in 11.0in;
margin:0.5in 0.5in 0.5in 0.5in;
mso-header-margin:0.5in;
mso-header:h1;
mso-footer:f1;
mso-footer-margin:0.5in;
mso-paper-source:0;
}
div.Section1{
page:Section1;
}
/*Below is the style to prevent the repetition of header and Footer.. Cheers!!!*/
table#hrdftrtbl{
margin:0in 0in 0in 9in;
}
</style>
</head>
<body>
<!-- Content -->
<div class="Section1"><!--Section1 div starts-->
<!-- Page 1 starts -->
<br/>
Page 1 Content
<br clear="all" style="page-break-before:always" />
<!-- Page 2 Starts -->
<br/>
Page 2 Content
<br clear="all" style="page-break-before:always" />
<!-- Page 3 Starts -->
<br/>
Page 3 Content
<!--Header and Footer Starts-->
<table id='hrdftrtbl' border='1' cellspacing='0' cellpadding='0'>
<tr>
<td>
<!--Header-->
<div style='mso-element:header' id="h1" >
<p class="MsoHeader">
<table border="1" width="100%">
<tr>
<td width="30%">
Left <br/>Header
</td>
<td align="center" width="40%">
Center<br/> Header
</td>
<td align="right" width="30%">
Right<br/>Header
</td>
</tr>
</table>
</p>
</div>
</td>
<td>
<!--Footer-->
<div style='mso-element:footer' id="f1">
<p class="MsoFooter">
<table width="100%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td width="30%">
Left<br/>Footer
</td>
<td align="center" width="40%">
Center<br/>Footer
</td>
<td align="right" width="30%">
Page <span style='mso-field-code: PAGE '></span> of <span style='mso-field-code: NUMPAGES '></span>
</td>
</tr>
</table>
</p>
</div>
</td>
</tr>
</table>
</div><!--Section1 div ends-->
</body>
</html>
</apex:page>
i got solution for this after lot of struggling. I did small modification in css. That is: table#hrdftrtbl{ margin:0in 0in 0in 15in; }
Best Answer
You will need the
mso-header
,mso-footer
andmso-pagination
style attributes. For more info you can download official misrosoft lib: Microsoft Office HTML and XML ReferenceSomething like this: