Support » Plugin: Print-O-Matic » Print popup content

  • Resolved jvennard

    (@jvennard)


    We are using a listing plugin and when you click the quick preview, we want to have a coupon that can be printed. However, the print icon does not work on the pop up window. It works fine on a regular page but not on the popup. You click the print and nothing happens. Can someone please advise how we can make this work?!

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

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

    (@twinpictures)

    ok. so the ‘pop up’ is a modal window. since this is loaded dynamically, the shortcode needs to be loaded someplace on the launching page so that all the scripts are enqueued.

    Just include a ‘hidden’ print trigger like so:
    [print-me id="some_unique_name" printstyle="external"/]

    Give greetings to North Texas. Good memories in and around Denton back in the 90’s

    Thread Starter jvennard

    (@jvennard)

    Thanks for the quick follow up, and absolutely on the shout out! Forgive us as we are trying a lot of things to make this work, and we probably did not do it right. Here is what we currently have: https://www.screencast.com/t/ykJddxVv

    When you try it, there is no longer a print option. Would we need to move the shortcode further up in the code? Is that what you are referring to as it needs to be loaded earlier on? So instead of inside that div which is the popup window, we could move it somewhere else on the page?

    Plugin Contributor twinpictures

    (@twinpictures)

    aw, see, now I want to ask you ’bout yer mom’n’em. hihihi.
    regarding:

    Is that what you are referring to as it needs to be loaded earlier on?

    yes.

    on the page that launches the coupons, there needs to be a ‘hidden’ print target that loads all the magic that allows the shortcode to work.

    think of it this way:
    step 1 – load a hidden print trigger that loads the scripts. this does not have to be hidden… you can just place a standard print-me shortcode on the main page that launches the coupon in the pop-up modal window.

    step 2 – use the print-me. shortcode as normal in the modal window.

    step 3 – there is no step three. you are done.

    ping us back if you need more assistance, or if you’re all good.

    • This reply was modified 3 months, 2 weeks ago by twinpictures.
    Thread Starter jvennard

    (@jvennard)

    Thanks for the fast replies…we will try not to keep bothering you 🙂

    Here is what we did, we loaded the “hidden” print shortcode in the header for that page like so: https://www.screencast.com/t/xi917xpvdp

    We then added the shortcode for the popup modal like so: https://www.screencast.com/t/MztYvkxa6m3

    However, when you click the print, it still does not work. I am sure it is something simple we are missing, but we have been working on this project all week and perhaps we just need a break haha. Anyways, thanks for your awesome support thus far!

    Plugin Contributor twinpictures

    (@twinpictures)

    if you like, reach out to: info [at] twinpictures [dot] de with (important) a link back to this thread (/important) and we’ll help you get this resolved, quick-like.

    Thread Starter jvennard

    (@jvennard)

    Just sent an email

    Thread Starter jvennard

    (@jvennard)

    Hi Again!

    Quick follow up to our recent communication. We were testing things today and we notice that when we go to print our coupon, it is aligned to the right and is getting cut off. We are assuming this is due to the way the pop is setup. Is there a way to fix this or dictate how the print information is aligned?

    Plugin Contributor twinpictures

    (@twinpictures)

    in the plugins Custom Print Page Style section try adding the following:

    .coupon-print {
       width: 100%
       float: left;
       text-align: left;
    }
    Thread Starter jvennard

    (@jvennard)

    Tried and it doesn’t seem to work unfortunately 🙁

    Plugin Contributor twinpictures

    (@twinpictures)

    ok, give us a moment and we’ll get another solution to you.

    Plugin Contributor twinpictures

    (@twinpictures)

    puh, not a fun one this.
    OK, we figure out that this is based on a parent container.
    In the plugin settings you will see we added:

    @media print{
        .ui-widget-content {
             left: 0 !important;
        }
       .coupon-print {
          border: 4px dotted blue !important;
       }
    }
    

    the .coupon-print border stuff can be removed, it was just to test.
    Note: this is NOT in the print-page CSS area, but in the display css area. and if you REALLY want to do this correct, it should be added to your theme’s quick css section (if it has one) or it’s style.css file. Also notice it’s using
    @meda print

    you can google that if you want to learn more about print-only css.

    But that should be enough to get your started.
    if you wanted to move it to the top of the page, you would need to add something like:
    top: 0 !important;
    to the special css recipe above.

    Hope that puts a smile on your face!

    Thread Starter jvennard

    (@jvennard)

    YES! You rock as usual. THANKS A TON!!

Viewing 12 replies - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.