hexo-tag-ogp-link-preview

1.1.1 • Public • Published

hexo-tag-ogp-link-preview

A Hexo tag plugin for embedding link preview by OpenGraph on article.

MIT License Lint and Test Maintainability Test Coverage

Installation

npm install hexo-tag-ogp-link-preview

Usage

Write like below to your hexo article markdown file:

{% link_preview url [target] [rel] [loading] %}
[Content]
{% endlink_preview %}

or you are able to use "Named Parameter":

{% link_preview url [rel:{rel_value}] [target:{target_value}] [loading:{loading_value}] %}
[Content]
{% endlink_preview %}

Tag arguments

Notice: All optionally parameters (except for the required url parameter) are able to use "Named Parameter".

Name Required? Default Description
url Yes This parameter is a target of the link preview.
target No _blank Specify a target attribute of the anchor element.
One of _self, _blank, _parent, or _top.
rel No nofollow Specify a rel attribute of the anchor element.
One of external, nofollow, noopener, noreferrer, or opener.
loading No lazy Specify a loading attribute of the image element.
One of lazy, eager, or none.
If specify a none, remove loading attribute from image element.

Tag content

content is fallback text which use when failed to get OpenGraph data from url.

Configuration

You write like below to hexo configuration file _config.yml:

link_preview:
  class_name:
    anchor_link: link-preview
    image: not-gallery-item
  description_length: 140
  disguise_crawler: true

Setting values

Notice: All setting values are NOT required.

Name type Default Description
class_name string or object link-preview If you are specified string, set a class attribute of the anchor element only.
If you are specified object, set each a class attribute of the anchor element and the image element.
class_name.anchor_link string link-preview Set a class attribute of the anchor element.
class_name.image string Set a class attribute of the image element.
If you are not specify (empty string, etc.), nothing to set.
description_length number 140 It sliced to fit if a number of character of the og:Description exceeds the specified number value.
disguise_crawler boolean true If scraper for OpenGraph want to disguise to crawler, set true.
Otherwise, set to false.

Example

Write a following to your hexo article markdown file:

{% link_preview http://www.example.com/ loading:lazy %}
fallback Text
{% endlink_preview %}

When scraper get OpenGraph successfully, generated html like blow:

<a href="http://www.example.com/" target="_blank" rel="nofollow" class="link-preview">
    <div class="og-image">
        <img src="https://www.example.com/image.png" alt="example image" class="not-gallery-item" loading="lazy">
    </div>
    <div class="descriptions">
        <div class="og-title">title text</div>
        <div class="og-description">description text</div>
    </div>
</a>

When scraper fail to get OpenGraph, generated html like blow:

<a href="http://www.example.com/">fallback Text</a>

Package Sidebar

Install

npm i hexo-tag-ogp-link-preview

Weekly Downloads

11

Version

1.1.1

License

MIT

Unpacked Size

63.6 kB

Total Files

27

Last publish

Collaborators

  • h-sugawara