Link to home
Start Free TrialLog in
Avatar of swpui
swpui

asked on

Printable version

How to provide a printer-friendly pages for the website visitors ? I mean they can print the website exactly on the A4 paper without the side navigation bar.
Avatar of Esopo
Esopo
Flag of United States of America image

Well, let's start with the basic. How is your info setup? I mean, do you have a database? are the pages created dynamically? Somehow I sense they are not.

The only time I did a printer friendly version for a website was a newspaper site were the articles were stored in a DB. The printer friendly loaded the article without the menus, banners and such.

Tell us how your site works and what kind of tools you have available (server side scripting, databases, time) so we can give you ideas.

Best regards,

Esopo.
That's the most foolproof way, to create a simpler text version of each page and provide a 'Printer Friendly' link to it.  You can still do this with dynamic content as E-E does (click the 'Printer Friendly' link on this page).  Check out the URL -> https://www.experts-exchange.com/Web/WebDevSoftware/DreamWeaver/viewQuestionPrinterFriendly.jsp?qid=21220645.  That's a simple page with a printer-friendly layout (viewQuestionPrinterFriendly.jsp) with content that is dynamically added (?qid=21220645) from their database.

You can find another option at www.dynamicdrive.com/dynamicindex9/printstyle.htm, but it looks like a lot more work, it isn't dynamic and it isn't cross-browser compatible.
Avatar of swpui
swpui

ASKER

HUMENIUK, pls tell me how am I going to write the jsp file and the ?qid=21220645.
ASKER CERTIFIED SOLUTION
Avatar of humeniuk
humeniuk
Flag of Canada image

Link to home
membership
This solution is only available to members.
To access this solution, you must be a member of Experts Exchange.
Start Free Trial
Avatar of swpui

ASKER

Sorry to tell you that I am not really familiar with the  server side scripting, we host under linux package which compatible with PERL, PHP, MYSQL. Previously our website is designed by a company, right now we would to try to modified by ourselve.  
PHP/MySQL is a great combo, but this isn't something you want to mess with unless you know what you're doing.  Therefore, your only real solution is to manually create printable versions of each static page.
>>Therefore, your only real solution is to manually create printable versions of each static page.<<
I Agree. Unless you plan to spend the next month learning how to code in PHP/Mysql, I suggest you manually create static pages. I suspect we are not talking about too many.

About the static printer-friendly pages:
It's very simple really. You basically copy the info you want to print to a stripped-down page with no menus, no ads, etc. All you want in the printer-friendly page is:
- Site logo
- Title of the article/page
- The URL where it can be found
- The info to be printed
- Some copyright information

Don't forget to use white background and perhaps even modify the logo or use an alternative one to reduce the use of ink. Don't touch the wrapping of the text, the browser will manage it properly as long as you don't force sizes.
Even easier -- set up a print style sheet. As long as your site uses CSS, you can define how you want the various styles to print, or not print at all.
Very good point, webwoman.
Avatar of swpui

ASKER

How to use CSS to print the style I want ?
You don't use CSS to print it. You use CSS to define what things print and how they print when the page is printed. Different animal entirely, and it depends on how you set up the HTML in the first place.

If you have tables for layout, font tags, and no style sheet to start with, nothing is going to work right. If you set up your file with divs, styles, and use classes/ids for all the major pieces, it's simple to have a print style sheet that hides some things and shows others - and some of those might not even show up in the onscreen version.

How is your document set up?  
Avatar of swpui

ASKER

Pls give step by step instruction on creating a css in dreamweaver mx and insert to a page where the page is printed in such a way without button and all the navigation bar.
Don't use DW. It's lousy for style sheets. Topstyle is good (www.bradsoft.com)

Learn CSS. It will help you immensely.

You can find a bunch of resources/examples at
www.csszengarden.com
http://www.ericmeyeroncss.com/
www.alistapart.com

for starters. There are lots more.

It's not possible to give you step by step instructions -- it's very likely you'll have to redefine your pages to have it work. But it will provide more benefits than just allowing printing the way you want. You'll have a much better structure, a much more flexible page, and maintenance will become tons easier.