keithmifsud / jekyll-target-blank Goto Github PK

Automatically opens external links in a new browser for Jekyll Pages, Posts and Docs.

License: MIT License

Ruby 99.02% Shell 0.98%

jekyll-target-blank's Introduction

Jekyll Target Blank

Automatically adds a target="_blank" rel="noopener noreferrer" attribute to all external links in Jekyll's content plus several other automation features for the external links. Read more here

Installation

Add the following to your site's Gemfile

gem 'jekyll-target-blank'

and add the following to your site's _config.yml

plugins:
  - jekyll-target-blank

Note: if jekyll --version is less than 3.5 use:

gems:
  - jekyll-target-blank

Usage

By default. all anchor tags and markdown links pointing to an external host, other than the one listed as the url in Jekyll's _config.yml will automatically be opened in a new browser tab once the site is generated.

All the links in pages, posts and custom collections are included except for __plain text links.

Examples

HTML

The following HTML anchor tag:

<a href="https://google.com">Google</a>

will be replaced with:

<a href="https://google.com" target="_blank" rel="noopener noreferrer">Google</a>

..unless your website's URL is google.com 😉

Markdown

[Google](https://google.com)

will be generated as:

<a href="https://google.com" target="_blank" rel="noopener noreferrer">Google</a>

Configuration

No custom configuration is needed for using this plugin, however, you can override some default behaviours and also make use of some extra features as explained in this section.

Override the default behaviour

You can override the default behaviour and only force external links to open in new browser if they have a CSS class name included with the same value as the one listed in the Jekyll _config.yml file.

To override this automation, add an entry in your site's config.yml file, specifying which CSS class name a link must have for it to be forced to open in a new browser:

target-blank:
    css_class: ext-link

With the above setting, only links containing the class="ext-link" attribute will be forced to open in a new browser.

Automatically add additional CSS Classes

You can also automatically add additional CSS classes to qualifying external links. This feature is useful when you want to add CSS styling to external links such as automatically displaying an icon to show the reader that the link will open in a new browser.

You can add one or more space separated CSS classes in _config.yml like so:

target-blank:
    add_css_classes: css-class-one css-class-two

The above example will add class="css-class-one css-class-two" to the generated anchor tag. These CSS class names will be added in addition to any other existing CSS class names of a link.

Override the default rel attributes

For security reasons, rel="noopener noreferrer" are added by default to all the processed external links. You can override adding any of the noopener and noreferrer values with the following entries in your site's _config.yml file.

To exclude the noopener value:

target-blank:
   noopener: false

To exclude the noreferrer value:

target-blank:
   noreferrer: false

To exclude both noopener and noreferrer values:

target-blank:
   noopener: false
   noreferrer: false

Adding additional rel attribute values

You can add additional rel="" attribute values by simply specifying them in your site's _config.yml file.

target-blank:
    rel: nofollow

or even more than one extra:

target-blank:
    rel: nofollow

Note:

The rel setting overrides other default rel attribute values. Therefore, (for example), if you exclude the noopener value and then add it to the rel property, it will still be added. The following config:

target-blank:
    noopener: false
    rel: noopener

will output:

<a href"https://some-external-website.what" target="_blank" rel="noreferrer noopener">Some link</a>

Support

Simply create an issue and I will respond as soon as possible.

Contributing

Fork it
Create your feature branch (`git checkout -b my-new-feature)
Commit your changes (git commit -m 'Add some feature')
Push to the branch (git push origin my-new-feature)
Create a new Pull Request

Testing

rake spec
# or
rspec

Credits

The logo illustration was Designed by Freepik. Thank you ❤️

Legal

This software is distributed under the MIT license.

jekyll-target-blank's People

Contributors

Stargazers

Watchers

Forkers

kenchan0130 texastoast mukrop soptq mcrobs cspeterson intika-jekyll-plugins damianooldoni jekyllresources irruputuncu chriskyfung robertojbeltran prplecake pirafrank codexwr lucius-asclepius seskritt paoloumali

jekyll-target-blank's Issues

Ability to add other "rel=" attributes to external links.

I would like the user to be able to add other attributes such as rel="nofollow". This should be set in _config.yml and should be optional.

Since we already have two values for the rel attribute set by default, a user should be able to set a string or an array of other rel attribute values:

target-blank:
  rel: nofollow

or more than one:

target-blank:
  rel: nofollow tag

Develop the feature using TDD - of course!
Test that adding rel: nofollow in _config.yml outputs the default rel attributes plus the nofollow.
Test that adding rel: nofollow tag in _config.yml outputs the default rel attributes plus the nofollow tag.
Test that adding rel: nofollow and noopener: false in _config.yml outputs the default rel attributes plus the nofollow without the noopener value.
- The same when two extra rel tags are specified in config.
Test that having both noopener: false and noreferrer: false in _cofig.yml while having rel: nofollow does not output the default rel attributes but only the additional one.
- Even when more than one additional rel attribute values are set.

Just in case I didn't explain this well or the reader didn't get it:

Having noopener: false in _config.yml while having rel: noopener still includes the noopener value.
- Even when nofollow is set as a rel property.
Reafctor Spec class.
Reafctor Main class.
Document the feature in the Readme.md file.
Submit a PR to the pre-release branch
Fix any Travis Build issues.
Mewrge with the pre-release branch.

Ability to include internal links.

Add option open internal links in a new browser.

by default.
By specifying a CSS class only to internal links.
By specifying a CSS class only to external links.
By specifying a CSS class to all links.

Cannot build Jekyll site

My Jekyll site compiles fine without the jekyll-target-blank pluging, but when I add it to my Gemfile, I get the following:

LoadError: cannot load such file -- google/protobuf_c
  /Users/ian/.gems/gems/google-protobuf-3.23.0-x86_64-darwin/lib/google/protobuf.rb:51:in `require'
  /Users/ian/.gems/gems/google-protobuf-3.23.0-x86_64-darwin/lib/google/protobuf.rb:51:in `rescue in <top (required)>'
  /Users/ian/.gems/gems/google-protobuf-3.23.0-x86_64-darwin/lib/google/protobuf.rb:48:in `<top (required)>'
  /Users/ian/.gems/gems/sass-embedded-1.58.3-x86_64-darwin/ext/sass/embedded_sass_pb.rb:4:in `require'
  /Users/ian/.gems/gems/sass-embedded-1.58.3-x86_64-darwin/ext/sass/embedded_sass_pb.rb:4:in `<top (required)>'
  /Users/ian/.gems/gems/sass-embedded-1.58.3-x86_64-darwin/lib/sass/embedded.rb:4:in `require_relative'
  /Users/ian/.gems/gems/sass-embedded-1.58.3-x86_64-darwin/lib/sass/embedded.rb:4:in `<top (required)>'
  /Users/ian/.gems/gems/sass-embedded-1.58.3-x86_64-darwin/lib/sass-embedded.rb:4:in `require_relative'
  /Users/ian/.gems/gems/sass-embedded-1.58.3-x86_64-darwin/lib/sass-embedded.rb:4:in `<top (required)>'
  /Users/ian/.gems/gems/jekyll-sass-converter-3.0.0/lib/jekyll/converters/scss.rb:8:in `require'
  /Users/ian/.gems/gems/jekyll-sass-converter-3.0.0/lib/jekyll/converters/scss.rb:8:in `<top (required)>'
  /Users/ian/.gems/gems/jekyll-sass-converter-3.0.0/lib/jekyll-sass-converter.rb:4:in `require'
  /Users/ian/.gems/gems/jekyll-sass-converter-3.0.0/lib/jekyll-sass-converter.rb:4:in `<top (required)>'
  /Users/ian/.gems/gems/jekyll-4.3.2/lib/jekyll.rb:195:in `require'
  /Users/ian/.gems/gems/jekyll-4.3.2/lib/jekyll.rb:195:in `<top (required)>'
  /Users/ian/.gems/gems/jekyll-4.3.2/exe/jekyll:8:in `require'
  /Users/ian/.gems/gems/jekyll-4.3.2/exe/jekyll:8:in `<top (required)>'
  /Users/ian/.gems/bin/jekyll:23:in `load'
  /Users/ian/.gems/bin/jekyll:23:in `<top (required)>'

My Gemfile looks like this:

source "https://rubygems.org"

gem "jekyll", "~> 4.3.2"

group :jekyll_plugins do
  gem "jekyll-feed", "~> 0.15.1"
  gem "jekyll-sitemap", "~> 1.4.0"
  gem "jekyll-paginate-v2", "~> 3.0.0"
  gem "jekyll-target-blank", "~> 2.0.2"
end

gem "http_parser.rb", "~> 0.6.0", :platforms => [:jruby]

Moreover,

bundle info google-protobuf_c
The dependency http_parser.rb (~> 0.6.0) will be unused by any of the platforms Bundler is installing for. Bundler is installing for ruby but the dependency is only for java. To add those platforms to the bundle, run `bundle lock --add-platform java`.
Could not find gem 'google-protobuf_c'.

_config file must have the url entry

In the documentation for jekyll-target-blank, you might want to add a note that "url="https://some.site.name/" must exist within the site's "_config.yml" file, otherwise it crashes when trying to compile with bundle (null value).

Add rel attribute with noopener to all links with target=_blank

Thanks for the handy plugin 👍

If would love to have a feature where I am able to configure that the attribute rel="noopener noreferrer" should be added to all links with target="blank". So my goal is to add the rel attribute where needed and not to specify the target attribute for all external link.

This way you are able to control which links are opened in a new tab and these links are secured automatically because the plugin adds the rel attribute with the configured values.

css tag for not modifying external links

According to the documentation, it is possible to set jekyll-target-blank up so that no external links are assigned target=blank without a css tag, but what about the reverse: all external links EXCEPT those with a specific css tag? Sorry if I missed this and it is supported!

do not ovewrite custom attributes e.g. {:rel="sponsored"}

Great plugin! Thanks for creating it.

Please, add a setting to skip manually set attributes.

For example, sometimes I publish sponsored links written in markdown as:
[some text](https://www.sposnsor.com/){:rel="sponsored"}

jekyll-target-blank would remove rel="sponsored" and add the default target="_blank" rel="noopener". This is not a desirable behavior. It should be target="_blank" rel="sponsored noopener" instead.

Sorry, I do not know how to develop a jekyll plugin, so I cannot PR this feature.

1.2.0 doesn't work with Jekyll v4

Hi Keith,
latest version doesn't work with Jekyll v4, which seems to be a rubocop issue...
Built a local version requiring rubocop-jekyll instead and it seems to work just fine.
Would be absolutely fantastic if you could do the same.
Cheers!

How to exclude certain addresses from the plugin processing?

Hello.
How to exclude certain addresses from the plugin processing?
like this:

Exclude:
     true
site:
     example.com

Generated markup should include `rel="noopener noreferrer" by default.

As per the contribution by @buren for PR: #7. Moved to #12

Not working (with Github Pages)

The plugin is not working on https://machinetranslate.org, even though we apparently set it up correctly.

Thanks in advance for any help

To repro

For example, see https://machinetranslate.org/wmt22

statmt.org/wmt22

Expected: <a href="https://statmt.org/wmt22/" target="_blank" rel="noopener noreferrer">statmt.org/wmt22/</a>
Actual: <a href="https://statmt.org/wmt22/">statmt.org/wmt22/</a>

Our setup

AFAICT, we're setting up jekyll-target-blank correctly:

https://github.com/machinetranslate/machinetranslate.org/search?q=jekyll-target-blank

Gemfile:

group :jekyll_plugins do
 ...
 gem 'jekyll-target-blank'
 ...
end

_config.yml:

url: https://machinetranslate.org
...
plugins:
 ...
 - jekyll-target-blank
 ...

Here's our setup:

Github Pages
theme: Just The Docs
special handling of external links in CSS

Questions

Are we setting up jekyll-target-blank correctly?

Is there a known issue with Just The Docs?

Or maybe one of the other plugins or our CSS is interfering?

does not work on Ruby 2.6

Hello
current version will not work with latest Ruby 2.6.3 as Nokogiri version 1.8.5 is required.
Thought I let you know...

Keep up the good work!

Ability to switch the automatic inclusion of the `rel` attributes.

@buren to resubmit the PR to the pre-release branch.
A user can state in the Jeyll's _config.yml file the following options:

target-blank:
  noopener: false
  noreferrer: false

Both options will be true by default.

Remove rel="noopener noreferrer" from default config

As seen in About rel=noopener, all modern browsers now implicitly set both rel="noopener" and rel="noreferrer" by default.

Therefore, it should be nice to remove the automatic addition of rel="noopener noreferrer" and leave target="_blank" only.

The user should be able to ad noopener and noreferrer from their _config.yml.

In 2.0.0: undefined method `match?' for "/":String (NoMethodError)

Hello. I noticed that after this module's 2.0.0 version gem was released, my Jekyll builds started to fail on this error. When I run it with --trace it points to this gem with the following error message.

✗ bundle exec jekyll build -d public --trace
Configuration file: /home/user/git/gitlab/myname.gitlab.io/_config.yml
            Source: /home/user/git/gitlab/myname.gitlab.io
       Destination: public
 Incremental build: disabled. Enable with --incremental
      Generating... 
       Jekyll Feed: Generating feed for posts
/home/user/git/gitlab/myname.gitlab.io/vendor/bundle/ruby/2.3.0/gems/jekyll-target-blank-2.0.0/lib/jekyll-target-blank.rb:195:in `external?': undefined method `match?' for "/":String (NoMethodError)
Did you mean?  match
	from /home/user/git/gitlab/myname.gitlab.io/vendor/bundle/ruby/2.3.0/gems/jekyll-target-blank-2.0.0/lib/jekyll-target-blank.rb:92:in `processable_link?'
	from /home/user/git/gitlab/myname.gitlab.io/vendor/bundle/ruby/2.3.0/gems/jekyll-target-blank-2.0.0/lib/jekyll-target-blank.rb:78:in `block in process_anchor_tags'

Is this line jekyll-target-blank#L195 parsable by ruby 2.3.x ?

The previous versions 1.2 and 1.1.1 seemed to work as expected.

Custom Liquid Tags

I'd like to extend this plugin by adding some custom liquid tags.

... more to come...

Release version 1.1

Define path on own domain as external links

Hi, your plugin looks like exactly what I've been looking for! However, I (and I know a lot of other people) are using a link structure that looks something like this for external links: mydomain.com/go/whatever or mydomain.com/out/whatever

This is for link tracking purposes.

The issue is that those links look like internal to your plugin, even though in reality they are external. Short of adding a custom class to all the links (which negates the purpose of your plugin) I don't think there's a way to define these as external, currently.

I took a quick look at your code to see if it would be easy to fix myself, but my Ruby skills are unfortunately very basic. Is this something that would be relatively straight forward to add?

Causes HTML named character entities to be rendered incorrectly

Hi everyone. When this plugin is used, it causes some HTML named character entities to become unparsed, i.e. they're rendered as the raw entity string instead of the correct character. For example, &mldr; is literally displayed as &mldr; instead of "...". They render correctly when this plugin is removed.

It appears that it only breaks for HTML 5.0 named character entities (reference list), but pre-5.0 entities still work. Additionally, the equivalent hexadecimal and decimal entities (e.g. … and …) work even for the 5.0 characters.

As HTML 5.0 introduces new characters not present in previous standards, and it is good practice to use the named entity for ease of code maintenance, I believe this issue should be resolved.

Technical details

jekyll-target-blank: v2.0.2 (standard config, no additional options in _config.yml)
jekyll: v4.3.2
Other plugins: jekyll-autoprefixer, jekyll-minifier
Browser: Chrome 119, Safari 17
OS: macOS 14 Sonoma

Be able to exclude some pages

It would be great if in _config.yml the user could add:

target-blank:
  exclude:
    - "/index.html"
    - "/somepage"
    -  "/some-other-page"

So that the pages written can be excluded by the plugin.

Thank you very much!

Best,
T

Add hostname white list to skip adding rel attributes

This issue was moved from kenchan0130#10.

The behavior I'm seeking is:

All external links open in a new window
All external links get noopner and noreferrer
An optional white list of hostnames can be added which don't get the rel nofollow attributes (even if set)

Use case:

I'm going to be adding a site where 95% of the links are external and 5% of the links are trusted so I don't want to set nofollow.

Potential API for usage:

target-blank:
  rel_nofollow_skip_domains: ["example.com", "github.com"]

Example link output:

<a href="http://example.com" target="_blank">Example</a>
<a href="https://example.com" target="_blank">Example</a>
<a href="https://www.example.com" target="_blank">Example</a>
<a href="http://foo.github.com" target="_blank">GitHub</a>
<a href="https://www.github.com" target="_blank">GitHub</a>
<a href="https://foo.bar.github.com" target="_blank">GitHub</a>
<a href="https://somewhere.com" target="_blank" rel="nofollow">Somewhere</a>

Github pages compability

Hi!

This plugin is exactly what I'm looking for, but it doesn't seem to be compatible with Github pages? If I'm wrong, please neglect this issue report.

Error: bad URI(is not URI?): http://localhost:4000

I get this while trying to run it locally.

Any clues? I am using jekyll-target-blank 2.0.0 and jekyll 3.8.5.

Remove CI checks so that we can merge the PRs.

Update for Jekyll 4

Hello
would you mind updating dependencies to the latest Jekyll?
The current release does not work with Jekyll 4, unfortunately.

Keep up the great work & thanks a bunch!

Intel Mac -- Arm64 Nokogiri...

Put it in my Gemfile, and it apparently installed there okay:

Installing racc 1.6.0 with native extensions
Fetching nokogiri 1.13.1 (x86_64-darwin)
Fetching nokogiri 1.13.1 (arm64-darwin)
Installing nokogiri 1.13.1 (x86_64-darwin)
Installing nokogiri 1.13.1 (arm64-darwin)
Fetching jekyll-target-blank 2.0.0
Installing jekyll-target-blank 2.0.0
Bundle complete! 9 Gemfile dependencies, 55 gems now installed.
Bundled gems are installed into `./.vendor/bundle`

Run Jekyll serve, and it blows up. The relevant error from the stack trace is:

dlopen(/Users/wook/projects/munged-org/.vendor/bundle/ruby/2.6.0/gems/nokogiri-1.13.1-arm64-darwin/lib/nokogiri/2.6/nokogiri.bundle, 0x0009):
tried: '/Users/wook/projects/munged-org/.vendor/bundle/ruby/2.6.0/gems/nokogiri-1.13.1-arm64-darwin/lib/nokogiri/2.6/nokogiri.bundle'
(mach-o file, but is an incompatible architecture (have 'arm64', need 'x86_64h')), '/usr/lib/nokogiri.bundle' (no such file)
 - /Users/wook/projects/munged-org/.vendor/bundle/ruby/2.6.0/gems/nokogiri-1.13.1-arm64-darwin/lib/nokogiri/2.6/nokogiri.bundle (LoadError)

As it says, I have a intel MacBook Pro. Not sure why it's calling the arm64 executable.

If I delete the arm64 nokogiri gem, then it seems to work. But any use of bundle install or bundle update puts it right back in place, which is kinda annoying. I've not found a way to exclude that gem in the Gemfile. No idea how to force it to use the right one, if that's even possible.

It's possible that the default `rel` attribute and properties are not forced to links when the config requires a CSS class name.

Amend the specs in the related context so that they expect the rel=... attribute.

Add an optional css class to external links.

I would like the user to be able to add an optional CSS class to the external links. This should be set in the config file like so:

target-blank:
  add_css_classes: some-class

or multiple classes:

target-blank:
  add_css_classes: some-class another-class

Error: URI must be ascii only

Thanks you for your plug-in!
I would like to use it but some of the URL I use have Kanji's.
Do you think you'll upgrade in a future?

Make the plugin work with Markdown only

When I write the <a> tags in HTML, often times I need to specify different and custom rel attributes. It would be great if we could select in _config.yml if the plugin should work only with Markdown links or in all the website, regardless if the link is in md or HTML.

Something like this could be implemented in _config.yml:

target-blank:
  md-only: true # or “false” (default value)

This feature could be game-changing!

Thank you very much for your work, @keithmifsud!

Best,
T

exclude specific external links

Hi
is there any way of excluding an external link?
Thanks a bunch!

[SECURITY] Upgrade Nokogiri dependency

sorry, there is any update with this PR?
I would like to update nokogiri on my Jekyll installation to fix this:
https://cve.mitre.org/cgi-bin/cvename.cgi?name=CVE-2019-11068

Thanks

Hi @cristianocasella I will now release v1.2 for the security issue and then 2.0 for Jekyll 4 which will include the security fix.

Originally posted by @keithmifsud in #35 (comment)

Plugin isn’t working

jekyll-target-blank version: 2.0.0
jekyll version: 4.1.0
OS: MacOS 10.15.4

I’m sure I installed the gem correctly, but it’s not working. What could be interfering?

I added it in "Gemfile" file (next to other plugins with same configuration, which are working correctly) and I added it in "_config.yml" plugin: list.

then I ran:

bundle install

then

bundle update

then

bundle exec jekyll serve --trace --watch

Then I opened my localhost and clicked on a test link I wrote as [example](http://example.com). It opens succesfully, but in the same page. It is parsed as <a href="http://example.com">example</a>

by running bundle info jekyll-target-blank I get this:

  * jekyll-target-blank (2.0.0)
	Summary: Target Blank automatically changes the external links to open in a new browser.
	Homepage: https://github.com/keithmifsud/jekyll-target-blank
	Path: /Library/Ruby/Gems/2.6.0/gems/jekyll-target-blank-2.0.0

What can I do?

Please, this plugin would be vital for me and I’d love it if only it worked.

Thanks a lot in advance!

Ability to not force all external links to open in new browser by default.

The User can input an entry in the Jekyll's config file to state which links should open in a new browser by specifying a CSS class name. Like so:

target-blank:
  css_class: ext-link

If a css_class is specified, only links containing that class name will open in a new browser unless overwritten by another tag of course 😄

Refactor the main class by using the initialised @config instance variable.
Refactor tests by removing unit tests to private methods.
Enforce standards using rubocop
Comment the code.
Update the Readme.md file to reflect this feature.
Merge into the pre-release branch.

Not working when URL constructed from site data

@keithmifsud Thanks for creating this plugin! It works well when a URL is hard-coded in document. But I couldn't make it work if the URL comes from a variable within site data. For example:

[Google](https://google.com)
[Google]({{ site.data.google.url }})
<a href="{{ site.data.google.url }}">Google</a>

Only the first URL is rendered with target="_blank"

Do you have any advice? Thanks again!

Plugin breaks Layouts on site generation.

The entire body gets encapsulated in the header tag for my website. Not sure why.

Development Tasks:

Should ignore mailto URLs

Building Jekyll sites throws an error if any URL contains non ASCII characters.

Create a test / spec to reproduce this bug.
Write code to make fix it.
Build version 0.9.0 of the ruby gem and deploy it.
Run an integration test on an isolated install.

Plugin not working

Hi there!

Trying to add this to my site here: https://github.com/giacomolaw/blog

However, as you can see from this link, the URLs do not open in new tabs: https://giacomolaw.me/blog/...

What am I doing wrong?

Thanks!

Plugin not working unless the gem is added to the group :jekyll_plugins section

Hi, I'm using the minimal-mistakes template and I don't know if it's something specific to that, but jekyll-target-blank didn't work by just adding it to the end of the Gemfile; instead, I had to add it to the group :jekyll_plugins section. I spent 30 minutes figuring this out so I thought it would be useful to open an issue so that it's noted.

# If you have any plugins, put them here!
group :jekyll_plugins do
  gem "jekyll-paginate"
  gem "jekyll-sitemap"
  gem "jekyll-gist"
  gem "jekyll-feed"
  gem "jemoji"
  gem "jekyll-include-cache"
  gem "jekyll-algolia"
  gem "jekyll-target-blank"
end

gem "commonmarker", "~> 0.23.4"
gem "racc", "~> 1.6"
gem "unf_ext", "~> 0.0.8"
gem "minimal-mistakes-jekyll"
gem "webrick", "~> 1.7"

Maybe README.md should write something like this?

Add the following to your site's Gemfile (into the group :jekyll_plugins section if you have one):
gem 'jekyll-target-blank'