Build Your Own Business Website header image

A Conversation About Making a Print Version of Web Page

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

In this session a member asks how to make her website printer-friendly so that when someone goes to print, it actually looks like the Web Page. The method of making a page the right size for a printer involves moving some content around a bit unless you can make the web page narrow enough so that it fits the page when it gets printed. There are plugins that can be used to make a page printer-friendly. Another alternative is to create a print CSS file on your Thesis site.

Video Transcript

Rick: Okay Carol is with us. Good morning Carol, I’ve unmuted your microphone.

Carol: Hello.

Rick: I can barely hear you. Can you speak up or maybe turn up the volume or something?

Carol: Hello?

Rick: Perfect, that’s perfect.

Carol: Alright.

Rick: Okay so you would like to…what do you want to do?

Carol: I would like to make the website, the web pages printer friendly.

Rick: Okay.

Carol: When someone goes to print that it actually looks like the web page.

Rick: It still looks like the web page but it’s small enough that it fits on a page.

Carol: Right, correct.

Rick: Oh dang. I was going to give you the answer to that question except I don’t know the answer to that question. Well, the problem is that all the methods of making a page the right size for printers involves moving the stuff around a bit. For example, you know, this video is…. I don’t know, what is it?300 pixels wide. There’s no kind of CSS that can make this 300 pixel wide video 200 pixels wide or 75% is wide. And so, what they do instead of that is they would take the sidebar content and put it below the page content. And that is the typical method of dealing with this sort of thing and I was going to suggest a plugin to you that will create printer-friendly pages but it won’t do it the way you just asked. I don’t know of anything that you can do to do that except to actually make the page narrow enough so that it can be printed on a printer as it is.

Carol: So if you don’t… I mean I have looked at plugins and a couple of them work pretty well but there’s advertising associated with it and I don’t want that.

Rick: Okay well the plugin I was going to suggest and it’s the plugin that’s being used… I didn’t picked this. I helped this developer a little bit on the site and I didn’t pick this plugin for her. But she picked it and it seems to work pretty nicely. It’s this print-friendly printer icon and if you pretty that, here’s what the printing looks like. And you know, you can print it to PDF. Oh, there is advertising. You know, I never noticed that. I see. You know, I never actually pressed the PDF before so I didn’t notice that it does in fact, have advertising in it. I see. I was going to say this is a really useful little dillybob but now that you… I wouldn’t really like advertising in it either. Here’s what the PDF looks like when it’s done which is fine.

Carol: You can actually get this without advertising for a monthly fee, of course.

Rick: I didn’t know that. I didn’t know that. How much is it?

Carol: You know, I don’t remember. I think tis’ something like $4 and something like that which if you just have one website and that sort of thing maybe would be worth it. But if you have you know, several websites you’d like to use this to make printer-friendly, it adds up very quickly.

Rick: Yeah. Well, I can see that. I’m just playing around for a second with it on my end here, see what comes up when I just hit the print button. Oh, I see. Printing your page, you still get the ads so you always get these ads while you’re waiting. I see. Well, that’s kind of clever actually on their part. It’s a very nice facility you know, it’s a very nice facility. I wonder if there’s some way you could disable it. I don’t know if there’s some way…

Carol: Probably not since it’s a revenue stream for them, you know?

Rick: Yeah. Okay well, the alternative to that is to have a print CSS file that will essentially reconfigure that page so that it prints it. And that print CSS file can in fact, remove the sidebars. Let’s see what happens if I just print this. Print, okay let’s see. Let’s print it in PDF and see what it looks like.

Okay this is what the page looks like with the standard Thesis print ability.

Carol: Yeah you get all of that first structure information before you get to the website.

Rick: Yeah although you could quite easily include in your custom CSS that you know .menu is display none so that the menu doesn’t show up and then it comes down to this. And you could also do the same thing for sidebars you know, .sidebars is display none and then it would just create… and then it would just print the page itself plus this little header up here. You know, this is going beyond the scope of a beginning lesson or of a beginner question but I think actually, print CSS… if you’d give just a moment, I’m going to look and see if I can find the print CSS file.

Okay let’s see, so yeah source files. No, that’s interesting. There isn’t a print CSS so that’s what you would do is you would create a print CSS. Now, I’d be glad to do a little tutorial on that if you’d like on how to create a print CSS for your Thesis site because I think if… I mean, it’s the first time anybody’s asked me the question but certainly, a print CSS shouldn’t be very difficult to come up with there. And then with that print CSS file, you could get this to print, maybe even some of the header to print but exclude sidebars, footer, and menu.

Carol: Yes, I think that would be a useful tutorial.

Rick: Okay. Well, I’m going to put that on a list for next Wednesday. And so, in one of the sessions next Wednesday, I’ll do a presentation on how to create a print CSS file for it.

Carol: Terrific. I’ll try to make sure I sign up for that then.

Rick: Okay well actually, if you indicate sort of in advanced to me which one you’re going to sign up for, I’ll make sure I’d do it on that time.

Carol: Okay great.

Rick: Okay?

Carol: Thank you very much.

Rick: You’re welcome. Anything else?

Carol: No, I think that’s it.

Rick: Okay great. Well, have a good day Carol.

Carol: Thank you.

0 Comments… add one

Save $200 on Membership Now!

Start learning today for as little as
$0.82 PER DAY!
Subscription Options
0 comments… add one

Leave a Comment