Internal Links & External URLs not working

support
1

I host hugo site via github pages. When I create a markdown with internal links on it. It points to the wrong URL which gives a 404 error. External links working correctly.

To solve this I used a render hook on

<a href="{{ (.Page.GetPage .Destination).RelPermalink | safeURL }}">{{ .Text | safeHTML }}</a>

Using this, when I click both internal URL & external URL it redirects to the same page than going to the link.

Example Page: 2023-05 Monthly PnL +3.6% Profit May | Maddy

I have removed the Render Hook.

When I remove the Renderhook external links are working. Internal links are pointing to the wrong page giving 404.

Example :

Internal link pointing to Wrong Link : https://optionsmaddy.github.io/post/2023-05-monthly-pnl-+3.6-profit-may/2023-05-24%20Good%20Day%20Closed%20All%20Positions%20Realized%20Profit%20+7,983.md

It should point to Correct Link : https://optionsmaddy.github.io/post/2023-05-24-good-day-closed-all-positions-realized-profit-+7983/

How do I make both my Internal & External link work?

2

Found your repo and your markdown links are not done correctly.

Normal Markdown links like this will work:

- Internal Link (Last Week May) : [2023-05-24 Good Day Closed All Positions Realized Profit +7,983](/post/2023-05-24-good-day-closed-all-positions-realized-profit-+7983/)
- Internal Link (Last Position May) : [2023-06-01 Tricky Executions Expiry Profit Realized +7,727](/post/2023-06-01-tricky-executions-expiry-profit-realized-+7727/)

If you for some reason prefer to use the file name of the post instead of the URL you can use the built in “relref” shortcode like this.

- Internal Link (Last Week May) : [2023-05-24 Good Day Closed All Positions Realized Profit +7,983]({{< relref "post/2023-05-24 Good Day Closed All Positions Realized Profit +7,983.md" >}})
- Internal Link (Last Position May) : [2023-06-01 Tricky Executions Expiry Profit Realized +7,727]({{< relref "post/2023-06-01 Tricky Executions Expiry Profit Realized +7,727.md" >}})
1 Like
3

Thank You. But I am using Obsidian to write notes and then push them to GitHub. Markdown links are in the format

[ABC 123](abc%20123.md)

but Hugo with Github Pages changes it to

abc-123.

  • it converts to smallcase
  • it replaces %20 with -

I was looking for an easy way to do this. I thought I could solve this with render hook. But using renderhook creates problem with external links.

4 
{{ if strings.HasPrefix .Destination "http" }} 
  Do stuff to external links
{{ else }}
  Do stuff to internal links
{{ end }}
1 Like
5

Like this ?

{{ if strings.HasPrefix .Destination "http" }} 

{{ else }}
<a href="{{ (.Page.GetPage .Destination).RelPermalink | safeURL }}">{{ .Text | safeHTML }}</a>
{{ end }}
6

I believe you need to do stuff with external links also, otherwise they will just be removed.

<a href="{{ .Destination | safeURL }}"{{ with .Title}} title="{{ . }}"{{ end }}>{{ .Text | safeHTML }}</a>

or this to have them open in a new tab.

<a href="{{ .Destination | safeURL }}"{{ with .Title}} title="{{ . }}"{{ end }} target="_blank" rel="noopener noreferrer">{{ .Text | safeHTML }}</a>

1 Like
7

And *.RelPermalink does not need to be run through safeURL.

1 Like
8

Thank you.

9

I have written a Javascript snippet for converting wikilink to this custom format.

I am sharing it here. I thought it would be useful for people who have similar issues.

If you are using a PKM tools like obsidian you might want to convert Wikilinks to slugified mdlink.

The snippet could be run directly here :point_right:t3: : wikilink to slugified mdlink

Code

function convertInput(input) {
  // Extract the text between the brackets
  const text = input.replace(/\[\[(.*?)\]\]/, '$1');

  // Remove any whitespace and replace spaces with hyphens
  const slug = text.replace(/\s/g, '-').toLowerCase();

  // Create the desired output format
  const output = `[${text}](/post/${slug})`;

  return output;
}

// Prompt the user to enter the input
const userInput = prompt("Enter the WikiLink to Convert:");

// Call the function with user input
const result = convertInput(userInput);

// Display the result in a dialog box
alert(result);