npm package discovery and stats viewer.

Discover Tips

  • General search

    [free text search, go nuts!]

  • Package details

    pkg:[package-name]

  • User packages

    @[username]

Sponsor

Optimize Toolset

I’ve always been into building performant and accessible sites, but lately I’ve been taking it extremely seriously. So much so that I’ve been building a tool to help me optimize and monitor the sites that I build to make sure that I’m making an attempt to offer the best experience to those who visit them. If you’re into performant, accessible and SEO friendly sites, you might like it too! You can check it out at Optimize Toolset.

About

Hi, 👋, I’m Ryan Hefner  and I built this site for me, and you! The goal of this site was to provide an easy way for me to check the stats on my npm packages, both for prioritizing issues and updates, and to give me a little kick in the pants to keep up on stuff.

As I was building it, I realized that I was actually using the tool to build the tool, and figured I might as well put this out there and hopefully others will find it to be a fast and useful way to search and browse npm packages as I have.

If you’re interested in other things I’m working on, follow me on Twitter or check out the open source projects I’ve been publishing on GitHub.

I am also working on a Twitter bot for this site to tweet the most popular, newest, random packages from npm. Please follow that account now and it will start sending out packages soon–ish.

Open Software & Tools

This site wouldn’t be possible without the immense generosity and tireless efforts from the people who make contributions to the world and share their work via open source initiatives. Thank you 🙏

© 2024 – Pkg Stats / Ryan Hefner

hexo-tag-google-photos-album-gallery

v1.0.1

Published

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

Downloads

40

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.