open link in new tab with github markdown using target="_blank" - github

Is there a way to let a Link, written in githubs markdown, open in a new tab?
All posts I have found related to this suggests to use HTML and target="_blank", which is fine with me, but that doesn't work.
For example this link:
Go
Does not open in a new tab.
I'm no interested in replies for all kind of different markdown syntaxes, but only in a solution that will work when I write my markdown on github.


Well it seems that the simple answer is "It's not possible". Github does not include the target attribute even if you use plain HTML, so it's not a in the final HTML Anchor tag. Annoying, but OK, users can just do a CTRL+click (on Windows and Linux) or CMD+click (on MacOS) on the link, the get the same behavior.


There is a solution specific to websites using GitHub pages: adding line
markdown: kramdown
to file _config.yml, you can use [go](http://stackoverflow.com){:target="_blank" rel="noopener"} because then GitHub pages engine uses another markdown called kramdown for generating html. However, it does not work on previews and in markdown rendered by GitHub directly in the project repository.


From what I have read and researched, it is not possible. I wanted to do something similar but soon realized that it is not a feature in git md, unfortunately.


It's possible for Github Pages users (Jekyll), the proper way (March 2022) is to add to your _config.yml file these lines:
kramdown:
input: Kramdown
This is specified in the documentation:
You can also change the processor used by Kramdown (as specified for the input key in the Kramdown RDoc). For example, to use the non-GFM Kramdown processor in Jekyll, add the following to your configuration.
Use the Kramdown processor instead of GFM will allow you to add {:target="_blank" rel="noopener"} to markdown links to tell the browser to open link in new tab.
Example
[Stackoverflow The Key](https://stackoverflow.blog/2021/03/31/the-key-copy-paste/){:target="_blank" rel="noopener"}
/!\ Disclaimer
Changing the markdown processor from GFM (default value) to kramdown can create issues in the HTML result, since all the specific features of GitHub Flavored Markdown (GFM) won't work anymore.


The answer should be what #Idavid posted in a comment.
[go](http://stackoverflow.com){:target="_blank"}.
You should also add rel="noopener"
[go](http://stackoverflow.com){:target="_blank" rel="noopener"}

Related

How to collapse/fold a link in Visual Studio Code Markdown?

It is hard to read a markdown document in Visual Code if it contains links with long URLs. Is there a way to collapse/fold link addresses?

As far as I can tell from looking through the markdown settings (you can try it yourself by triggering autocomplete/suggestions after typing markdownlink in a settings.json file), there is no setting that enables the behaviour you are looking for.
One possible workaround would be to just read the markdown preview (instead of the source markup). You can do this with the buttons at the top right, or with these commands and keyboard shortcuts:
Markdown: Open Preview (ctrl+shift+v)
Markdown: Open Preview to the Side (ctrl+k,v)
Markdown: Open Locked Preview to the Side
If you want the feature you are asking for, you can create a feature request on their GitHub issue tracker. If you do so, add a link here to the issue you create for posterity.

Reference-style links in Visual Studio Code

I found that Markdown has something called reference-style links. I don't know if is it official Markdown syntax or it exists only in some Markdown add-ons.
I tried to create something like that in VSCode, but it doesn't work:
[Test][ducksearch]
[ducksearch]: https://duckduckgo.com
I wonder is it a bug/un-implemented function in VSCode or that syntax works only with some extension?

Reference-style links are part of the original Markdown specification. They should work just about everywhere Markdown does, and that includes Visual Studio Code.
Just add a blank line to separate the paragraph containing the link from the reference:
[Test][ducksearch]
[ducksearch]: https://duckduckgo.com

Not only reference-style links are supported natively by VSCode markdown editor, but VSCode 1.68 (May 2022) will enable "go to definition".
See issue 146293
Enable triggering go to definition on a markdown reference link to jump to the link definition
[text][link] // trigger on link here
[link]: https://example.com
Go to def (from text) should jump to the definition of link, at the end of the file
This is implemented in PR 148017, and available in the Insider edition right now.

Markdown Table not working (kramdown)

code
Its working perfectly in the atom md preview but it outputs terribly in Github hosted jekyll website?
My posted md file online:
https://kevin-do.github.io//aztec-parking/
Could someone please help?

The Atom Markdown preview does not use Kramdown, Jekyll does. There are so many different-but-similar Markdown variants that you probably haven't noticed until now.
That said, in this case it's probably the --- at the start. Change it to|---, and add a blank line in between the table and the heading.

How to efficiently edit Markdown in the github issue tracker?

I like the fact that the github issue tracker supports Markdown. However, I find it relatively unpleasant to actually write Markdown in the github editor. It lacks many of the features of the Markdown editor on StackOverflow.
E.g., it lacks:
a button to indent multiple lines of code by four spaces
a button to add quote to the start of each line
real time markdown preview
fixed width font
ability to insert image using imgur
a confirmation dialog box when you close a browser window when you might otherwise lose your work
In particular, the inability to insert code blocks is probably the feature I miss the most.
Sure, I could write my markdown in a separate editor and then paste it into the github issue tracker, but this is not especially appealing. I could even use the StackOverflow editor if I was careful not to click "Ask Question", but that seems a bit silly.
Question
Is there anyway of altering the text box in github to incorporate the editing features in StackOverflow?
Or if it is better to type in another text editor, what's a particularly elegant way of doing that? (e.g., minimum steps, simple to move back and forward, good editor) Perhaps theres a way of clicking a text box and bringing up a Rich Markdown editor which when closed returns the contents to the original text box?

You should appeal to GitHub to add one. Your argument is sound. Stack Overflow demonstrates editors can be functional, non-intrusive and tasteful.
Meanwhile, there might be a browser extension that does some of this. https://chrome.google.com/webstore/detail/cpojebknccclkjabfngjlcknonpmhhol

If you are on Windows, you might want to check MarkPad: http://code52.org/DownmarkerWPF/
Disclaimer: I have never used it myself (being on Ubuntu), only read about it watching the code52 project. I know it can edit posts of several blog systems, but I'm not sure if Github is in the list of supported web sources. Its syntax however is supported, for sure.

View markdown files offline [closed]

Closed. This question does not meet Stack Overflow guidelines. It is not currently accepting answers.
We don’t allow questions seeking recommendations for books, tools, software libraries, and more. You can edit the question so it can be answered with facts and citations.
Closed 1 year ago.
The community reviewed whether to reopen this question 10 months ago and left it closed:
Original close reason(s) were not resolved
Improve this question
Is there a way to display .md files offline so we know what it will look like once it's uploaded in Github? I'm referring to showing the README.md file as it would come out in Github, and not as for editing purposes.
Needs to work on Mac and Windows since I use both.

There are a few Chrome plug-ins that work well. I've been using Markdown Preview Plus.
After install, enable "Allow access to file URLs" in Extensions (menu > More tools > Extensions or enter URL chrome://extensions/ instead).
Then drag-n-drop a Markdown file onto Chrome and use your favorite editor to edit.

I wrote Grip a while ago to do exactly this. It renders exactly like it does on GitHub and provides several additional options too:
In addition to READMEs, Grip can renders GitHub comments and issues
Click through local links to render other .md files
An API to use in your own projects
Export to an HTML file
Install with pip:
pip install grip
Then go to the directory that contains your README file and run:
grip
Pass -h for additional help and options.
Here's a screenshot of Grip rendering Grip's README:
Check it out here.

Atom by Github. Gives you a side by side preview.

Visual Studio Code - the new editor by Microsoft also provides very good support for markdown editing.
You can download it from here.
The editor provides good support to toggle between the markdown code and the preview mode.
It also provides reasonably good intellisense support for all the markdown syntax.
The editor is free for use and is also cross platform (works on Linux, Windows and Mac).
For more details you can check on their website

Late to the party, but have a look at MarkdownPad.

See Python-Markdown-Editor
It is based on :
Python-Markdown
Pygments (code block syntax highlighting)
CodeMirror (javascript code editor)
Bottle
Install with pip :
$ pip install markdown-editor
It features when-you-type preview, code highlight, fenced code blocks, github style
it can be used by commandline :
$ markdown_edit
$ markdown_edit README.md
$ markdown_edit -f readme.html README.md
I created this to build a tool for sending code reviews, it is easily extensible, by importing it as a module you can add custom actions.

I just installed https://github.com/ypocat/gfms. It does a very good job rendering github flavored markdown. It detects changes in your markdown, so you just put your browser and editor side-by-side. It is Node.js, so it should work fine on any platform.
If you have Node.js is installed, the installation is simple:
sudo npm install -g gfms
gfms --port 9999 (in your project directory)
http://localhost:9999/ (open with any browser)

I found a way to view it in PHP. After doing some more snooping I found 2 solutions for offline and online viewing of .md files:
Offline: https://github.com/WolfieZero/Markdown-Viewer-PHP
Online: http://daringfireball.net/projects/markdown/dingus
I recommend the offline version so you can do your editing even while you're doing your business on the throne. :)

There are people who does not use Google Chrome. There is a Firefox add-on called Markdown Viewer which is able to read Markdown files offline.

pandoc is a nice Text-To-Text conversion tool that solves the problem of offline visualization of your Markdown. Just issue:
pandoc -f markdown -t html README.md > README.html

have you tried ReText? It is a nice desktop Markdown editor

I found MarkView Google Chrome extension pretty useful, actually it's working like a charm:
MarkView is a Chrome extention for editing and viewing markdown file with an outline view, support multiple table format styles, code block syntax highlight and Github Flavored Markdown.
Features:
Editing and Viewing markdown file in web page style.
Auto reload local file when file is changed (Post-installation:
select "Allow access to file URLs" option in chrome://extensions/)
Show outline beside the content in scrollable way
Have buttons for GoTop, ViewSource and GoBottom
Support Github Flavored Markdown table styles and code highlight.
Highlight the code area for programming languages(eg. ```ruby)
Support web pages printing with decent outlook(Chrome->File->Print...)
Responsive: when the window size small than 940px, outline section will
automatically hidden; resize bigger than 940px, outline section will display.
MarkView will view all markdown files except those under raw.github.com
because that subdomain only displays the source.
More features have been added to MarkView:
WYSIWYG markdown editor
Themes and Code Styling Selection
Support Footnotes1 ↩
Instant Slides Presentation
Document Custom Styling
Add Theme CSS and Select
Add Code Style and Select
Write CSS, Save and Run

I like the vertical splitter in Downmarker, you can see the changes as you write!

You can use texts as a md viewer and md editor, its lightweight and neat.

Geany has a plugin for markdown which does a fair job, giving you also a Markdown preview in the sidebar. It also runs on Linux, Mac OS X and Windows.
To use it, install geany, then install the package geany-plugin-markdown and select it from the plugin manager.

I just coded up an offline markdown viewer using the node.js file watcher and socket.io, so you point your browser at localhost and run ./markdownviewer /path/to/README.md and it streams it to the browser using websockets.
markdownviewer https://github.com/Hainish/markdownviewer/

There is also StackEdit. It will work both online and offline (it uses your browser local storage).
You can also connect it with Dropbox or Google Drive to see files hosted on the cloud.

If you're a vim person, you can try the vim-preview plugin. Simply install it into your ~/.vim directory with your method of choice. Then you can open a Markdown file with vim and use the command :Preview which will open a new window in your browser and display the end result.

Consider Strapdown.
Strapdown is Javascript-based solution that renders the markdown content in the browser, which makes it great for offline-viewing.
From their own description:
Strapdown.js makes it embarrassingly simple to create elegant Markdown documents. No server-side compilation required.
So rename your .md markdown file to .html, and surround it with:
<xmp theme="united" style="display:none;">
# Markdown content here
…
</xmp>
<script src="http://strapdownjs.com/v/0.2/strapdown.js"></script>
and opening in any browser will show rendered HTML. Added bonus: you can easily change the theme.

One of the simplest resources that works well on MacOSX is the Markdown Quick Look plugin found at InkMark. After installing this on OS X 10.9+, you simply select a markdown file in Finder and tap the space bar. I am not certain if the results are correlated 100% with Github but they are pretty good and make for a tiny unobtrusive offline viewer only solution. Mashable also wrote an article on 78 different tools if you'd like other options.

For MAC I use Marked, for Windows I use Muto-Mark. Both support the GH stylesheet.

An easy solution for most situations: copy/paste the markdown into a viewer in the "cloud." Here are two choices:
Dillinger.io
Dingus
Nothing to install! Cross platform! Cross browser! Always available!
Disadvantages: could be hassle for large files, standard cloud application security issues.

For OS X, Mou is very nice, and it comes with two GitHub CSS themes.

Check out Haroopad. This is a really nice #markdown editor. It is free and available for multiple platforms. I've tried it on Mac OSX.

You can use extension called Markdown Syntax Highlighting for Notepad++. It is available on Github
After installation, new option in the Language dropdown will be appeared

From now I use http://marxi.co/. Marxi.co has online and offline version.

I frequently want portable applications. For this, I found
http://cloose.github.io/CuteMarkEd/ (I have just tried it briefly, and it seems to work fine).
http://markdownpad.com/faq.html#portable

RStudio can handle markdown files and convert them into html and pdf. If you already have it, you can use RStudio (it is an IDE for R programming language). It is free and open source, and works on Windows, Mac and Linux.

Remarkable, certainly a great tool.
Note: Not available for Mac
Features:
Live preview
It's free.
Extremely lightweight
Export to HTML, PDF
Download: https://remarkableapp.github.io/
Edit 2022
I use and love Mark Text now. (https://marktext.app)

You may use Scribefire Next.
It's a Mozilla Firefox browser plugin. Just install the extension and fire up Firefox. Customize your toolbar and place the Scribefire shortcut to it. And since it's a browser plugin, you can use it in Mac, Linux and Windows.
When you want to write in Markdown mode, just click Edit Code from the Scribefire window.
Now to meet your purpose, go to Edit Code mode and copy all the texts and paste it to your .md file and upload.
There is no live preview feature for this, you have to toggle Edit Code and Edit Visually to preview your text.
I'm using it in my Linux Mint box:
Update:
It's year 2014, need to add some other awesome tool here for other readers and researchers. Just recently used Brackets + Markdown Preview Extension.