自分のサイトに作品を載せる
WordPress のサイトをお持ちなら、プラグインを入れるだけで sonoTracks の作品一覧を 表示できます。作品を追加したり、公開・非公開を切り替えたりすると自動で反映されます。サイト側で登録し直す必要はありません。
過去の版と変更の履歴は GitHub の Releasesにあります。ソースは こちら(GPLv2)。
入れかた
ダウンロードする
上のボタンから zip ファイルを保存します。展開する必要はありません。
WordPress に入れる
管理画面の「プラグイン」→「新規追加」→「プラグインのアップロード」から zip を選び、インストールして有効化します。
自分のページを教える
「設定」→「sonoTracks」を開き、ご自身のプロフィールページのURL (
https://sono-tracks.com/u/○○○)を貼り付けて保存します。 保存すると、その場で見つかった作品の数が表示されます。載せたい場所に書く
投稿や固定ページに
[sonotracks_discography]と書くと、そこに作品一覧が出ます。
書きかた
ショートコードに付けられる指定です。
[sonotracks_discography]- 作品を12件まで、4列で表示します。
[sonotracks_discography limit="8" columns="3"]- 1ページに8件を3列で表示します。1ページの件数は最大24件です。
[sonotracks_discography paged="true"]- ページ送りを付けて、すべての作品を見てもらえるようにします。 1つのページに1つの一覧でお使いください。
[sonotracks_discography slug="○○○"]- 別の方の作品を表示します。レーベルのサイトで所属アーティストを紹介する場合などに お使いください。
見た目を調整する
色や文字はお使いのテーマの見た目を引き継ぎます。そのうえで変えたいところは、「設定」→「sonoTracks」の「見た目」から入力できます(CSS を書く必要はありません)。空欄にした項目は、テーマの見た目のままです。
CSS で書きたい場合は、子テーマの style.css などに次のように書きます。 指定できる項目は下の一覧です(--sonotracks-dg-columns だけは ショートコードの columns から渡るので、設定画面にはありません)。
.sonotracks-dg { --sonotracks-dg-gap: 24px; --sonotracks-dg-radius: 10px; }
一覧ごとに変えたいときは、その一覧を囲む要素に書けば、その中だけに効きます。
| 名前 | 既定値 | 効く先 |
|---|---|---|
--sonotracks-dg-columns | 4 | 列数(ショートコードの columns から渡ります) |
--sonotracks-dg-min | 140px | 1枠の最小幅。これを下回ると折り返します |
--sonotracks-dg-gap | 16px | 作品どうしの間隔 |
--sonotracks-dg-radius | 4px | ジャケットの角丸 |
--sonotracks-dg-ratio | 1 / 1 | ジャケットの縦横比 |
--sonotracks-dg-link-color | inherit | 作品カード全体の文字色 |
--sonotracks-dg-title-color | inherit | 作品名の色 |
--sonotracks-dg-title-weight | bold | 作品名の太さ |
--sonotracks-dg-title-size | 1em | 作品名の大きさ |
--sonotracks-dg-artist-color | inherit | アーティスト名の色 |
--sonotracks-dg-artist-opacity | 0.8 | アーティスト名の薄さ |
--sonotracks-dg-price-color | inherit | 価格の色 |
--sonotracks-dg-meta-size | 0.9em | アーティスト名と価格の大きさ |
--sonotracks-dg-pager-color | inherit | ページ送りの文字色 |
--sonotracks-dg-pager-current | currentColor | 現在ページの下線の色 |
アーティスト名は、既定では色を指定せず薄さで本文との差を付けています。 色を指定する場合は --sonotracks-dg-artist-opacity: 1 にして、色そのもので 差を付けるほうが読みやすくなります(薄い文字は、背景との明暗差が下がります)。
よくあるご質問
- 作品が24件を超えています。全部載せられますか
paged="true"を付けるとページ送りが出て、 何件あっても全部たどれます。1ページに24件までとしているのは、 それ以上を一度に出すと、作品の多い方のページで表示が重くなるためです。- プラグインが新しくなったら、どうすればいいですか
- 何もしなくてかまいません。新しい版が出ると管理画面に「更新があります」と表示され、 そのままワンクリックで更新できます(wordpress.org は経由せず、sonoTracks から 直接お届けします)。
ただし、v1.1.0 以前をお使いの方には、このお知らせが届きません(お知らせの仕組みが v1.2.0 から入ったためです)。お手数ですが、上のボタンから 新しい zip を落として一度だけ入れ直してください。以後は自動でお知らせします。 いまお使いの版は、管理画面の「プラグイン」の一覧で確かめられます。 - 作品を追加したら、いつ反映されますか
- 最大10分です。すぐに反映したいときは、「設定」→「sonoTracks」の 「表示を今すぐ更新する」を押してください。
- sonoTracks が止まったら、サイトの表示はどうなりますか
- 最後に表示できていた内容がそのまま残ります。エラーの文言がサイトに出ることはありません。止まっている間も、待たされるのは 1分に1回だけで、ページが重くなることはありません。
- 作品を非公開にしたら、サイトからも消えますか
- 消えます。sonoTracks が止まっている間に復活することもありません。
- サイトの見た目に合いますか
- 色や文字は指定していないので、お使いのテーマの見た目を引き継ぎます。
- ここに無い部分の見た目を変えたいのですが
- 上の表に無いところは、クラス名を指定して直接 CSS を当てられます (
.sonotracks-dg__titleなど)。クラス名の一覧は、 プラグインに同梱の説明(README)にあります。 - 訪問者の情報が sonoTracks に送られますか
- 作品一覧のデータは、お使いのサイトのサーバー側で取得しています。訪問者のブラウザが 一覧を取りに行くことはありません。ただしジャケット画像だけは sonoTracks から 直接読み込まれますので、その画像を表示するときに訪問者のブラウザから sonoTracks へ通信が発生します(他のサイトの画像を貼ったときと同じで、 それ以外の情報は送られません)。
- WordPress.com でも使えますか
- プラグインを入れられるプラン(ビジネスプラン以上)が必要です。無料プランや 個人向けプランではお使いいただけません。ご自分でお借りしているサーバーに WordPress を入れている場合(WordPress.org 版)は、そのままお使いいただけます。
WordPress をお使いでない方へ
ご自分で組み込まれる場合は、公開APIの説明をご覧ください。
GitHub Pages などの静的サイトに作品一覧を載せたい場合は、利用者の方が公開されているsonotracks-discography-staticが使えます。CSSのクラス名とカスタムプロパティがこのプラグインと互換なので、 見た目の調整のしかたは上と同じです。
こちらは当社の提供ではありません(MITライセンス)。 不具合のご報告や機能のご要望は、配布元へお願いいたします。
動作環境
- WordPress 6.0 以上
- PHP 7.4 以上
- sonoTracks に作品を公開していること
うまくいかないときはお問い合わせください。 お使いの WordPress の版と、設定画面に出ているメッセージをお知らせいただけると助かります。