WP audio playerをhtml5で再生させる方法と、1つの問題点

記事内に商品プロモーションを含む場合があります

英語リスニング無料学習館の音声再生用に、WPのプラグインの「Audio Playerと」いうのを採用しています。基本、満足しているのですが1つ問題がありまして、Flashで再生されるので、Flashをサポートしてないブラウザの場合再生されないという問題があります。まあ、だいぶ昔に採用しましたし、しょうがないといえばしょうがないのですが。

ということで、現状はwordpressのプラグイン「Audio Player 」をiPhoneではHTML5で動作させるの記事で紹介されているように、一部コードを改変して使用しております。こうすることで、Flash再生が不可能なブラウザの場合、html5で表示することができます。

満足して使ってたのですが、1個問題が見つかってしまいました。

目次

WP audio playerをhtml5に置き換える時に発生した1つの問題

ループ再生がうまく置き換わってないということです。英語リスニング無料学習館では、音声を何回も聞けるようにループ再生を用意しているのですが、こちらがhtml5に置き換わった時にループ再生ではなくただの1回再生になってしまうという問題がおきてることに気づきました。

置き換えるコードにloop属性を入れてみると、ループ再生されるのですが、今度は1回再生ができなくなるので、それもダメそうです。

プラグインを使用する時は、下記のショートコードを書くことになってますので、ここでloop=yesが付いていた場合はループ、なかった場合は1回再生というように出し分けるコードにさらに変更する必要があるのだと思いますが、自分ではできそうにないです笑。

[audio:3-2.mp3] 通常再生
[audio:3-2.mp3|loop=yes] ループ再生

ググっても、該当する記事見当たらないので困っています。古いブラウザを捨てて、全部html5のコードに置き換えれば万事OKではあるのですが、全問題数で500問は超えていると思うので、ちょっと腰が重いんですよね。さて、どうしましょうかねえ。

あわせて読みたい
WordPressの投稿の中で使ったショートコードを一括置換する方法 運営しているサイトで、Wordpressの投稿の中で使っているショートコードを一括置換することになったので、手順を備忘録として残しておきます。 ショートコードを一括置...

*追記:ショートコードを一括書き換えするというアイデアで解決しました。

よかったらシェアしてね!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

198※世代。メーカー技術者です。 TOEIC900、中国語検定3級、韓国語初級。雑多に色々と書いています。

コメント

コメントする

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

目次