How to remove the URL from the printing page?

Question

I want to remove the URL that gets printed on the bottom of the page.

like:

yomari.com/.../main.php?sen_n

How can it be omitted or prevent from getting printed?

To be more specific, is there any way I can prevent the page URL, date and the page title being printed along, while printing the web page?

Can that be done programatically? Its really a browser page setup! — Shoban, Feb 25 '09 at 09:12
Totally a 'browser page setup' thing. But I found [this tutorial](http://coding.smashingmagazine.com/2011/11/24/how-to-set-up-a-print-style-sheet/) a bit helpful for print page CSS. — Mayeenul Islam, Dec 30 '12 at 10:22
Tried these ? @page { margin: 0; size: A4; } html { background: #fff !important; margin: 0; } body { margin: 2cm; } — djibe, Dec 08 '22 at 18:39

score 156 · Answer 1 · edited May 23 '17 at 12:18

156

Following code sample will work for you,

<style type="text/css" media="print">
@page {
    size: auto;   /* auto is the initial value */
    margin: 0;  /* this affects the margin in the printer settings */
}
</style>

see the answer on Disabling browser print options (headers, footers, margins) from page?

and specification of the @page

edited May 23 '17 at 12:18

Community

1
1

answered Feb 20 '13 at 09:05

Chamika Sandamal

23,565
5
63
86

3

On Firefox 20.0 this doesn't remove URL from Print Preview – Mirzhan Irkegulov May 26 '13 at 07:05
2

Firefox solution: http://stackoverflow.com/questions/2192806/can-i-remove-the-url-from-my-print-css-so-the-web-address-doesnt-print#answer-25007332 – Konstantin Vdovkin Oct 22 '15 at 16:38
Great answer. Even better just set the bottom margin, e.g. `margin-bottom: 0mm;` – CompanyDroneFromSector7G Jan 06 '16 at 11:42
3

This actually **worked** on my Firefox 50 @MirzhanIrkegulov – ᴍᴇʜᴏᴠ Dec 03 '16 at 23:44
The topic starter asked how to remove top and bottom colontitles (url page number title) a browser adds during the print preview. – Pavel Nazarov Oct 09 '17 at 13:39
This doesn't work in all browsers: https://caniuse.com/css-paged-media – Flimm Feb 14 '22 at 15:29
3

How I can only remove the url but not the page number from the footer? – royallife Mar 02 '22 at 10:45

score 52 · Answer 2 · answered Apr 13 '16 at 12:40

i found something in the browser side itself.

Try this steps. here i have been mentioned the Steps to disable the Header and footer in all the three major browsers.

Chrome Click the Menu icon in the top right corner of the browser. Click Print. Uncheck Headers and Footers under the Options section.

Firefox Click Firefox in the top left corner of the browser. Place your mouse over Print, the click Page Setup. Click the Margins & Header/Footer tab. Change each value under Headers & Footers to --blank--.

Internet Explorer Click the Gear icon in the top right corner of the browser. Place your mouse over Print, then click Page Setup. Change each value under Headers and Footers to -Empty-.

score 24 · Answer 3 · answered Dec 18 '17 at 09:41

24

This helped me: Print page without links

@media print {
    a[href]:after {
        content: none !important;
    }
}

answered Dec 18 '17 at 09:41

mihaela

394
2
12

can you please explain this – M.suleman Khan Jun 30 '19 at 22:34
1

I had a problem with bootstrap hyperlinks showing its href content on print page. This solution helped me fix the problem. – Mohsin Jul 21 '20 at 15:37
for some reason i can't determine, this doesn't work for me. – Ezz Redfox May 25 '22 at 09:15

score 20 · Answer 4 · answered Oct 16 '16 at 06:10

20

If you set the margin for a page using the code below the header and footers are omitted from the printed page. I have tested this in FireFox and Chrome.

<style media="print">
 @page {
  size: auto;
  margin: 0;
       }
</style>

answered Oct 16 '16 at 06:10

Denver Chiwakira

1,059
8
8

3

Note that this removes the margin between pages in Firefox. Example: https://i.imgur.com/krDlC1K.png – Blaise May 31 '18 at 14:59

score 18 · Answer 5 · answered Feb 25 '09 at 09:18

18

Having the URL show is a browser client preference, not accessible to scripts running within the page (let's face it, a page can't silently print themselves, either).

To avoid "leaking" information via the query string, you could submit via POST

answered Feb 25 '09 at 09:18

Rowland Shaw

37,700
14
97
166

1

noooo ... POST is not an encryption mechanism - it's a hint about the possible side effects of the request. – troelskn Feb 25 '09 at 09:36
Instead of printhing a long multi line query string. I woul be happy to print just the url – Shoban Feb 25 '09 at 09:42
the query string is part of the url. if the url is too long, you should fix that instead. – troelskn Feb 25 '09 at 11:17
5

I didn't say it was an encryption thing -- it does remove the query parameters from the URL, which was a requested mitigation factor – Rowland Shaw Feb 25 '09 at 12:25

score 15 · Answer 6 · edited Jan 25 '18 at 10:13

15

Browser issue but can be solved by these:

<style type="text/css" media="print">
      @media print
      {
         @page {
           margin-top: 0;
           margin-bottom: 0;
         }
         body  {
           padding-top: 72px;
           padding-bottom: 72px ;
         }
      } 
</style>

edited Jan 25 '18 at 10:13

Granny

783
11
22

answered Jan 25 '18 at 09:38

Md. Hasibul Huq

159
1
3

1

Upvoted because you include CSS that puts margins back in place. Thx! – Tod Birdsall Jul 31 '20 at 14:39

score 8 · Answer 7 · edited Apr 14 '15 at 20:44

I am telling you about Mozilla Firefox ( I hope it should be same way in other browsers also).

Click on Firefox menu , Go to Print , Select Page Set Up from sub menu of Print. A pop will come up on your screen, there go to "Margin & Header /Footer" tab.

In that select "BLANK" for header / footer as per requirement before printing. You can check the preview for confirmation.

I hope this will help.

score 5 · Answer 8 · answered Dec 15 '17 at 06:02

5

Nowadays, you can use history API to modify the URL before print, then change back:

var curURL = window.location.href;
history.replaceState(history.state, '', '/');
window.print();
history.replaceState(history.state, '', curURL);

But you need to make a custom PRINT button for user to click.

answered Dec 15 '17 at 06:02

James Yang

1,306
4
15
25

1

Using your solution I still see the "http://domain-name.com" printed in the top right corner. It removed everything after that. – Tod Birdsall Jul 31 '20 at 14:32
This does not work inside SPAs, because the client side router changes the view before it can be printed. – Junaga Dec 19 '21 at 00:10
I tried all the solutions above within Asp.Net MVC 5 and none of them worked. While this one still leaves the main domain name, that is much more preferable than all the other parameters after so thanks! – Anthony Griggs Jun 03 '23 at 15:08

score 3 · Answer 9 · edited Oct 08 '18 at 13:14

3

@media print { a[href]:after { content: none !important; } }

edited Oct 08 '18 at 13:14

Papershine

4,995
2
24
48

answered Oct 08 '18 at 13:13

Rashid Khitilov

47
5

score 3 · Answer 10 · answered Apr 14 '20 at 02:56

3

This is working fine for me using jquery

<style>
  @media print { @page { margin: 0; } 
   body { margin: 1.6cm; } }
</style>

answered Apr 14 '20 at 02:56

Mugeesh Husain

394
4
13

score 3 · Answer 11 · answered Jan 18 '12 at 06:28

3

You can remove the url dispalying on the printed document via your browser settings.You just click file->page setup->header and footer set all things as blank.if you hav ie,you just remove &U from footer textbox.hopefully this will help you

answered Jan 18 '12 at 06:28

Anju

31
1

score 2 · Answer 12 · answered Feb 25 '09 at 09:18

I do not know if you are talking about a footer within your actual graphic or the url the print process within the browser is doing.

If its the url the print process is doing its really up to the browser if he has a feature to turn that off.

If its the footer information i would recommend using a print stylesheet and within that stylesheet to do

display: none;

For the particular ID or class of the footer.

To do a print stylesheet, you need to add this to the head.

<link rel="stylesheet" type="text/css" href="/css/print.css" media="print" />

score 1 · Answer 13 · answered Jan 14 '15 at 07:53

1

In Google Chrome, this can be done by setting the margins to 0, or if it prints funky, then adjusting it just enough to push the unwanted text to the non-printable areas of the page. I tried it and it works :D

enter image description here

answered Jan 14 '15 at 07:53

Ardee Aram

4,740
8
36
37

score 1 · Answer 14 · answered May 03 '17 at 01:19

On Chrome 57 the following worked for me, if you have control of the HTML page that needs to be printed (in my case I needed to print a small 3x1 inch label):

remove the HTML title element from header (either temporarily using jquery or permanently if that page does not really need a title)
set the @page margin to 0 as mentioned by @Chamika Sandamal

This resulted in printing a page that only contained the body text, no URLs, no page #s etc.

Sante · Answer 15 · 2023-01-25T20:14:27.363

1

Chrome headless now supports an extra options --print-to-pdf-no-header which removes header and footer from the printed PDF file

edited Jan 25 '23 at 20:14

answered Dec 30 '20 at 16:48

Sante

339
3
10

How can I use it? – unbreak Jan 19 '23 at 08:31
if you have chrome installed `/path/to/google-chrome --headless --disable-gpu --print-to-pdf-no-header --print-to-pdf=/path/to/file.pdf $url` – Sante Jan 25 '23 at 20:13
1

Thank you. I was specifically looking for this. I'm using chrome to generate large PDFs from a template and because it's being done inside a private server, it's leaking paths which I do not want – TheRealChx101 Mar 19 '23 at 16:09

score 0 · Answer 16 · answered Nov 25 '10 at 22:48

I have the same problem. I wonder if it is possible to create the HTML for printing via a jquery plugin: http://www.recoding.it/?p=138

Then send the HTML to a php script (using an ajax call), generate a pdf with http://www.xhtml2pdf.com/ or http://code.google.com/p/wkhtmltopdf/.

Afterwards the pdf could be displayed (by setting the appropriate content type and direct rendering) or displayed by a http-Redirect to the generated pdf.

The generated pdfs in the pfd_for_printing-folder could act as cache and be deleted by a job once a day.

I want to print part of the page (with styles) to PDF... How can I achieve that? http://stackoverflow.com/questions/25082395/how-to-export-a-auto-generated-html-to-pdf — SearchForKnowledge, Aug 01 '14 at 16:37

score 0 · Answer 17 · answered Jul 14 '18 at 12:42

0

<style type="text/css" media="print">
  @page {
    size: auto;  
    margin: 0;  
  }
</style>
//now set manual padding to body
<style>
  body{
    padding-left: 1.3cm;
    padding-right: 1.3cm; 
    padding-top: 1.1cm;
  }
</style>

answered Jul 14 '18 at 12:42

Rajiv Chaturvedi

1

this code remove only margin .that's why url not display .but when you use this you loss the page number. – Pramod Wayal Oct 19 '18 at 10:51
i want to only remove page url on print not page number – Pramod Wayal Oct 19 '18 at 10:51

score 0 · Answer 18 · answered Feb 25 '09 at 11:13

I would agree with most of the answers saying that its a browser settings but still you can achieve what you want via COM. Keep in mind that most browsers will still have issue with that and even IE will raise the COM security bar to users. So unless its not something you are offering within organisation, don't do it.

score 0 · Answer 19 · answered May 30 '23 at 08:59

The URL is used when the page has no title, so by setting a title via <tittle>My Site</title> you can avoid the current URL being used.

If printing is invoked by your site programmatically you can also change the document.title before and after printing. By using a invisible or zero space character you can hide it. For copying i put it between those 2 brackets: ()

score -1 · Answer 20 · answered Jul 23 '11 at 05:07

-1

Perhaps you could try chrome (Probably Safari also)

The url & the page number in the header & footer is not visible when I print to pdf on OSX with Google Chrome.

Sorry not sure if this applies to windows

answered Jul 23 '11 at 05:07

PhilD

749
1
5
8

score -2 · Answer 21 · edited May 13 '18 at 05:50

-2

I have a trick to remove it from the print page in Firefox. Use this:

<html moznomarginboxes mozdisallowselectionprint>

In the html tag you have to use moznomarginboxes mozdisallowselectionprint. I am sure it will help you a lot.

edited May 13 '18 at 05:50

Andrew Myers

2,754
5
32
40

answered Jan 23 '15 at 13:52

Aryan

1

score -2 · Answer 22 · edited Mar 08 '19 at 18:26

-2

This will be the simplest solution. I tried most of the solutions in the internet but only this helped me.

@print {
    @page :footer {
        display: none
    }

    @page :header {
        display: none
    }
}

edited Mar 08 '19 at 18:26

Brian Tompsett - 汤莱恩

5,753
72
57
129

answered Mar 08 '19 at 18:06

Zanyar J.Ahmed

31
1
8

1

In what browser does this work? In Chrome 80 it doesn't work. – Ruben S Mar 14 '20 at 07:49

score -3 · Answer 23 · edited Jun 13 '18 at 06:39

-3

@media print {
    #Header, #Footer { display: none !important; }
}

Check this link

edited Jun 13 '18 at 06:39

kapantzak

11,610
4
39
61

answered Jun 13 '18 at 04:20

Lien Vu

95
1
3

1

Hello welcome to SO, thank you for trying to answer this question. Can you provide more explanation behind your answer and the logic behind your fix? Cheers! – James Wong Jun 13 '18 at 04:31
1

Hi, Thanks, this works perfectly in chrome (at least), I don't know why people down voted this perfect solution. – Saman Aug 15 '20 at 10:46
@Saman Because this solution doesn't work except in extremely specific circumstances. Namely, if your header is called `#Header` and your footer is called `#Footer`. This probably works OK in some wordpress templates, but it won't work well anywhere else. Besides which, it doesn't answer OP's question, which was about hiding the URL created by the browser, not the header/footer. I'm surprised it doesn't have more downvotes, frankly. – Eliezer Berlin Nov 11 '20 at 09:44

How to remove the URL from the printing page?

23 Answers23

Linked

Related