Cannot control footer image sizes

  • Resolved Dan Stramer

    (@danstramer)


    4 years, 7 months ago

    I have created a footer with an image and also targeted it with css but when creating the PDF, the image is big and doesn’t resize.
    Click on the third button in this page to see the pdf:
    https://vision-design.com/work/www.m2mfg.com/products/tiger-side-clipped-retail-complete-with-handles/
    This is the footer added via the ‘Page setup > Footer HTML’

    <div class="pdf-footer">
<img src="https://vision-design.com/work/www.m2mfg.com/wp-content/uploads/2020/04/M2-Logo.png" />
</div>

    and this is the CSS applied to it:

    @media print {
		header,
		.elementor-location-footer{display:none;}
		.pdf-footer img {float:left; max-width:160px !important; }
}

    The other css rules which hide the header and footer do work.
    Do you have any guidance about this?

    Thanks
    Dan

    The page I need help with: [log in to see the link]

Viewing 10 replies - 1 through 10 (of 10 total)
  • Plugin Author Pdfcrowd Dev Team

    (@pdfcrowd)

    Hello Dan,

    We run a separate conversion for the header and footer, so their style must be in the same HTML code.

    Use this “Footer HTML” for example:

    <style>
@media print {
.pdf-footer img {float:left; max-width:160px !important; }
}
</style>

<div class="pdf-footer">
<img src="https://vision-design.com/work/www.m2mfg.com/wp-content/uploads/2020/04/M2-Logo.png" />
</div>

    Best Regards,
    Pavel

    Thread Starter Dan Stramer

    (@danstramer)

    Thanks Pavel, so should I include all css styles for the footer or header in that textarea?
    And the “Created by PDFCrowd…” line will be removed after purchasing the license?

    Plugin Author Pdfcrowd Dev Team

    (@pdfcrowd)

    Yes, all css styles for the footer or header should be included in that textarea. That textarea can contain the complete HTML so you can use links to your stylesheets too, e.g. add to your footer HTML
    <link rel='stylesheet' href='https://your.domain/your-header-footer.css' />

    Yes, the “Created by PDFCrowd…” line will be removed for a valid Pdfcrowd license. You can activate the trial by the following link:
    — https://pdfcrowd.com/user/sign_up/?pid=api-trial2

    Thread Starter Dan Stramer

    (@danstramer)

    ok, great, thanks for the info.
    I also noticed there is a url on the top part of the pdf:
    https://vision-design.com/work/www.m2mfg.com/products/tiger-side-clipped-retail-complete-with-handles/?print=print

    How can it be removed?

    Plugin Author Pdfcrowd Dev Team

    (@pdfcrowd)

    It’s caused by your style.min.css a[href]:after:

    
@media print {
    ...

    a[href]:after {
        content: " (" attr(href) ")"
    }

    It append href to each link element when print media is used.

    You can remove it from your CSS.
    Or use our helper library to remove it, e.g. set the following line to “On Load Javascript” option:

    libPdfcrowd.insertStyle({style: '@media print {    a[href]:after {        content: none !important;    }}'});
    Thread Starter Dan Stramer

    (@danstramer)

    Thanks, removed via css.
    For future reference, where in the plugin’s UI do I add this option:

    libPdfcrowd.insertStyle({style: '@media print { a[href]:after { content: none !important; }}'});

    Plugin Author Pdfcrowd Dev Team

    (@pdfcrowd)

    You’re welcome.

    The option can be added to the “On Load Javascript” option on our settings “General Options” tab.

    Plugin Author Pdfcrowd Dev Team

    (@pdfcrowd)

    Note: here is the link to our JS helper library documentation which defines insertStyle function.

    https://pdfcrowd.com/doc/api/libpdfcrowd/

    Thread Starter Dan Stramer

    (@danstramer)

    Thanks. Much appreciated.
    A good sense of security purchasing the license when there is a good support team.

    Dan

    Plugin Author Pdfcrowd Dev Team

    (@pdfcrowd)

    Dan, you’re welcome.
    Our support is also available by email [email protected]

    Best Regards,
    Pavel

Viewing 10 replies - 1 through 10 (of 10 total)
  • The topic ‘Cannot control footer image sizes’ is closed to new replies.