wkhtmltopdf repeatitive background image on all pa

2019-04-16 03:24发布

站内问答 / 后端开发
1944 2 4

I am struggling to make a repetitive background for a generated PDF.

I have a certificate that is automatically generated and certificate design has a frame that should repeat on all the pages...

I tried 

.main_container{
   background: url({{ resourceDir ~ 'img/certificate_margin.jpg' }}) 0 0;
   padding-top:15px;
   z-index: 99;
   background-size: cover;
   width:658px;
   height:975px;
}

but after the first page is displayed I only get the content and a white page. Did anyone managed to solve this issue some how? Or is it even possible to do it?

my config file:

knp_snappy:
    pdf:
        enabled:    true
        binary:     "%wkhtmltopdf_binary_path%"
        options:
            page-size: A4
            dpi: 150
            image-dpi: 150
            encoding: utf-8

and generation code:

$unsignedPdfContent = $this->snappy->getOutputFromHtml(
    $this->templating->render(
        $this->getTemplate(), [
            'certificate' => $this->certificate,
            'resourceDir' => __DIR__.'/../Resources/public/'
        ]
    )
);

2条回答
你好瞎i
2楼-- · 2019-04-16 03:37

After thinking about this problem, I recommend just delegating out to something like pdftk and use the same logic for watermarks for a recurring background image.

https://www.pdflabs.com/docs/pdftk-man-page/#dest-op-multistamp

查看更多
0人赞 添加讨论(0) 举报
Melony?
3楼-- · 2019-04-16 03:46

I managed to "solve" the problem.

Based on this question Why doesn't wkhtmltopdf page-break-after have any effect? I actually forced the page to manually break after a fixed point and create a new page with the same background.

OK, it's a "hackish" way but it did the job...

now my code looks like this

CSS

.main_container{
    background: url({{ resourceDir ~ 'img/certificate_margin.jpg' }}) 0 0;
    padding-top:15px;
    padding-left:5px;
    z-index: 99;
    background-size: cover;
    width:652px;
    height:975px;
    position:relative;
 }
.break{
        display: block;
        clear: both;
        page-break-after: always;
}

And the twig

...
<body>
<div class="main_container break" style='position:relative'>

    first page content 

    {% block body %}

    {% endblock %}

    {% include 'BlablaBundle:Pdf:_partial_certificate/_footer_contact.html.twig' with {'page': 'Seite 1/2'} %}
</div>

<div class="main_container" style='position:relative'>

    second page content

        {% include 'BlablaBundle:Pdf:_partial_certificate/_footer_contact.html.twig' with {'page': 'Seite 2/2'} %}
</div>
</body>
...
查看更多
0人赞 添加讨论(0) 举报
登录 后发表回答
相关问题
查看全部
相关文章
查看全部
收藏的人(4)