html - link - markdown tutorial

¿Puedo crear enlaces con ''target="_ blank"'' en Markdown?

Question

¿Hay alguna forma de crear un enlace en Markdown que se abra en una nueva ventana? Si no, ¿qué sintaxis recomienda para hacer esto? Lo agregaré al compilador de markdown que uso. Creo que debería ser una opción.

Answer 1

Automatizado solo para enlaces externos, utilizando GNU sed & make

Si a uno le gustaría hacer esto sistemáticamente para todos los enlaces externos, CSS no es una opción . Sin embargo, uno podría ejecutar el siguiente comando sed una vez que se haya creado el (X) HTML desde Markdown:

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

Esto se puede automatizar aún más agregando el comando sed anterior a un makefile . Para más detalles, vea GNU make o vea cómo lo he hecho en mi sitio web .

Answer 2

Con Markdown-2.5.2, puedes usar esto:

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

Answer 3

En lo que respecta a la sintaxis de Markdown, si desea obtener ese detalle, solo tendrá que utilizar HTML.

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

La mayoría de los motores Markdown que he visto permiten el HTML antiguo, solo para situaciones como esta donde un sistema de marcado de texto genérico simplemente no lo corta. (El motor , por ejemplo). A continuación, ejecutan toda la salida a través de un filtro de lista blanca de HTML, independientemente, ya que incluso un documento de solo Markdown puede contener fácilmente ataques XSS. Como tal, si usted o sus usuarios desean crear enlaces _blank , probablemente todavía puedan.

Si esa es una característica que usará con frecuencia, podría tener sentido crear su propia sintaxis, pero en general no es una característica vital. Si quiero abrir ese enlace en una nueva ventana, ctrl-haga clic en él, gracias.

Answer 4

En mi proyecto estoy haciendo esto y funciona bien:

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

Link

Pero no todos los analizadores te permiten hacer eso.

Answer 5

Esto funciona para mí: [Enlace de página] (su url aquí "(target | _blank)")

Answer 6

Estoy usando Grav CMS y esto funciona perfectamente:

Cuerpo / Contenido:
Some text[1]

Cuerpo / Referencia:
[1]: http://somelink.com/?target=_blank

Solo asegúrese de que el atributo de destino se pase primero, si hay atributos adicionales en el enlace, cópielos / péguelos al final de la URL de referencia.

También funciona como enlace directo:
[Go to this page](http://somelink.com/?target=_blank)

Answer 7

Me encontré con este problema al intentar implementar markdown usando PHP.

Dado que los enlaces generados por el usuario creados con markdown deben abrirse en una nueva pestaña, pero los enlaces del sitio deben permanecer en la pestaña. Cambié markdown para generar solo enlaces que se abran en una nueva pestaña. Así que no todos los enlaces de la página se vinculan, solo los que usan markdown.

En markdown, cambié toda la salida del enlace para que fuera <a target=''_blank'' href="..."> cual fue bastante fácil con buscar / reemplazar.

Answer 8

No creo que haya una característica de rebaja.

Aunque puede haber otras opciones disponibles si desea abrir enlaces que apunten fuera de su propio sitio automáticamente con 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 .

Si estás usando jQuery es un poco más simple ...

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

jsFiddle .

Answer 9

No estoy de acuerdo en que es una mejor experiencia de usuario permanecer dentro de una pestaña del navegador. Si desea que las personas permanezcan en su sitio o regrese para terminar de leer ese artículo, envíelos a una nueva pestaña.

Basándose en la respuesta de @ davidmorrow, lance este javascript en su sitio y convierta los enlaces externos en enlaces con 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>

Answer 10

No hay una manera fácil de hacerlo, y como @alex ha notado que necesitarás usar JavaScript. Su respuesta es la mejor solución, pero para optimizarla, es posible que desee filtrar solo a los enlaces de contenido posterior.

<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>

El código es compatible con IE8 + y puede agregarlo al final de su página. Tenga en cuenta que deberá cambiar ".post-content a" a la clase que está usando para sus publicaciones.

Como se ve aquí: http://blog.hubii.com/target-_blank-for-links-on-ghost/

Answer 11

Para completar alex respondió (13 de diciembre de 10)

Se podría hacer un objetivo de inyección más inteligente con este código:

/*
 * 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'');

Puede cambiar las excepciones de expresiones regulares agregando más extensiones en la construcción del grupo (?!html?|php3?|aspx?) (Entienda esta expresión regular aquí: https://regex101.com/r/sE6gT9/3 ).

y para una versión sin jQuery, verifique el código a continuación:

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'';
        } 
    }
}

Answer 12

Para uso de reducción de fantasmas:

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

Lo encontré aquí: https://cmatskas.com/open-external-links-in-a-new-window-ghost/

Answer 13

Por lo tanto, no es del todo cierto que no pueda agregar atributos de enlace a una URL de Markdown. Para agregar atributos, verifique con el analizador de rebajas subyacente que se está utilizando y cuáles son sus extensiones.

En particular, pandoc tiene una extensión para habilitar los link_attributes , que permiten el marcado en el enlace. p.ej

[Hello, world!](http://example.com/){target="_blank"}

• Para aquellos que vienen de R (por ejemplo, utilizando rmarkdown , rmarkdown , bookdown , etc.), esta es la sintaxis que desea.
• Para aquellos que no usan R , es posible que deba habilitar la extensión en la llamada a pandoc con +link_attributes

Nota: Esto es diferente al kramdown analizador kramdown , que es una de las respuestas aceptadas anteriormente. En particular, tenga en cuenta que kramdown difiere de pandoc ya que requiere dos puntos - : - al comienzo de las llaves - {} , por ejemplo

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

En particular:

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

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

Answer 14

Puedes agregar cualquier atributo usando {[attr] = "[prop]"}

Por ejemplo, [Google] ( http://www.google.com ) {target = "_ blank"}

Answer 15

Puedes hacer esto a través de código javascript nativo así:

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

Código JSFiddle

Answer 16

Una solución global es poner <base target="_blank"> en el elemento <head> su página. Eso agrega efectivamente un objetivo predeterminado a cada elemento de anclaje. Uso markdown para crear contenido en mi sitio web basado en Wordpress, y el personalizador de mi tema me permitirá inyectar ese código en la parte superior de cada página. Si tu tema no hace eso, hay un plug-in

Answer 17

Kramdown apoya. Es compatible con la sintaxis de Markdown estándar, pero también tiene muchas extensiones. Lo usarías así:

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