homepage Welcome to WebmasterWorld Guest from 54.237.98.229
register, free tools, login, search, pro membership, help, library, announcements, recent posts, open posts,
Pubcon Platinum Sponsor 2014
Home / Forums Index / Code, Content, and Presentation / XML Development
Forum Library, Charter, Moderators: httpwebwitch

XML Development Forum

    
How to make print page in the best way using XSLT?
toplisek

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3818347 posted 6:32 am on Jan 3, 2009 (gmt 0)

I have article page and would like to make it XSLT page which uses header and footer from XSLT (title of article, footer is copyright) and body is from article content.

How to do link to print this page and using XSLT?

Output is to print media and PDF.

 

httpwebwitch

WebmasterWorld Administrator httpwebwitch us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3818347 posted 2:37 pm on Jan 5, 2009 (gmt 0)

You can use a different CSS stylesheet for the printed version, where nonessential elements are hidden using "display:none", font colors are greyscaled and layout is optimized for a 8.5x11 page

W3C explains [w3.org]

toplisek

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3818347 posted 5:31 pm on Jan 5, 2009 (gmt 0)

Is there some working printing sample scripting to see how to make link which will open window of printing and use print.css?

httpwebwitch

WebmasterWorld Administrator httpwebwitch us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3818347 posted 7:36 pm on Jan 5, 2009 (gmt 0)

you want to open a new window containing a "print-friendly" version of an HTML page? Here's one way...

here's how you link to it
<a href="your_page.php?printable=true" target="_blank">print</a>

Then on your HTML page, drop in a little server-side script that includes the "print.css" if the magic querystring is there.

here it is, in PHP. Put this in your <head>:

<?php
if(isset($_GET['printable'])){
echo "<link rel='stylesheet' href='print.css'/>";
}else{
echo "<link rel='stylesheet' href='style.css'/>";
}
?>

Then create a "print.css" which removes all the page fluff, greyscales all the colors, etc.


*{color:black;}
#nav{display:none;}
#ads{display:none;}
/* etc etc */

That's the forceful way to do it, totally browser-compatible, and you won't need to fret about client-side XSLT or support for "media" filtering in your stylesheets.

As for XSLT... Client-side XSLT only works if your source document is XML. I'm assuming* you're working with HTML pages, so XSLT is not an option there.

* correct me if I'm making a false assumption

Rendering a print-friendly page using server-side scripting is effective. But that's not the "right" way to do it.

What if someone presses Ctrl-P when they're on your page? they're not opening a new window to get a customized print-friendly version rendered by the server, they're printing the current page, wihtout the "?printable" querystring. For these people, you should also include the "print.css" version on the page using "media-dependent cascades", the W3C way:


<head>
<LINK rel="stylesheet" [red]media="aural"[/red] href="aural.css" type="text/css">
<LINK rel="stylesheet" [red]media="screen"[/red] href="screen.css" type="text/css">
<LINK rel="stylesheet" [red]media="print"[/red] href="print.css" type="text/css">
</head>
source [w3.org]

