We launched new forums in March 2019—join us there. In a hurry for help with your website? Get Help Now!
    • 21112
    • 156 Posts
    I’m kinda flooding the forum lately... Sorry if it’s too much, but this project it pushing the limits of my abilities, so the help is welcome!

    I want to load the current page in a new (popup) window styled with the printer friendly style sheet. I’ve tried a couple of different methods, so far without success.

    First I tried the method described here: http://www.maratz.com/blog/archives/2004/09/21/10-minutes-to-printer-friendly-page/

    I’m not exactly sure where this went wrong, but seemed to apply BOTH styles, which hid much of the page (as per printer friendly version) even when the parameter for the printer version wasn’t appended to the url.

    Then I tried this method: http://inobscuro.com/tutorials/read/27/

    This one seemed to cause a php error. The page was tendered without any style, and the last 4 characters of the php were drawn at the top of the page: ’;?>

    Any suggestions? Could this be due to the page already being the output of a php file?
      • 33372
      • 1,611 Posts
      You may be going about this the hard way. All you need in order to have printer-friendly pages is a separate CSS file with media="print" at the end of its link. Then you can just have a javascript link to window.print() and the page will be sent to the printer using the printer-friendly stylesheet. No PHP and no pop-ups.

      You could just load the document into a new page if you really want to by creating a template using just the printer-friendly CSS file and a simple snippet that takes the id of the page that you want to print from the query string, grabs that document content, and outputs it to your printer-friendly pop-up page.

      I’m not sure what the benefit of doing it that way would be, though, since it adds a pop-up (blocked by many browsers nowadays) and an extra step to the process of printing - plus it’s more work!
        "Things are not what they appear to be; nor are they otherwise." - Buddha

        "Well, gee, Buddha - that wasn't very helpful..." - ZAP

        Useful MODx links: documentation | wiki | forum guidelines | bugs & requests | info you should include with your post | commercial support options
        • 7455
        • 2,204 Posts
        css works best I think try printing one of these sites I made

        http://rotec.tidestream.com/index.php?id=20
        http://esailing.nl/index.php?id=194
        http://eninver.1-vision.nl/contact/route.html

        all done with css and some hidden divs

        greets Dimmy
          follow me on twitter: @dimmy01
          • 21112
          • 156 Posts
          Unfortunately, the client’s request is very specific. They want users to click on a "print page" icon, which pops up a new window with the same page displayed with the printer friendly version. I understand php is the only way to do this. I’m sure the problem I’m having is a simple php pgogramming issue that someone with php skills would be aboue to diagniose and fix. However I am not that person.

          I agree your suggestions are better and more logical, but the client won’t be convinced. Thank you for taking the time to reply! smiley

          Any suggestions?
            • 4971
            • 964 Posts
            It has to be a popup or another window...
            you can use the "target=_blank" to open in another window (there most be a way to make it popup)
            and then apply the media="print" CSS Stylesheet and then print...

            other ways:
            1) make a javascript popup... everybody is going to hate you and the popup blockers will have a feast...
            2) make an AJAX popup using slimbox or thickbox or lightbox or one of those libraries to make the popup while fading the current page...
              Website: www.mercologia.com
              MODX Revo Tutorials:  www.modxperience.com

              MODX Professional Partner
              • 21112
              • 156 Posts
              Thanks for the reply.

              I’ve had no problem making the window popup. The problem I have is making the printer style sheet load in the new window, without also changing it in the source window. I tried using a style sawitcher, but that changes the style in both pages. The php thing should work, because it passes which style should be loaded to the new page via the addition to the url ?style=printerFriendly However the php is simply not doing what it is supposed to. Here’s the code I’m using at the moment. It might help someone to spot where my error is:

              Php replacing the usual style sheet call in the usual place:
              <?php
                  if($style == 'printFriendly') $stylesheet = 'assets/css/hjprint.css';
                      else $stylesheet = 'assets/css/hjmain.css';
                  echo '<link rel="Stylesheet" href="'. $stylesheet .'" type="text/css" />';
              ?>
              The link to the printer friendly page:
              <a href="[~[*id*]~]&style=printFriendly" target="top" title="Print View"><img src="images/menubutt3.gif" width="32" height="26" alt="Print" border="0" oversrc="images/menubutt3-on.gif" /></a>
              The HTML code output containing the php script (obviously not working as this should just look like a normal style sheet call):
              <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
              <html xmlns="http://www.w3.org/1999/xhtml">
              <head>
              <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
              <title>Harry Jenkins MP</title>
              <script src="http://www.orionvisuals.com/wip/harryjenkins/styleswitcher.js" type="text/javascript" language="Javascript"></script>
              <?php
                  if($style == 'printFriendly') $stylesheet = 'assets/css/hjprint.css';
                      else $stylesheet = 'assets/css/hjmain.css';
                  echo '<link rel="Stylesheet" href="'. $stylesheet .'" type="text/css" />';
              ?>
              <link id="iecss" rel="stylesheet" href="assets/css/hjie.css" type="text/css">
              ...etc
              
              Link to the page as it is at the time of this post with the erroneous output:
              http://www.orionvisuals.com/wip/harryjenkins/

              Thank you!
                • 4971
                • 964 Posts
                Mmmm... that looks OK to me...

                Could you load the normal page and then use the DOM with Javascript to switch the href of the CSS?

                Your "source" would be ’assets/css/hjprint.css’ and the "destination" is ’assets/css/hjmain.css’.
                Then use destinationObject.setAttribute("href", source); to switch the stylesheet... just an idea...
                  Website: www.mercologia.com
                  MODX Revo Tutorials:  www.modxperience.com

                  MODX Professional Partner
                  • 21112
                  • 156 Posts
                  I’m not familiar with using the DOM to do that. Is that something that I would be able to pass on to a new page via the URL though? Or would it only be changing the existing page by swapping the style sheet? If the latter, I’ve already been able to do with with a style switcher javascript, but it’s not what the client wants. If it’s the former, how do I pass the value to the linked page?

                  I’ve been experimenting with the php to try and narrow down the problem. I’ve made the following test page: http://www.orionvisuals.com/wip/harryjenkins/phptest.php

                  The file has the following code:
                  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml2/DTD/xhtml1-strict.dtd">
                  <html xmlns="http://www.w3.org/1999/xhtml">
                  <head>
                  <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
                  <title>Harry Jenkins MP</title>
                  <script src="http://www.orionvisuals.com/wip/harryjenkins/styleswitcher.js" type="text/javascript" language="Javascript"></script>
                  <?php
                  	if($style == 'printFriendly') $stylesheet = 'assets/css/hjprint.css';
                  		else $stylesheet = 'assets/css/hjmain.css';
                  	echo '<link rel="Stylesheet" href="'. $stylesheet .'" type="text/css" />';
                  ?>
                  
                  <body>
                  
                  <p>testing</p>
                  
                  <p><a href="?style=printFriendly">Print view</a></p>
                  
                  <div id="printhide"><p>Should be hidden in printer view</p></div>
                  
                  </body>
                  </html>


                  I’m not having a problem in this example with the php failing to replace the style sheet. When looking at the generated code, there’s no php to be seen, only a style sheet link in its place. However the swapping isn’t working. If you click on the link in the page, and then look at the new page’s source, you will see it’s using the default css - hjmain.css - not the printer version - hjprint.css -. If I reverse the two in the php and put the main css in the line "if($style == ’printFriendly’) $stylesheet = ’ then the printer version of the style is loaded, and when the link clicked - it stays the same. It seems that the SECOND style sheet referenced in the php is used, regardless of the arguments appended to the url linking to it.

                  So this doesn’t shed any light on why the php isn’t working on the main site, but adds another new problem into the mix! This is getting frustrating...
                    • 21112
                    • 156 Posts
                    It was suggested to me that it might be a register globals problem, and I should use this code:

                    if($_GET['style'] == 'printFriendly')


                    That’s a step forward! The test file I made is now working:
                    http://www.orionvisuals.com/wip/harryjenkins/phptest.php

                    However the version on the live site is still showing the same problem where the php code doesn’t seem to be executing, but it being parsed as-is to the html file.

                    It’s just occurred to me that i mught need to use some special MODx code to insert php directly into a template, so I’ll go look at that.

                    Edit: That was it!! I turned the included php code into a snippet and it worked! This is where I got the info that finally made it all fit into place: http://modxcms.com/forums/index.php/topic,3790.0.html