Images printing across pages

  • Hi there,

    We have an interesting issue on our site where we call the Print-O-matic plugin via a shortcode on a certain number of pages as we already have it set up to work automagically with products in our WooCommerce area.

    The one things we’ve noticed is that when images are loaded into the Print-o-matic screen, they don’t get treated the same way as text and are cut off at the bottom of the first page.

    Do you have any suggestions as to why this could be? Thanks in advance.

    https://testing.atkeyandco.com/regency-exemplar-one/

Viewing 7 replies - 1 through 7 (of 7 total)
  • Plugin Contributor twinpictures

    (@twinpictures)

    Well Hello!

    Sounds like a simple CSS fix would do it:

    img {
    page-break-before: auto;
    page-break-after: auto;
    page-break-inside: avoid;
}

    Let us know how it goes for you.

    Thread Starter charliejustus

    (@charliejustus)

    Thank you for getting back to me so quickly!

    I hope you can see this, as it unfortunately didn’t work.

    Image gone wrong

    It did however spark an idea in me that some of the img CSS might be doing strange things (I inherited this website and the previous web guy liked to play with a lot of extraneous CSS code). I might have a wander through it and see what’s what but any other ideas are most welcome!

    • This reply was modified 7 years, 5 months ago by charliejustus.
    • This reply was modified 7 years, 5 months ago by charliejustus. Reason: image wasn't loading
    Thread Starter charliejustus

    (@charliejustus)

    Howdle Doodle,

    I have figured out a thing and I think it would be pertinent. This is a Woocommerce site and each of the images there has a second image hidden away, which I think gets messy when the page dimensions change. It might be that I have to figure out what dimensions work best for printing and then everything will work like it should.

    Plugin Contributor twinpictures

    (@twinpictures)

    Check out this post:
    https://tympanus.net/codrops/css_reference/page-break-inside/

    it covers exactly the issue you are dealing with.

    You might try:

    @media print {
    img {
        display: block;
        page-break-inside: avoid;
    }
}
    Thread Starter charliejustus

    (@charliejustus)

    Amazing but still it doesn’t soothe the savage breast. I bet it’s something stupid in the coding backend. We’re having to use an ancient version of WordPress and woocommerce atm as the site’s had a lot of bespoke hacking do it and quite frankly I don’t know what’s been done. It could be a by product of all of that.

    I really appreciate your help and I’ll keep trying to get this silly thing working.

    Plugin Contributor twinpictures

    (@twinpictures)

    But the issue is more of a CSS issue than anything else.
    we’ll do some testing on our test-server and get back to you with the soothing sounds of Koko Goldstein’s Yacht Rock a working solution.

    Plugin Contributor twinpictures

    (@twinpictures)

    Actually, the default behavior is to NOT split images:
    https://spacedonkey.de/2968/print-o-matic-and-print-pro-matic-preventing-split-images-across-pages/

    Try NOT including your theme’s CSS and see if the image-splitting still occurs. If not, then just add the CSS needed to display your print page as your desire.

    Best of luck!

Viewing 7 replies - 1 through 7 (of 7 total)
  • The topic ‘Images printing across pages’ is closed to new replies.

Tags