hexo-tag-google-photos-album-gallery

This is a Tag plugin for Hexo. It provides the ability to embed photo albums from Google Photos as galleries using lightgallery.js

Usage no npm install needed!

<script type="module">
  import hexoTagGooglePhotosAlbumGallery from 'https://cdn.skypack.dev/hexo-tag-google-photos-album-gallery';
</script>

README

hexo-tag-google-photos-album

Hexo 向けのタグ・プラグインです。 Googleフォトの、アルバムを埋め込みます。

NPM

Getting Started

インストール

$ cd <path-to-your-blog-dir>
$ npm install hexo-tag-google-photos-album --save

使い方

設定

ブログ全体の _config.yml の中に、以下を書きます。(任意)

googlePhotosAlbum:
  descriptionLength: 140
  target: _blank
  rel: noopener
  className: google-photos-album-area
  enableDefaultStyle: true
  defaultStyle: google_photos_album.css
  largeSizeThreshold: 768
  largeSize:  =s1920-no
  mediumSize: =s720-no
  smallSize:  =w225-no
  maxPics: 999
  generateAlways: false

全ての設定項目は、任意です。 特に設定を書かなくても、インストールするだけで使い始めることができます。

以下は設定項目の概要説明です。

attribute description default
descriptionLength crop the og:description in {Number} of chars. 140
target link elenment's target property. _blank
rel link element's rel property. noopener
className className for photos and descriptions. google-photos-album-area
enableDefaultStyle if set to false, you may use own styles by your way. true
defaultStyle default style and its filename. /css/google_photos_album.css
largeSizeThreshold for responsive 768
largeSize image's size to link =s1920-no
mediumSize image's size to link in case of mobile =s720-no
smallSize thumbnail's size =w225-no
maxPics (experimental)limit {Number} of embeded phtos. 999
generateAlways (experimental) false

書き方

記事(post or page)の原稿の中で、以下のように使います。

{% googlePhotosAlbum url %}
  • @param {string} url - Google Photos' share url. 短くしたURLでもOKです。

{% googlePhotosAlbum https://photos.google.com/share/AF1QipM-qmCtmxuhoUj5Y2lP7OUWe9FH1KjHqVuDokH9IxM1mj3ayWcbHxNa43NfaBLe2A?key=SUIyM0k0RkQ4OTY4elZmQVBwNDBFOFhJZVZwRTBn %}

{% googlePhotosAlbum https://photos.app.goo.gl/X4sHxrNrKTXXbTef7 %}

{% googlePhotosAlbum https://goo.gl/photos/gf86Lev5csbXs8sh9 %}

{% googlePhotosAlbum https://bit.ly/2LebRva %}

カスタマイズ

ギャラリー系のプラグインと組み合わせると良いかも。(詳しくはあとで書く)

謝辞

hexo-tag-link-preview を参考にしました

ライセンス

Copyright (c) 2019 isnot Licensed under the MIT license.