When the user views the page on their screen, they get the "screen.css" rendering. When they print it (to their printer, or to PDF, doesn't matter), they get the "print.css" rendering.

Combine both techniques and you'll have excellent printable results either way.

Cheers

toplisek

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3818347 posted 9:56 pm on Jan 5, 2009 (gmt 0)

Just this,how to do link Print this page and it opens window to print?

httpwebwitch

WebmasterWorld Administrator httpwebwitch us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3818347 posted 11:41 pm on Jan 5, 2009 (gmt 0)

<a href="#" onclick="print();return false;">Print this page</a>

toplisek

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3818347 posted 10:33 am on Jan 6, 2009 (gmt 0)

Hi,
thank you. It works.

I need the following information:
1. If user prints with CTRL+P and it will be using in this case <head>
<link rel="stylesheet" media="print" href="print.css" type="text/css">
</head>

how it will know which file will be used as I have already on server print friendly page.

2. I have issue how to make automatic opened also not ONLY print firendly page BUT also window to print. You code shows redirection to printed page but need also shown window to print.

3. If I put code to recognise GET value (printed value), how I include this link into head tag? PHP code does not go into head tag...

thank you for your help.

httpwebwitch

WebmasterWorld Administrator httpwebwitch us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3818347 posted 4:40 pm on Jan 6, 2009 (gmt 0)

1.
If the page is being rendered by a printer (or, a printer-like agent like PDF Distiller), it will use the CSS defined with "media='print'". That's how it works in theory, anyways. It'll print whatever the current page is, using the stylesheet intended for print.

If you already have a server-generated print-friendly page, then that's just another page which people can view and print. How you want to direct your users to print stuff is a useability decision, not a technical challenge.

Examples:
a) many (I'd say most) sites don't provide a separate window of content for the printable version. If they do anything, they just use the CSS with media="print", and when you print it you get a simpler layout with all the chrome (navigation, ads, comments, etc) hidden. This is good for blogs, articles, information, education and brochureware sites.

Mind you most sites actually pay no attention to this at all, hence they look awful when you print them, and it wastes a lot of paper. I occasionally kill trees to print stuff when I want to do supplemental reading outside on a sunny day, and I get annoyed when a 2-page article uses 12 pages of paper to print out all the navigational fluff, badly positioned graphics, awkwardly wrapped relics of <table> layouts, etc.

b) one cooking/recipe site I've been to provided a printable version of its recipes, laid out so it is the size of an index card. The content is significantly reformatted and reworked in ways that CSS can't accomplish, so they provide this in a popup window which automatically starts a JavaScript "print()" command.

c) go and see what happens when you print a google map. (click the Print icon above the map)

d) go and see what happend when you print a wikipedia page. (use "Print Preview")

e) One blog I subscribe to omits all the comments from their print CSS. When you print, all you get is the original article. I like that... sometimes. Other times I do want to have all the comments, but que sera sera

2.
If you want the page to print as soon as it's opened (like, a popup window with a
print-friendly version of your content in it), then put this in the head:


<script> window.onload = function(){print();} </script>

3.
you can totally put code in the <head>.


<head>
<?php
// your code goes here, and it is perfectly legit
?>
</head>

toplisek

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3818347 posted 7:25 pm on Jan 6, 2009 (gmt 0)

Hi,
now is only missing one item:
4.How to avoid in printed page ads and comments with PHP code?
Is there some good way or I have to manually remove in printed firendly page all unwanted items?

I would like to include in print friendly page content but without ads and comments.

I guess there is some way...it seems like CMS system to edit and publish.

httpwebwitch

WebmasterWorld Administrator httpwebwitch us a WebmasterWorld Top Contributor of All Time 10+ Year Member



 
Msg#: 3818347 posted 10:01 pm on Jan 6, 2009 (gmt 0)

in your print.css, select the elements you don't want to print and style them with "display:none"

or, use an "if" condition in PHP


<?php if(!isset($_GET['printable'])){ ?>
hide me
hide me
hide me
hide me
<?php } ?>

toplisek

WebmasterWorld Senior Member 5+ Year Member



 
Msg#: 3818347 posted 6:38 am on Jan 7, 2009 (gmt 0)

How to make hidden text (ads), as code which will be hidden?

Global Options:
 top home search open messages active posts  
 

Home / Forums Index / Code, Content, and Presentation / XML Development
rss feed

All trademarks and copyrights held by respective owners. Member comments are owned by the poster.
Home ¦ Free Tools ¦ Terms of Service ¦ Privacy Policy ¦ Report Problem ¦ About ¦ Library ¦ Newsletter
WebmasterWorld is a Developer Shed Community owned by Jim Boykin.
© Webmaster World 1996-2014 all rights reserved