內容簡介
**概要:**
Scrobbled Blocks 透過原生的 Gutenberg 區塊將 Last.fm 的聆聽歷史帶到您的 WordPress 網站上。無論您是音樂部落客、播客、DJ，或只是想與觀眾分享您的音樂品味，這個外掛讓操作變得簡單。
**問題與答案:**
- **這個外掛連接到什麼外部服務?**
- 這個外掛連接到 Last.fm API（https://ws.audioscrobbler.com/2.0/），以檢索您的公共聆聽歷史並在 WordPress 網站上顯示。
- **哪些數據會被發送?**
- 您的 Last.fm 用戶名
- 您的 Last.fm API 金鑰
- 要檢索的曲目數量
- **數據何時被發送?**
- 當「目前播放」或「最近播放」區塊在頁面上顯示時。
- 數據被本地緩存以最小化 API 請求（目前播放為 1 分鐘，最近播放為 5 分鐘）。
- **這個服務的提供者是誰?**
- 這項服務由 Last.fm Ltd. 提供。
- **身為網站訪客，有哪些個人數據會被收集或發送?**
- 不會從您的網站訪客那裡收集或發送任何個人數據給 Last.fm。只有您配置的 Last.fm 用戶名和 API 金鑰被傳遞來檢索您的公共聆聽數據。
- **這個外掛如何進行 CSS 定制?**
- 這個外掛使用 CSS 自定義屬性（CSS 變數）進行簡單的主題設計。將這些添加到您的主題 CSS 中以覆蓋默認值。
- **有關需求，需要什麼來使用這個外掛?**
- WordPress 6.0 或更高版本
- PHP 7.4 或更高版本
- 一個 Last.fm 帳戶（免費）
- 一個 Last.fm API 金鑰（免費，在 last.fm/api 領取）
外掛標籤
開發者團隊
原文外掛簡介
Scrobbled Blocks brings your Last.fm listening history to your WordPress site using native Gutenberg blocks. Whether you’re a music blogger, podcaster, DJ, or just want to share your musical tastes with your audience, this plugin makes it simple.
Two Powerful Blocks
Now Playing Block
Display the track you’re currently listening to, or the most recent track you’ve played. Perfect for sidebars, footers, or anywhere you want to show off your current musical mood.
Recently Played Block
Show a list or grid of your recent scrobbles. Configurable from 1-20 tracks, with flexible layout options to match your site’s design.
Key Features
Live Editor Preview – See your actual Last.fm data while editing in Gutenberg
Flexible Layouts – Choose between list and grid views for the Recently Played block
Customisable Display – Toggle artwork, timestamps, and Last.fm links on or off
Smart Caching – Minimises API calls while keeping data fresh (1 min for Now Playing, 5 min for Recently Played)
Graceful Degradation – If the API is unavailable, cached data is served; if no cache exists, blocks simply don’t render
Theme-Friendly Styling – Uses CSS custom properties so you can easily match your theme
Responsive Design – Looks great on all screen sizes
Custom Placeholder – Upload your own placeholder image for tracks without artwork
External Services
This plugin connects to the Last.fm API (https://ws.audioscrobbler.com/2.0/) to retrieve your public listening history and display it on your WordPress site.
What the service is used for:
This plugin uses the Last.fm API to fetch your recent scrobbles (listening history) so they can be displayed on your WordPress site using the Now Playing and Recently Played blocks.
What data is sent:
Your Last.fm username
Your Last.fm API key
The number of tracks to retrieve
When data is sent:
When the Now Playing or Recently Played blocks are displayed on a page
Data is cached locally to minimise API requests (1 minute for Now Playing, 5 minutes for Recently Played)
Service provider:
This service is provided by Last.fm Ltd.
Last.fm Terms of Service
Last.fm Privacy Policy
No personal data from your site visitors is collected or sent to Last.fm. Only your configured Last.fm username and API key are transmitted to retrieve your public listening data.
CSS Customisation
The plugin uses CSS custom properties (CSS variables) for easy theming. Add these to your theme’s CSS to override the defaults:
:root {
/* Artwork sizes */
--scrobble-artwork-size: 64px;
--scrobble-artwork-size-grid: 100%;
/* Spacing */
--scrobble-gap: 1rem;
/* Typography */
--scrobble-font-size-track: inherit;
--scrobble-font-size-artist: 0.875em;
--scrobble-font-size-timestamp: 0.75em;
/* Colours */
--scrobble-color-text: inherit;
--scrobble-color-text-secondary: inherit;
--scrobble-color-link: inherit;
}
Example: Larger Artwork
:root {
--scrobble-artwork-size: 100px;
}
Example: Custom Colours
:root {
--scrobble-color-text: #333;
--scrobble-color-text-secondary: #666;
--scrobble-color-link: #1db954;
}
Additional Notes
Requirements
WordPress 6.0 or higher
PHP 7.4 or higher
A Last.fm account (free)
A Last.fm API key (free, get one at last.fm/api)
Source Code
This plugin uses build tools to compile JavaScript for the block editor. The compiled files are located in the build/ directory.
The original, human-readable source code is available in the src/ directory and on GitHub:
https://github.com/jordesign/scrobbled-blocks
To build from source:
Clone the repository
Run npm install to install dependencies
Run npm run build to compile the blocks
Support
For bug reports and feature requests, please visit the GitHub repository.
Contributing
Contributions are welcome! Please see the GitHub repository for development guidelines.
