4

I need help in making cover page of PDF different without any header/footer. Rest I was able to complete but how can I remove header/footer from first page that can be used as cover page.

 <style type="text/css" media="print">
              @page {
                        @top-center {
                              content: element(header);
                        }
                        @bottom-left {
                            content: element(footer);
                        }
                   }
                   div.header {
                       padding: 10px;
                       position: running(header);
                   }
                   div.footer {
                       display: block;
                       padding: 5px;
                       position: running(footer);
                   }
                   .pagenumber:before {
                        content: counter(page);
                    }
                    .pagecount:before {
                        content: counter(pages);
                    }

         </style>

Above code was used for header and footer and its working fine. Need help to change css to set cover page.

2

Salesforce PDF generation supports the :first page pseudo-class.

Here is an example (tested using API 34) where the page number is not displayed on the first page:

@page {
    @bottom-right {
        content: "Page " counter(page) " of " counter(pages);
        font-family: sans-serif;
        font-size: 80%;
    }
}
@page :first {
    @bottom-right {
        /* Nothing */
    }
}

So I assume (but have not tested) that this would work in your case:

@page {
    @top-center {
        content: element(header);
    }
    @bottom-left {
        content: element(footer);
    }
}
@page :first {
    @top-center {
    }
    @bottom-left {
    }
}
|improve this answer|||||
0

Thanks Keith for quick reply. It helped me to resolve it. Below is the complete syntax that was used to hide other elements on cover page: Thanks Keith for your reply. I got it resolved but somehow it is working in Version 26.0. Its not working with latest versions.

@page:first { 
  @top { content: normal }
  @bottom-right { content: normal }
  @top-center {content: normal;}
  @bottom-left {content: normal;}
}
|improve this answer|||||

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.