0

I'm trying to save a webpage as a PDF on my Mac and it's horrible! Using Safari with the File > Print option seems to be the best, because I have to have the URL of the page displayed, however this way all the links on the page are displayed and it looks very messy.

enter image description here

What is the best way to solve this - is there any way to stop Safari from adding all the links? Also I've tried Chrome, Firefox, loads of online converters and apps, all crap.

1
  • All URLs of each hyperlink is displayed. Like on the navigation bar- next to each item like About Us, Contact Us etc the URL of the link is displayed. It looks v messy. What I dislike is the messiness of it - all the hyperlinks being written out next to the link, and the layout is messy - some columns are pushed below the main content of the page, some columns overlap. File > Export to PDF is the best, looks exactly like on the browser, but it doesn't show the URL of the page and I have to have the URL on there. I can't add it after converting, because I'm saving a lot of webpages.
    – orlybabe
    Mar 24 at 21:17

2 Answers 2

1

The PDF content you see is defined by the web page itself. From the CSS defined on the page:

@media print {
    ...
    a[href]:after {
        content: "(" attr(href) ")";
    }
    ...
}

So they specifically want to include the link (attr(href)) after the link text as you see it in your PDF.


You can modify the CSS locally (but you most likely need to do this for each page you want to print from that site):

  • Enable the Developer menu in Safari (Preferences -> Advanced -> Show Develop menu)

  • Open the Web Inspector with Opt-Cmd-I

  • Select the "Sources" tab

  • On the left hand side, navigate into Style Sheets

    enter image description here

  • Within Style Sheets, scroll down to an entry starting with a9dad and click on it

  • Click into the window part to the right (with the CSS code inside), type Cmd-F, enter print and press Enter. This should bring you to the print definitions in the file

    enter image description here

  • Remove the relevant lines (lines 204-206 in my case)

  • Print the page without reloading it first

4
  • Omg this totally fixed it all! Thanks sooo much for the super clear instructions, screenshots and detailed info, you are a legend. The only thing now is the logo is still repeating itself - is there any way in the coding to fix that? Thanks thanks thanks so much!
    – orlybabe
    Mar 25 at 14:08
  • Also on this page theurbanwatch.com/fashion/… the other photos below Maria Grazia Chiuri don't appear at all, any fix for that? Thank you so so much you've really saved my sanity!
    – orlybabe
    Mar 25 at 14:13
  • Update: I've managed to make all the images appear (just by loading each full size image ugh lol). But there are still huge page breaks, is there any coding to make the images flow from page to page (even if it does get cut between pages)? Thanks soooo much!
    – orlybabe
    Mar 25 at 15:20
  • @orlybabe If there is, it's way above my skill level :-)
    – nohillside
    Mar 25 at 15:30
1

To save webpage as PDF you can

Safari -> File -> Export As PDF

Alternatively you can use an online tool to copy and paste your url and then save as PDF https://www.sejda.com/html-to-pdf

1
  • Export to PDF doesn’t include the URL, I need the URL to show. Thanks!
    – orlybabe
    Mar 24 at 16:36

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .