markdown link opening in new tab - github

Is there a way to open the below markdown link in new tab? I've got some result from markdown target=“_blank”, but in my case it's different have used <> symbol to projected the link.
http://google.com
Not used the usual format
(name)[linkname]
Used
<>
Inside this projected the link name. Is possible to open this link in new tab?

The kramdown syntax:
[link name](url_link){:target="_blank"}
can be parsed into HTML using the kramdown online editor:
https://kramdown.herokuapp.com/
Then you can paste the HTML syntax into your markdown document.
I used it because I already had quite a few kramdown references, and wanted to avoid retyping them in HTML.

Doing some quick research - Markdown by default does not support this. Some solutions include using plugins like Kramdown, but I think the best solution is just to use an HTML tag in your markdown file. (as pointed out in the comment above ^)
# Some markdown
*click below*
New Tab
...

As far as I could find, this is not possible on GitHub currently. See good answer on this from Plaul here. I hope they will fix it soon, as it seems searching for an answer that this is something a lot of people would like to see.

If you have access to JavaScript, you can run a simple script to handle this for you wherever your markdown is rendered:
const anchors = document.querySelectorAll('a');
anchors.forEach((a) => {
a.setAttribute('target', '__blank');
a.setAttribute('rel', 'noopener noreferrer');
});

Related

How to link to a file type search on GitHub?

On this pull request https://github.com/github/linguist/pull/3208 the Original Poster added some file search links for .nsi and .awk file types:
How did he do that? Is there some special syntax like #mention or user/repo#issue or he just did it the hard way:
[`.nsi` files](https://github.com/search?p=5&q=extension%3Ansi+if&ref=searchresults&type=Code&utf8=%E2%9C%93)
[`.awk` files](https://github.com/search?utf8=%E2%9C%93&q=extension%3Aawk+if&type=Code&ref=searchresults)
I'm not aware of any magic syntax for searches. Certainly nothing appears in the Mastering Markdown guide or the basic writing and formatting syntax page, though both describe user mentions, issue links, SHA links, etc.
I would speculate that the author of that comment performed a search in another tab, then copied the generated URL to their comment.

How to quote code in a Mardkown GitHub Gist

In a markdown file in a Gist, how do you quote some lines of code that are in a GitHub project?
If I was writing a Gist to try and explain how something works, I might have a block of text, then quote some code. I don't want to cut and paste the code in, I just want to quote some lines of code in a GitHub project. I am sure I have seen this done, but can't find an explanation of how to do it.
For example:
This algorithm makes use of Dijkstra's topological sort algorithm:
100: Result myFancyPantsAlgorithm(Blah blah) {
101: youGetTheIdea();
102: }
It is not possible to embed GitHub code snippets from Repositories.
What you might have seen is having a gist embedded in a "normal" website which is possible because GitHub provides a script to embed gists.
The script tag is (un)fortunately not whitelisted to be used in GitHub Flavored Markdown, so it is not possible to embed a gist in markdown.
A way to get around this would be to set a gh-page up, where you are able to embed a Gist as this SO-question shows. But then you're still not referencing to any live codebase.
So the answer to your question is: this is not possible, wether by embedding code from a repository nor by taking a detour via using gists.

Jekyll unhide reference-style links on Github pages

I have been using github pages with jekyll for auto-generating my blog using markdown documents.
I would like to use reference-style links then show a list of the links at the bottom of the page.
basically, I want the reference-style links to be printed on the page, by default they are hidden.
The idea is to have a list of references that a reader can refer to for more information.
for example, the following text:
# some header
...some body text in the blog with a link to [wikipedia][1]
...
...
# reference links
[1]: https://www.wikipedia.org
should generate the following output:
some header
...some body text in the blog with a link to wikipedia
...
...
reference links
[1]: https://www.wikipedia.org
As seen, the reference-style link is used in the markdown but it is also displayed on the page.
The previous "correct" output was achieved by duplicating each line and escaping the special characters, but this seems a bit redundant.
Can this be achieved by changes to _config.yml or using ruby? Other options are also welcome (css magic?).
tldr; I want a way to "unhide" the reference-style links at the bottom of my markdown page.
First, you have to understand exactly what is doing what:
Your markdown parser is converting your markdown into html.
Jekyll is taking that html and organizing it into pages.
GitHub pages is serving up those html pages.
The client reads that html and executes any JavaScript, etc.
The problem is that the markdown parser doesn't include the reference links at the bottom of the page. It's not like they're there but hidden. They simply aren't there. So you aren't going to find a CSS solution, because there isn't anything to style. You might be able to accomplish this with a custom markdown parser that includes the reference links in the generated html, but that won't work with GitHub pages and is probably going to be pretty hackish.
Another option is to execute JavaScript that uses document.links to get every link on the page, then output them in a <ul> or something at the bottom of the page. Something like this:
var links = document.links;
for(var i = 0; i < links.length; i++) {
var linkHref = document.createTextNode(links[i].href);
var lineBreak = document.createElement("br");
document.body.appendChild(linkHref);
document.body.appendChild(lineBreak);
}
You might restrict that to only include links in a certain div (like this), that way you don't have to parse out your navigation links and whatnot. You also have to consider the order.
Another option might be to include them in each post's frontmatter as a yml list, then show those in the layout that displays the post.
Of course, you could also simply create the reference yourself using markdown.

Placing links inside markdown code blocks

I want to have links inside my code blocks using GitHub flavored markdown.
```cpp
void Click ([Keycode](#keycode) key) const
```
Unfortunately, it renders that as code, anyway to make it a link instead?
If its a short piece of code this should do the trick:
[`this is code`](https://this_is_url/)
As far as I know, the current instance of GitHub Flavored Markdown doesn't support this.
The all block is rendered with <div class="highlight highlight-html"><pre>... </pre></div>, meaning your markdown link is not interpreted.
It would be best to place that link just before the code section (unless said section has dozens of similar links in your code).
As suggested by VonC, it might not be possible with the current version of GitHub Flavored Markdown. That being said, I did find a way around it which suits my requirements. By using tags like <big>, <pre> and <b> I'm able to simulate syntax highlighting and get the effect I'm looking for. Too bad I can't add my own color though.
<big><pre>
**void** Click ([**Keycode**](#keycode) key) **const**
</pre></big>
You can do this using HTML in markdown, yes, even on Github:
<pre>
Something
</pre>
This makes the trick.
I use it on my GitHub profile page to put links inside code blocks.
<pre>
<code>
gmarciani
</code>
</pre>

Markdown - code as link in GitHub readme

I wanted to create inline span of code that links to other page.
I want to use
`MongoCollection`
and
[MongoCollection](#http://php.net/manual/en/class.mongocollection.php)
together to make a link on a code element.
I tried
[`MongoCollection`](#http://php.net/manual/en/class.mongocollection.php)
and
`[MongoCollection](#http://php.net/manual/en/class.mongocollection.php)`
Both didn't work.
Is there any way to do that?
Could you explain a bit more about what you mean by inline span of code? This works in Github and links the MongoCollection link to the Mongo Collection php manual page.
[MongoCollection](http://php.net/manual/en/class.mongocollection.php)
Is that what you are looking for?