2014-11-23 4 views
9

Ich verstehe, dass die target Attribut einer <a> Verknüpfung kann nicht von CSS angegeben werden. Ich möchte in der Lage sein, externe Links in einem Jekyll mit der folgenden Ausgabe basierte Abschlag Dokument zu erzeugen:Jekyll: produzieren benutzerdefinierten HTML für externe Links (Ziel-und CSS-Klasse)

<a href="the-url" class="external" target="_blank">the text</a> 

ohne so zu etwas zurückgreifen:

[the text](the url){:target"_blank" class="external"} 

Ich will nicht hard-code die target in jedem Link, weil ich es irgendwann ändern möchte, auch es ist laut. So ideal hätte ich

[the text](the url){:class="external"} 

... aber dann kann CSS nicht die target="_blank" hinzufügen.

So würde meine Idee ein eigenes Plugin sein, die mich

{% ext-link the-url the text %} 

Ist ein solches Plugin existieren schreiben können? Gibt es bessere Möglichkeiten, dies zu erreichen?

Antwort

8

Es scheint, dass das Schreiben eines Plugins einfach ist. Dies ist, was ich habe kommen mit:

module Jekyll 
    class ExtLinkTag < Liquid::Tag 
    @text = '' 
    @link = '' 

    def initialize(tag_name, markup, tokens) 
     if markup =~ /(.+)(\s+(https?:\S+))/i 
     @text = $1 
     @link = $3 
     end 
     super 
    end 

    def render(context) 
     output = super 
     "<a class='external' target='_blank' href='"[email protected]+"'>"[email protected]+"</a>" 
    end 
    end 
end 

Liquid::Template.register_tag('extlink', Jekyll::ExtLinkTag) 

Beispiel Nutzung:

Exhibition at {% extlink Forum Stadtpark http://forum.mur.at %}. 

HTML-Ausgabe:

<p>Exhibition at <a class="external" target="_blank" href="http://forum.mur.at">Forum Stadtpark</a>.</p> 
11

Wenn Sie dies auf Github tun müssen, um pagesand dann nicht Plugins verwenden, Sie können es mit javascript tun:

// any link that is not part of the current domain is modified 

(function() { 
    var links = document.links; 
    for (var i = 0, linksLength = links.length; i < linksLength; i++) { 
    // can also be 
    // links[i].hostname != 'subdomain.example.com' 
    if (links[i].hostname != window.location.hostname) { 
     links[i].target = '_blank'; 
     links[i].className += ' externalLink'; 
    } 
    } 
})(); 

Inspiriert von this answer.

2

Es gibt eine kleine Jekyll-Plugin ist target="_blank", rel="nofollow", Klassennamen anwenden, und alle anderen Attribute Ihrer Wahl automatisch auf externe Links:

Jekyll ExtLinks Plugin

Eine Liste von Hosts übersprungen werden, wenn rel Anwendung kann konfiguriert werden, wenn Sie einige Links unberührt lassen möchten. Auf diese Weise müssen Sie nicht mehr mit Markdown arbeiten.

UPD: Dieses Plugin wurde jetzt für RubyGems freigegeben: jekyll-extlinks. Verwenden Sie gem install jekyll-extlinks, um es zu installieren. Auch available on GitHub.

+0

Dieses Plugin funktioniert nicht für mich auf jekyll 3.3.1. –

+0

Getestet auf Jekyll 3.4.0, hatte ein Problem mit Nokogiri - behoben durch Angabe des Edelsteins 'Nokogiri' im Projekt Gemfile. Ansonsten funktionierte das Plugin gut. – nourish