squidfunk/mkdocs-material

Open relative link in new tab does not work with instant loading

Closed this issue · 12 comments

pamelasarkisyan commented

I checked that...

  • ... the documentation does not mention anything about my problem
  • ... the problem doesn't occur with the default MkDocs template
  • ... the problem is not in any of my customizations (CSS, JS, template)
  • ... there are no open or closed issues that are related to my problem

Description

Open relative link in new tab does not work.

[As specified in the checks I did remove the theme and check the behaviour using just mkdocs without any theme and the links are opening correctly in another tab.]

Expected behavior

Relative link should open in new tab.

Actual behavior

Relative link opens in same tab/page.

https://3os.org/markdownCheatSheet/links/#link_with_open_in_new_tab
This is a live site using the theme and when you click on Relative Link With New Tab you will see the behavior.

Steps to reproduce the bug

Option 1:
Create an .md file inside docs/ and add link to any page:
[link](../another-page.md){target=_blank}
or
[link](../another-page.md){:target="_blank"}

Option 2:
Create an .md file inside docs/ and add full link to a page on a site which has the same domain:
[link](https://yourdomain.com/){target=_blank}
or
[link](../another-page.md){:target="_blank"}

Package versions

  • Python: Python 3.8.2
  • MkDocs: version 1.1
  • Material: Version: 5.1.0

Project configuration

# Project information
site_name: 'xyz'
site_description: 'xyz'
site_url: 'xyz'

#nav
<!-- not included -->

#theme options
theme:
  name: 'material'
  favicon: 'icons/favicon.png'
  features:
    - tabs
    - instant

#extensions
markdown_extensions:
  - admonition
  - codehilite:
      guess_lang: false
      use_pygments: true
  - pymdownx.superfences
  - toc:
      permalink: true
      toc_depth: 3
  - attr_list

System information

  • OS: Any
  • Browser: Any
facelessuser commented

Does this happen when you turn off instant?

  • 👍1
pamelasarkisyan commented

Does this happen when you turn off instant?

Awesome! It did indeed fix the behaviour and the link now opens in another tab.

facelessuser commented

Yeah, instant is pretty cool, but it is still experimental. I think there is still a bit that still needs to be worked out.

squidfunk commented

Nice catch! Haven't thought of target=_blank. Should be quite easy to fix. I'll look into it.

squidfunk commented

Fixed in e96657c

squidfunk commented

... and released as part of 5.1.1

blakegearin commented

I'd like to point out that this hyperlink syntax (e.g. [link](https://yourdomain.com/){target=_blank}) doesn't work without attr_list

# mkdocs.yml

...
markdown_extensions:
  - attr_list
...

Would be nice if this was mentioned somewhere, perhaps under Formatting 🙂

  • 👍13
koen-yesplan commented
  • I'd like to point out that attr_list is part of the extra extension, so no need to add the former if the latter is already in your yml file. See Markdown Extensions
  • When using reference links, I only got it working using the syntax [just a link][123]{: target='_blank'}. [just a link][123]{target=_blank} didn't seem to work.
scmcca commented

Is there a way to define this globally for all external links, instead of defining it directly in markdown every time?

  • 👍1
facelessuser commented

Is there a way to define this globally for all external links, instead of defining it directly in markdown every time?

Can you define what "this" refers to? Are you talking about converting all links to use target=_blank? The question seems a bit vague?

scmcca commented

@facelessuser Sorry about that.

My question is asking if there is a way to define once (perhaps in mkdocs.yml) the conversion of all links that lead to somewhere outside of the local website to use target=_blank (i.e., opening in a new tab) instead of defining target=_blank manually at every instance of an external link. Links that lead to somewhere within the site are okay to be left as default (i.e., not opening a new tab). My challenge is that I'm pulling content from external repositories, so updating the markdown directly to have target=_blank on external links is not a feasible option. I would either have to add target=_blank manually every time I need to pull the updated markdown files, or write a script that adds target=_blank at every external link. Does that make sense?

facelessuser commented

This isn't really a theme thing. This could be done with a Python Markdown extension or a MkDocs plugin. I'm not certain at this time if such an extension or plugin already exists, but that is the way such things should be approached.

  • 👍1