Могу ли я создать ссылки с 'target=" blank"' в Markdown?


есть ли способ создать ссылку в Markdown, которая открывается в новом окне? Если нет, то какой синтаксис вы рекомендуете для этого. Я добавлю его в компилятор markdown, который я использую. Я думаю, что это должен быть вариант.

16 304

16 ответов:

что касается синтаксиса Markdown, если вы хотите получить эту подробную информацию, вам просто нужно использовать HTML.

<a href="http://example.com/" target="_blank">Hello, world!</a>

большинство уцененных движков, которые я видел, позволяют использовать обычный старый HTML, только для таких ситуаций, когда общая система разметки текста просто не будет ее сокращать. (Например, механизм StackOverflow.) Затем они запускают весь вывод через фильтр белого списка HTML, независимо от того, так как даже уцененный документ может легко содержать атаки XSS. Как таковой, если вы или ваш пользователи хотят создать _blank ссылки, то они, вероятно, все еще могут.

Если это функция, которую вы собираетесь использовать часто, возможно, имеет смысл создать свой собственный синтаксис, но это, как правило, не жизненно важная функция. Если я хочу запустить эту ссылку в новом окне, я сам нажму ctrl, спасибо.

Kramdown поддерживает его. Он совместим со стандартным синтаксисом Markdown, но также имеет много расширений. Вы бы использовали его так:

[link](url){:target="_blank"}

Я не думаю, что есть особенность уценки.

хотя могут быть и другие варианты, если вы хотите, чтобы открыть ссылки, которые указывают за пределами вашего собственного сайта автоматически с JavaScript.

var links = document.links;

for (var i = 0, linksLength = links.length; i < linksLength; i++) {
   if (links[i].hostname != window.location.hostname) {
       links[i].target = '_blank';
   } 
}

jsFiddle.

Если вы используете jQuery, это немного проще...

$(document.links).filter(function() {
    return this.hostname != window.location.hostname;
}).attr('target', '_blank');

jsFiddle.

С Markdown-2.5.2, вы можете использовать это:

[link](url){:target="_blank"}

в моем проекте я делаю это и он отлично работает:

