{"id":13713298,"url":"https://github.com/MoePlayer/hexo-tag-aplayer","last_synced_at":"2025-05-06T23:31:37.240Z","repository":{"id":43114077,"uuid":"49593176","full_name":"MoePlayer/hexo-tag-aplayer","owner":"MoePlayer","description":"Embed aplayer in Hexo posts/pages","archived":false,"fork":false,"pushed_at":"2023-02-19T07:34:52.000Z","size":80,"stargazers_count":748,"open_issues_count":54,"forks_count":93,"subscribers_count":5,"default_branch":"master","last_synced_at":"2025-04-26T22:17:36.793Z","etag":null,"topics":["hexo","music","player","plugin"],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/MoePlayer.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null}},"created_at":"2016-01-13T18:27:59.000Z","updated_at":"2025-04-17T07:16:10.000Z","dependencies_parsed_at":"2022-08-12T10:20:40.140Z","dependency_job_id":"d4ec1d6f-9fe1-400b-b5b9-5cb4c322f9fa","html_url":"https://github.com/MoePlayer/hexo-tag-aplayer","commit_stats":{"total_commits":87,"total_committers":7,"mean_commits":"12.428571428571429","dds":0.08045977011494254,"last_synced_commit":"d7175376bd505aab0d5350c5e6bcf64ca74c2478"},"previous_names":["grzhan/hexo-tag-aplayer"],"tags_count":2,"template":false,"template_full_name":null,"repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoePlayer%2Fhexo-tag-aplayer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoePlayer%2Fhexo-tag-aplayer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoePlayer%2Fhexo-tag-aplayer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/MoePlayer%2Fhexo-tag-aplayer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/MoePlayer","download_url":"https://codeload.github.com/MoePlayer/hexo-tag-aplayer/tar.gz/refs/heads/master","host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":251057988,"owners_count":21529648,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":["hexo","music","player","plugin"],"created_at":"2024-08-02T23:01:31.835Z","updated_at":"2025-05-06T23:31:32.212Z","avatar_url":"https://github.com/MoePlayer.png","language":"JavaScript","funding_links":[],"categories":["JavaScript"],"sub_categories":[],"readme":"# hexo-tag-aplayer\n\n![npm](https://img.shields.io/npm/v/hexo-tag-aplayer.svg)  ![npm](https://img.shields.io/npm/l/hexo-tag-aplayer.svg)\n\nEmbed APlayer([https://github.com/DIYgod/APlayer](https://github.com/DIYgod/APlayer)) in Hexo posts/pages.\n\n[中文文档](https://github.com/MoePlayer/hexo-tag-aplayer/blob/master/docs/README-zh_cn.md)\n\n\u003c!-- START doctoc generated TOC please keep comment here to allow auto update --\u003e\n\u003c!-- DON'T EDIT THIS SECTION, INSTEAD RE-RUN doctoc TO UPDATE --\u003e\n\n\n- [Installation](#installation)\n- [Dependency](#dependency)\n- [Usage](#usage)\n  - [Option](#option)\n  - [With lyrics](#with-lyrics)\n  - [With playlist](#with-playlist)\n  - [MeingJS support (new in 3.0)](#meingjs-support-new-in-30)\n  - [PJAX compatible](#pjax-compatible)\n- [Customization (new in 3.0)](#customization-new-in-30)\n- [Troubleshoot](#troubleshoot)\n  - [Space within arguments](#space-within-arguments)\n  - [Duplicate APlayer.JS loading](#duplicate-aplayerjs-loading)\n- [LICENSE](#license)\n\n\u003c!-- END doctoc generated TOC please keep comment here to allow auto update --\u003e\n\n\n\n\n![plugin screenshot](http://7jpp1d.com1.z0.glb.clouddn.com/QQ20160202-5.png)\n\n\n## Installation\n\n\tnpm install --save hexo-tag-aplayer\n## Dependency\n\n+ APlayer.js  \u003e= 1.10.0\n+ Meting.js \u003e= 1.2.0\n\n## Usage\n\n\t{% aplayer title author url [picture_url, narrow, autoplay, width:xxx, lrc:xxx] %}\n\n### Option\n\n+ `title` : music title\n+ `author`: music author\n+ `url`: music file url\n+ `picture_url`: optional, music picture url\n+ `narrow`: optional, narrow style\n+ `autoplay`: optional, autoplay music, not supported by mobile browsers\n+ `width:xxx`: optional, prefix `width:`, player's width (default: 100%)\n+ `lrc:xxx`: optional, prefix `lrc:`, LRC file url\n\nWith [post asset folders](https://hexo.io/docs/asset-folders.html#Tag-Plugins-For-Relative-Path-Referencing) enabled, you can easily place your image, music and LRC file into asset folder, and reference them like:\n\n\t{% aplayer \"Caffeine\" \"Jeff Williams\" \"caffeine.mp3\" \"picture.jpg\" \"lrc:caffeine.txt\" %}\n\n### With lyrics\n\nBesides 'lrc' option, you can use `aplayerlrc` which has end tag to show lyrics.\n\n\t{% aplayerlrc \"title\" \"author\" \"url\" \"autoplay\" %}\n\t[00:00.00]lrc here\n\t{% endaplayerlrc %}\n\n### With playlist\n\n\t{% aplayerlist %}\n\t{\n\t    \"narrow\": false,                          // Optional, narrow style\n\t    \"autoplay\": true,                         // Optional, autoplay song(s), not supported by mobile browsers\n\t    \"mode\": \"random\",                         // Optional, play mode, can be `random` `single` `circulation`(loop) `order`(no loop), default: `circulation`\n\t    \"showlrc\": 3,                             // Optional, show lrc, can be 1, 2, 3\n\t    \"mutex\": true,                            // Optional, pause other players when this player playing\n\t    \"theme\": \"#e6d0b2\",\t                      // Optional, theme color, default: #b7daff\n\t    \"preload\": \"metadata\",                    // Optional, the way to load music, can be 'none' 'metadata' 'auto', default: 'auto'\n\t    \"listmaxheight\": \"513px\",                 // Optional, max height of play list\n\t    \"music\": [\n\t        {\n\t            \"title\": \"CoCo\",\n\t            \"author\": \"Jeff Williams\",\n\t            \"url\": \"caffeine.mp3\",\n\t            \"pic\": \"caffeine.jpeg\",\n\t            \"lrc\": \"caffeine.txt\"\n\t        },\n\t        {\n\t            \"title\": \"アイロニ\",\n\t            \"author\": \"鹿乃\",\n\t            \"url\": \"irony.mp3\",\n\t            \"pic\": \"irony.jpg\"\n\t        }\n\t    ]\n\t}\n\t{% endaplayerlist %}\n\n### MeingJS support (new in 3.0)\n\nWhen you use MetingJS, your blog can play musics from Tencent, Netease, Xiami, Kugou, Baidu and more.\n\nSee [metowolf/MetingJS](https://github.com/metowolf/MetingJS) and [metowolf/Meting](https://github.com/metowolf/Meting) in detail.\n\nIf you want to use MetingJS in `hexo-tag-aplayer`, you need enable it in `_config.yml`\n\n```yaml\naplayer:\n  meting: true\n```\n\nNow you can use `{% meting ...%}` in your post:\n\n```\n\u003c!-- Simple example (id, server, type)  --\u003e\n{% meting \"60198\" \"netease\" \"playlist\" %}\n\n\u003c!-- Advanced example --\u003e\n{% meting \"60198\" \"netease\" \"playlist\" \"autoplay\" \"mutex:false\" \"listmaxheight:340px\" \"preload:none\" \"theme:#ad7a86\"%}\n```\n\nThe  `{% meting %}`  options are shown below:\n\n| Option        | Default      | Description                                                  |\n| ------------- | ------------ | ------------------------------------------------------------ |\n| id            | **required** | song id / playlist id / album id / search keyword            |\n| server        | **required** | Music platform: `netease`, `tencent`, `kugou`, `xiami`, `baidu` |\n| type          | **required** | `song`, `playlist`, `album`, `search`, `artist`              |\n| fixed         | `false`      | Enable fixed mode                                            |\n| mini          | `false`      | Enable mini mode                                             |\n| loop          | `all`        | Player loop play, values: 'all', 'one', 'none'               |\n| order         | `list`       | Player play order, values: 'list', 'random'                  |\n| volume        | 0.7          | Default volume, notice that player will remember user setting, default volume will not work after user set volume themselves |\n| lrctype       | 0            | Lyric type                                                   |\n| listfolded    | `false`      | Indicate whether list should folded at first                 |\n| autoplay      | `false`      | Autoplay song(s), not supported by mobile browsers           |\n| mutex         | `true`       | Pause other players when this player playing                 |\n| listmaxheight | `340px`      | Max height of play list                                      |\n| preload       | `auto`       | The way to load music, can be `none`, `metadata`, `auto`     |\n| storagename   | `metingjs`   | LocalStorage key that store player setting                   |\n| theme         | `#ad7a86`    | Theme color                                                  |\n\nRead section [customization](#customization-new-in-30)  to learn how to configure self-host meting api server in `hexo-tag-aplayer` and other configuration.\n\n### PJAX compatible\n\nYou need destroy APlayer instances manually when you use PJAX.\n\n```js\n$(document).on('pjax:start', function () {\n    if (window.aplayers) {\n        for (let i = 0; i \u003c window.aplayers.length; i++) {\n            window.aplayers[i].destroy();\n        }\n        window.aplayers = [];\n    }\n});\n```\n\n## Customization (new in 3.0)\n\nYou can configure `hexo-tag-aplayer` in `_config.yml`:\n\n```yaml\naplayer:\n  script_dir: some/place                        # Script asset path in public directory, default: 'assets/js'\n  style_dir: some/place                         # Style asset path in public directory, default: 'assets/css'\n  cdn: http://xxx/aplayer.min.js                # External APlayer.js url (CDN)\n  style_cdn: http://xxx/aplayer.min.css         # External APlayer.css url (CDN)\n  meting: true                                  # Meting support, default: false\n  meting_api: http://xxx/api.php                # Meting api url\n  meting_cdn: http://xxx/Meing.min.js           # External Meting.js url (CDN)\n  asset_inject: true                            # Auto asset injection, default: true\n  externalLink: http://xxx/aplayer.min.js       # Deprecated, use 'cdn' instead\n```\n\n## Troubleshoot\n\n### Space within arguments\n\nHexo has an [issue](https://github.com/hexojs/hexo/issues/1455) that cannot use space within tag arguments.\n\nIf you encounter this problem, **install the latest (beta) version, and wrap the arguments within a string literal, for example:**\n\n```\n{% aplayer \"Caffeine\" \"Jeff Williams\" \"caffeine.mp3\" \"autoplay\" \"width:70%\" \"lrc:caffeine.txt\" %}\n```\n\n### Duplicate APlayer.JS loading \n\nThe plugin hooks filter `after_render:html` , and it would inject `APlayer.js` and `Meting.js` in `\u003chead\u003e`:\n\n```html\n\u003chtml\u003e\n  \u003chead\u003e\n    ...\n    \u003cscript src=\"assets/js/aplayer.min.js\"\u003e\u003c/script\u003e\n    \u003cscript src=\"assets/js/meting.min.js\"\u003e\u003c/script\u003e\n  \u003c/head\u003e\n  ...\n\u003c/html\u003e\n```\n\nHowever, `after_render:html` is not fired in some cases :\n\n+ [Does not work with hexo-renderer-jade](https://github.com/hexojs/hexo-inject/issues/1)\n+ `after_render:html` seems not to get emitted in default settings of hexo server module (`hexo server`), it means you have to use static serving mode( `hexo server -s`) instead.\n\nIn such cases, the plugin would hook`after_post_render` as a fallback, which has a possibility to cause duplicate asset loadings.\n\nIf you want to solve this issue definitely, you can disable this auto-injection feature in `_config.yml` and insert the scripts by yourself:\n\n```yaml\naplayer:\n  asset_inject: false\n```\n\n## LICENSE\n\nMIT\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FMoePlayer%2Fhexo-tag-aplayer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2FMoePlayer%2Fhexo-tag-aplayer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2FMoePlayer%2Fhexo-tag-aplayer/lists"}