Improving Link Display for Print

support
1

There was an interesting article written years ago on improving link display for printed output. Essentially when a page is printed each link in the contents section (header and footer are skipped) has a footnote number, and then a “Links” section is added at the end of the contents so users can see what the links are when looking at printed output. This can be a bit nicer than inline display of links, which can sometimes be a bit long.

The work in the article was all done with JavaScript at runtime, but it seems to me this would be an interesting thing to do with Hugo at build time. I see a related question was asked in 2019, Is there some magical way in Hugo to iterate through (or even simply list) all the links in a rendered page? — @bep’s answer at the time was that there were plans to add data structures that could help with this.

Has anyone tried a project like this?

2 Likes
2

I have not a complete solution, but give hints for a way :wink:

create a render-link partial

  • format your link for display and print with the needed CSS classes
  • store the link in .Page.Store (add all in a map)

On top of the page initialize .Page.Store

At the end of the page print out the content of .Page.Store map link.

This is on my ToDo list, but I need the time to do it.

HTH

3

taken the time :wink:

see GitHub - gj52/HugoSample: Hugo Sample

look for the latest changes to see how it works

2 Likes
4

I’ll check that out @ju52!

5

I’m not seeing the links in Print Preview, @ju52 — but perhaps I’m not looking at the correct thing (I did a Print Preview on your Home and Links page).

To see the effect I’m referring to:

  1. Open Improving the Printed Page: Sample File (with Contingencies)
  2. Note the links are pretty standard with no additional attributions
  3. Select Print in your browser and look at the Preview
  4. Note in the preview that each link now has a footnote number, and there is a new “Links” section at the end of the document that shows the URLs for all the links in the content section
6

yes, try the normal posts …

The Links page don’t use the render_link template, is on the ToDo list.

1 Like
7

Nice! I used /post/2019/05/07/qr-codes/ as a test and see the footnotes are there — excellent. I don’t see a Links section at the end with footnotes and related URLs, but am assuming this is a work-in-progress.