Register

If this is your first visit, please click the Sign Up now button to begin the process of creating your account so you can begin posting on our forums! The Sign Up process will only take up about a minute of two of your time.

Results 1 to 8 of 8
  1. #1
    Member ladydiella's Avatar
    Join Date
    Mar 2009
    Posts
    45
    Member #
    18566
    I would like a button to print my resume on my portfolio website. I have found many codes that print the entire page but I would like to just be able to print my resume "resume.gif" from a button, not a link.

    I am currently using this code

    <p><input name="cmdPring" value="Print Resume" onclick="parent.print()" type="button"></p>

    Here is the page, I have a "print button" up right now (above code) but it prints the entire page

    http://daniellasweb.com/resume.htm


    Thanks for your help!

  2.  

  3. #2
    Member
    Join Date
    Nov 2005
    Posts
    55
    Member #
    11943
    You should be able to do this with CSS.
    Create a print style sheet and hide the elements of your page that you don't want to print. You should also be able to style your resume so that it's more printer friendly. (color, fonts, layout, etc.) So it will look one way online and another when you print it.

    Code:
    <link rel="stylesheet" href="print.css" type="text/css" media="print" />
    'media="print"' as opposed to 'media="screen"'

    I've only tested this once, but it worked great. You might get more expert advice in the CSS forum - along with some references.

    Good luck.

  4. #3
    Member ladydiella's Avatar
    Join Date
    Mar 2009
    Posts
    45
    Member #
    18566
    Hey thanks for the reply. I ended up getting it work by just making the code I had,

    <p><input name="cmdPring" value="Print Resume" onclick="parent.print()" type="button"></p>

    a link to my resume.pdf (daniellasweb.com/resume.pdf). It over wrote the button code so I still have the image of the button but it became a link to a pdf.

    Your link is a good option too but how would I hide what I didn't want printed?

  5. #4
    Member
    Join Date
    Nov 2005
    Posts
    55
    Member #
    11943
    how would I hide what I didn't want printed?
    If you have your HTML set up with divs that are named with either an id or class, you can hide them in the CSS by using either "visibility: hidden;" or "visibility: visible;"

    And again, you should be able to format these divs so that they look and perform differently online or printed. It's pretty slick.

    Glad you got your resume to work.

  6. #5
    Member ladydiella's Avatar
    Join Date
    Mar 2009
    Posts
    45
    Member #
    18566
    what if the pages are set up with tables, as are mine :cry:

  7. #6
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    Or display: none, mind you.

    If your pages are laid out with tables, you may still be able to hide the relevant table sections, but it is likely to be significantly more difficult.

  8. #7
    Member
    Join Date
    Nov 2005
    Posts
    55
    Member #
    11943
    I suppose you could try adding an id or class to certain cells or rows and hide (or "display:none;" as Shadowfiend indicates) or reshape sections of the table depending on measurements in the different style sheets.

    But I would think you'd have to be careful how the tables are structured. I'm brainstorming without testing. Take this with a grain of salt, and see what happens.

    It took me a while to move beyond making table based websites.

  9. #8
    Senior Member
    Join Date
    Jun 2005
    Location
    Atlanta, GA
    Posts
    4,146
    Member #
    10263
    Liked
    1 times
    It would definitely require great care. A lot of CSS properties don't work so hot on table cells and table rows. Others require some tweaking or working around. It's been quite a few years since my last table-based layout, so I'm not entirely certain what works where anymore. Definitely worth experimenting with, however, as it's always nice to keep a single page for both regular and print view.

    For an okay example of how to achieve this, see http://gtmun.org/. This is a site I built a few years ago, and the print version (in print.css) strips most of the header and menu information from the printed page. See also the countries page. In general, this lets you control your print look entirely separately from your regular web look. Keep in mind that in print stylesheets it makes particular sense to use measurements like inches or centimeters instead of pixels (e.g., for margins).


Remove Ads

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •  

Search tags for this page

ajax print button
,
button to print a table
,
how to code print button to only print displayed table
,
print button code
,
print button codes
,
print button css code
,
print button without javascript
,

what is the code to print only a section of a web page

Click on a term to search for related topics.
All times are GMT -6. The time now is 01:07 AM.
Powered by vBulletin® Version 4.2.3
Copyright © 2019 vBulletin Solutions, Inc. All rights reserved.
vBulletin Skin By: PurevB.com