無制限で使おうと思うと149ドルもする!ぎゃー。いうことで古田社長にヘルプを出したわけです。(私がFacebookで質問するということは、イコール古田社長に聞くということなのだ)◆MP3-jPlayer◆で。最初にリンクしたFacebookの投稿で、古田社長が実際にご自分のブログ記事で使っているのはコレだよ、と教えてくれたのがMP3-jPlayerです。この記事の内容がマニアックすぎて惹くわ~。(引くわーじゃなくて惹くわー)余計なもの読ませやがって!マイク買いたくなるじゃんかよ。いうことでMP3-jPlayerをまるっとマネッコして導入してみました。曲のタイトルのテキストの上でプレーヤーが動作するってのがいいよね。タイトルとプレーヤーの2段にならず、高さの節約になってすんごいスッキリ。プレーヤーとして動作してないときは再生ボタンとタイトルだけの表示になって本当にスッキリ。同じページ内に複数配置してて、再生中に別の音源を再生すると、最初のは自動で止まるのもすごくスッキリ。同時に別の音源が再生されるとイラっと来るよね~。プラグイン公式サイトからダウンロードして解凍して使うのでもいいんだけど。簡単なのはWordPressの管理ページ内でインストールしちゃうこと。その方がローカルにゴミファイルが残らなくて良い良い。1左側のメニューから[プラグイン]項目2右のメイン画面から[新規追加]3検索窓で[MP3-jPlayer]を入力&検索4ヒットしたら[今すぐインストール]で、インストールすると管理画面の左のメニュー項目に[MP3-jPlayer]が追加されますので、そこからプレーヤーの見た目や機能などの設定ができます。私の場合は設定変更したところはわずかです。Players(single-file)]の[FontSize]を18から16に変更。Scheme]で色を黒から緑にしました。他にもこの画面で細かい設定がいろいろできるようなのですが、私のイメージではほぼデフォルトの状態で大丈夫だったので、他の設定はよくわからんとです。あとは記事に書くときの音源ファイルへのリンクを張るショートコードの書き方でいろいろな設定ができます。詳しくはここ↓にサンプルがたくさんあるので参考にしてください。今回はレスポンシブのためにページを作っているので、パソコンとiPhoneの両方で美しく見えるレイアウトにしたいというのが譲れないポイントです。(Androidはチェックしてないわ~。そのうちするわ~)実験でアップしながら最適な文字数などを探っていきました。結果、タイトル&全角スペースを合計15文字にし、そのあとにCaptionで音源の長さ(2:45とか)を入れるということになりました。これでプレーヤーが起動したときにiPhone7でちょうど横幅がぴったりになります。(iPhone5Sだとちょっぴりはみ出しちゃうのだけど、わずかなのと動作に支障がないので良しとしました。)私がこのページで使っているショートコードはこんな感じ。[crayon-5e4b8bb7ba143200202578/]曲の長さの分数をタイトル内に含ませず、Captionで表示させたのはそうするとフォントサイズが小さくなるからです。このプラグインには全体の長さを表示させるオプションはどうもない模様。それだけはちょっと不便ね。実際のプレーヤー動作はこうなります。異なる端末やブラウザで見てみると、どういう動作をするかがよくわかるかと思います。パソコンでのスクショこのスクショはWindows7のIEですが、Chromeも見た目はほぼ同じです。こちらはiPhoneiPhone7です。再生させるとプレーヤーが横幅ぴったりになります。captionの全体分数の横に、現在再生中の分数が出るようになるので、すごくわかりやすい。プレーヤーの中にタイトルも見えるので目が疲れない。「タイトル名+全角スペース」で合計15文字でこのレイアウトになります。タイトルが長い曲だとこの制限を超えてしまうことがあるのですが、まあそれはしょうがないかなと思います。スマホのページの横幅をタイトルの長さが超えると、その曲を聴いているときだけページの表示がごく若干崩れますが、再生をやめるとぴしっと戻るのはなかなかの利点です。Player機能もあるので、数曲をまとめてアルバムとして発表したいときなどに一つのプレーヤー内で曲を切り替えながら聴くような表示にもできます。いつかアルバムをリリースして試聴ページとか作ったらそれもやりたーい。音源データのアップロードはWordPress内の[メディアライブラリ]から新規追加で音源データをドラッグすればできるのですが、その方法だとファイルサイズに上限があるらしく、POPSのフルコーラスみたいな長さの曲はアップできませんでした。(追記:これはWordPressの仕様じゃなくてレンタルサーバーごとの設定らしいので、変更可能な場合もあるようです。めんどくさいから私はそのまま。)ですが、自分のサーバー内で音源ファイルはまとまった場所にあった方がいいように思うので、FTPクライアントで[music]などの任意の名前で新規フォルダを作り、そこにまとめてアップして、ショートコードに音源のアドレスを入れるのが一番いいと思います。FTPのアプリ使うので、パッと見はめんどくさいのですが、ファイル管理がしやすくて結局はこの方法が一番楽だと思いますよ。いうことがたった1日頑張ればできちゃうようになったのは、このブログのテーマ「Simplicity」のおかげです。作者のわいひらさん、本当に本当にありがとうございます。古田社長の動画プレーヤーiPhoneアプリだいぶ使いやすいのでぜひ。わたしめっちゃ使ってる。不具合があったら必ず修正してくれる。FURUTA☆価格は記事執筆当時のものです。いうわけでわたしが愛をこめて歌った音源のページ、ぜひ見てね~。タダだし!もし気に入ったらCD買ってね~。ウィジェットお読みいただきありがとうございます。コメント書込み・Tweet・はてブなどしていただくと励みになります。プライベートな短い日記・つぶやきはfacebookで書いてます。昨年は妊娠中に行った最後の大きなライブで、お客様もたっくさん来ていただいた思い出深いライブです。新宿区の施設「コズミックセン...記事を読む2016年も暮れますが、テレビドラマの劇中音楽で歌ったのでお知らせします。本年最後にお目にかかれるお仕事として、テレビ朝日のドラマのサントラで歌うというのをやらせていただきました。現在、ネット配信中ですので、ご覧いただきたくリンク張らせていただきます。2016年...記事を読む【お誘い】キッズダンスサークル&【御礼】コズミックセンターライブ終了!4歳半の女児のママの木村聡子です。肩書きは歌手・声優・ディレクターと現在はなっておりますが、元々はミュージカル女優でもありました。今までの記事はこちら。順番に読んでくださいな。ひとつとっても重要なことを言わなくてはなりません。いうか、も...記事を読む秋田・山形へ歌を歌いに行って来ました。いや、それはどうだろう?12/7~9の3日間で秋田&山形の障害者施設3カ所を訪問しました。日本海側ですから、直接的な震災は大きくはありませんでしたが、やはり同じ東北地方ということで関東よりは震災に寄せる関心はより大きい地域です。今回の演奏旅行は...記事を読むiPhone7にSuicaがやってきた!読み取り移行時のトラブルやオートチャージについてのあれやこれや。電動自転車チャイルドシートのレインカバーを悩み抜いて選んだら最強になったよ。コメントをキャンセルメールアドレスが公開されることはありません。*サイト次回のコメントで使用するためブラウザーに自分の名前、メールアドレス、サイトを保存する。me木村聡子と申します。本業は歌手・歌のせんせい・たまに声優とか。→(Profile)2012年9月に長女の瑛海(えいみ)を出産。このブログにもたくさん出てきます。音楽演出オタクが高じてScanSnapアンバサダーに任命されますた。NoteEnchanted主演で吹き替えてます。(12)年間3900円でプライムビデオ見放題!学生なら約半額で見放題。