I want to export a webpage to PDF.
I'm using the wp-mpdf plugin which is based upon mpdf.
The problem that I'm having is that I want to be able to export a high ress image if that is on the page.

E.g. The user uploaded a high ress image in a page. If WordPress saves images, by default it saves 3 different resolutions. So if the page is loaded in a browser the "small" image gets loaded. If the user clicks the 'export to PDF' button I want the highress image to be in the PDF. So what I did is create a new template that str_replace() the added image size in the filename. So if the export is made the High-ress image is loaded. Because the </span> around the image contains a class that tells the image to be loaded on the assigned size (300px x 300px) it shows the highress image on the right image size.

Now the problem is that a highress image is 11MB. If the image is scaled to 300px x 300px the image is 18MB. This is just one image. If the user has multiple images you can imagine how big the PDF becomes.

So my question is if it would be possible to have a Highress image exported to PDF but with a reasonable filesize.

Here is what I did in code:

//Standard Plan Template

global $post;
global $pdf_output;
global $pdf_header;
global $pdf_footer;

global $pdf_template_pdfpage;
global $pdf_template_pdfpage_page;
global $pdf_template_pdfdoc;

global $pdf_html_header;
global $pdf_html_footer;

//Set a pdf template. if both are set the pdfdoc is used. (You didn't need a pdf template)
$pdf_template_pdfpage       = ''; //The filename off the pdf file (you need this for a page template)
$pdf_template_pdfpage_page  = 1;  //The page off this page (you need this for a page template)

$pdf_template_pdfdoc        = ''; //The filename off the complete pdf document (you need only this for a document template)

$pdf_html_header            = false; //If this is ture you can write instead of the array a html string on the var $pdf_header
$pdf_html_footer            = false; //If this is ture you can write instead of the array a html string on the var $pdf_footer

$pdf_output = '<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
        <title>' . get_bloginfo() . '</title>
        <div id="header">
            <div id="headerimg">
                <img src="'.get_bloginfo('template_directory').'/images/logo.png" />
                <h1>'.get_bloginfo('name') . '</h1>
                <div class="description">
                    ' .  get_bloginfo('description') . '
        <div id="content" class="widecolumn">';

        if(have_posts()) :  while (have_posts()) : the_post();
            $pdf_output .= '<div class="post">
            <h2>' . the_title() . '</h2>';
            the_content('Read the full post',true);
            $postOutput = str_replace('-300x300', '', ob_get_contents());
            $pdf_output .= '<div class="entry">' .  wpautop($postOutput, true) . '</div>';
            // the following is the extended metadata for a single page
            $pdf_output .= '</div> <!-- post -->';

    else : endif;

    $pdf_output .= '</div> <!--content-->';

$pdf_output .= '

I hope somebody understands my pain and can help :-)

  • I don't full understand your question. I think you are mixing image size dimmensions with resolution, which is not the same. – cybmeta Jan 7 '15 at 13:57
  • I'm sorry for the unclearness. The 300px x 300px is image size dimension and the resolution should be around 300dpi. Like one would expect from a high ress image – Interactive Jan 8 '15 at 8:19
  • WordPress doesn't generate 3 versions with different resolution, WordPress generates 3 versions of different dimmensions. The resolution of the image is up to you. The only thing is that WordPress compress JPG images with 90% quality by default (not original, only the generated versions). You can use the filter jpeg_quality to change the compression qualitity. – cybmeta Jan 8 '15 at 8:41
  • Exactly. If the image is saved in it's custom dimensions (e.g. 300x300) and te page get's rendered it shows the image that has a added dimension to the filename. When the PDF is made I str_replace the -300x300 with nothing so the original High ress image is loaded. – Interactive Jan 8 '15 at 10:30
  • @cybmeta I've got a working solution. If you are interested: wordpress.stackexchange.com/questions/174702/… – Interactive Jan 13 '15 at 15:58

Your Answer

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

Browse other questions tagged or ask your own question.