[Link](https://example.org/ "title" target="_blank")

ссылке

но не все Парсеры позволяют это сделать.

для ghost markdown используйте:

[Google](https://google.com" target="_blank)

нашел его здесь: https://cmatskas.com/open-external-links-in-a-new-window-ghost/

вы можете сделать это с помощью собственного кода javascript, например:

 
var pattern = /a href=/g;
var sanitizedMarkDownText = rawMarkDownText.replace(pattern,"a target='_blank' href=");

Код JSFiddle

нет простого способа сделать это, и, как отметил @alex, вам нужно будет использовать JavaScript. Его ответ-лучшее решение, но для его оптимизации вы можете фильтровать только ссылки на пост-контент.

<script>
    var links = document.querySelectorAll( '.post-content a' );  
    for (var i = 0, length = links.length; i < length; i++) {  
        if (links[i].hostname != window.location.hostname) {
            links[i].target = '_blank';
        }
    }
</script>

код совместим с IE8+, и вы можете добавить его в нижней части страницы. Обратите внимание, что вам нужно будет изменить ".post-content a " к классу, который вы используете для своих сообщений.

Как видно здесь: http://blog.hubii.com/target-_blank-for-links-on-ghost/

одно глобальное решение-поставить <base target="_blank"> в вашу страницу <head> элемент. Это эффективно добавляет цель по умолчанию для каждого элемента привязки. Я использую markdown для создания контента на моем веб-сайте на основе Wordpress, и мой настройщик тем позволит мне вводить этот код в верхнюю часть каждой страницы. Если ваша тема не есть плагин

Я использую Grav CMS и это прекрасно работает:

Тело/Содержание:
Some text[1]

Тело/Ссылка:
[1]: http://somelink.com/?target=_blank

просто убедитесь, что целевой атрибут передается первым, если в ссылке есть дополнительные атрибуты, скопируйте/вставьте их в конец ссылочного URL.

также работает как прямая ссылка:
[Go to this page](http://somelink.com/?target=_blank)

таким образом, это не совсем верно, что вы не можете добавить атрибуты ссылки на URL-адрес Markdown. Чтобы добавить атрибуты, проверьте, используется ли базовый синтаксический анализатор markdown и каковы их расширения.

в частности, pandoc расширение для включения link_attributes, которые позволяют разметку в ссылке. например,

[Hello, world!](http://example.com/){target="_blank"}
  • для тех, кто приезжает из R (например,rmarkdown,bookdown,blogdown и так далее), это синтаксис вы хотите.
  • для тех, кто не используя R, вам может понадобиться включить расширение в вызове pandoc С +link_attributes

Примечание: это отличается от kramdown поддержка парсера, которая является одним из принятых ответов выше. В частности, обратите внимание, что kramdown отличается от pandoc, так как для него требуется двоеточие -- : -- в начале фигурных скобок -- {}, например

[link](http://example.com){:hreflang="de"}

в частности:

# Pandoc
{ attribute1="value1" attribute2="value2"}

# Kramdown
{: attribute1="value1" attribute2="value2"}
 ^
 ^ Colon

я столкнулся с этой проблемой при попытке реализовать markdown с помощью PHP.

поскольку пользовательские ссылки, созданные с помощью markdown, должны открываться на новой вкладке, но ссылки на сайт должны оставаться на вкладке, я изменил markdown, чтобы создавать только ссылки, которые открываются на новой вкладке. Поэтому не все ссылки на странице ссылаются, только те, которые используют markdown.

в markdown я изменил все выходные данные ссылки на <a target='_blank' href="..."> Что было достаточно легко с помощью найти/заменить.

Я не согласен, что это лучший пользовательский опыт, чтобы остаться в одной вкладке браузера. Если вы хотите, чтобы люди оставались на вашем сайте или возвращались, чтобы закончить чтение этой статьи, отправьте их в новую вкладку.

основываясь на ответе @davidmorrow, бросьте этот javascript на свой сайт и превратите только внешние ссылки в ссылки с target=_blank:

    <script type="text/javascript" charset="utf-8">
      // Creating custom :external selector
      $.expr[':'].external = function(obj){
          return !obj.href.match(/^mailto\:/)
                  && (obj.hostname != location.hostname);
      };

      $(function(){
        // Add 'external' CSS class to all external links
        $('a:external').addClass('external');

        // turn target into target=_blank for elements w external class
        $(".external").attr('target','_blank');

      })

    </script>

вы можете добавить любые атрибуты, используя {[attr]="[prop]"}

например [Google] (http://www.google.com) {target= "_blank"}

для завершения Алекс ответил (Dec 13 ' 10)

более умная цель впрыски смогла быть сделана с этим кодом:

/*
 * For all links in the current page...
 */
$(document.links).filter(function() {
    /*
     * ...keep them without `target` already setted...
     */
    return !this.target;
}).filter(function() {
    /*
     * ...and keep them are not on current domain...
     */
    return this.hostname !== window.location.hostname ||
        /*
         * ...or are not a web file (.pdf, .jpg, .png, .js, .mp4, etc.).
         */
        /\.(?!html?|php3?|aspx?)([a-z]{0,3}|[a-zt]{0,4})$/.test(this.pathname);
/*
 * For all link kept, add the `target="_blank"` attribute. 
 */
}).attr('target', '_blank');

вы можете изменить исключения регулярных выражений с добавлением большего расширения в (?!html?|php3?|aspx?) групповая конструкция (понять это регулярное выражение здесь:https://regex101.com/r/sE6gT9/3).

и для версии без jQuery, проверьте код ниже:

var links = document.links;
for (var i = 0; i < links.length; i++) {
    if (!links[i].target) {
        if (
            links[i].hostname !== window.location.hostname || 
            /\.(?!html?)([a-z]{0,3}|[a-zt]{0,4})$/.test(links[i].pathname)
        ) {
            links[i].target = '_blank';
        } 
    }
}

автоматизировано только для внешних ссылок, используя GNU sed & make

если вы хотите сделать это систематически для всех внешних ссылок,CSS-это не вариант. Однако можно запустить следующее sed команда после того, как (X)HTML был создан из Markdown:

sed -i 's|href="http|target="_blank" href="http|g' index.html

это можно дополнительно автоматизировать, добавив выше до makefile. Дополнительные сведения см. В разделе ГНУ make или смотрите, как я сделал это on мой сайт.