ワードプレスの記事内にSoundCloudの音楽を埋め込むには?【WPプラグイン】

公開日: : 最終更新日:2015/03/05 WPプラグイン, ワードプレス ,

くつキッチュ!アイコン wordpress くつキッチュスクラップス!内「音楽」検索結果へ

追記:2015-02-23

現在はURLコピペのみで簡単に埋め込み出来ます。

Q:ワードプレスの記事内にSoundCloudの音楽を埋め込むには? A:【WPプラグイン】は不要です 2015年2月27日更新

こちらの記事は、URLコピペ埋め込みで不具合が出た場合の参考程度にご覧くださいませ。
Headphones by flattop341, on Flickr

もくじ

音楽埋め込みならYouTubeやvimeoなどという手もありますが、前々から見た目がクールだなあと思っていたSoundCloudの埋め込みプラグインをブログ立ち上げついでに導入してみました。

音楽埋め込み ワードプレスプラグインSoundCloud shortCode

まずはこちら、フレーム(iframe)での埋め込みです。

フレーム(プラグイン無し)での埋め込み方法

1.任意の楽曲のShare(シェア)ボタンをクリックします。
SoundCloud 埋め込み方法 20140204-kizi_mini

2.Embedタブを選択
SoundCloud 埋め込み方法2 20140204-kizi2_mini

3.埋め込みのタイプ選択します。※上のフレーム埋め込みは右のデザインです。
SoundCloud 埋め込み方法3 20140204-kizi3_mini

4.ちなみにオプションはプレイボタンのカラーが変わるだけでした…;
SoundCloud 埋め込み方法4 20140204-kizi4_mini

ちなみに、一番下のAutomaticPlayはサイトを開くと同時に再生される迷惑な設定なので外しました。

ワードプレスプラグインSoundCloud ShortCodeを使用

AutomaticPlayチェックボックス横『WordPress code』の例はこちら↓なのですが…

※違法にアップロードの音源にご注意ください!

これは、SoundCloud ShortCodeというプラグインを有効にしていないと、こんな感じ
SoundCloud 埋め込み方法 WordPressプラグインSoundCloudshortcodeを有効化していない場合の失敗例
で、コードのままの表示になってしまいます。

プラグインSoundCloud ShortCodeを有効化するときちんと表示されます。

それにしても下部の不気味な空きは何ですかね?
設定画面ではこれといって項目がないようなのですが…
あと、width設定とかしているのですがなんか反映されてません。

SoundCloudの著作権

ここまで来て申し訳ないのですが、SoundCloudの著作権ってどうなってるんでしょうね?

ライフハッカー「SoundCloud」で新しくてフリーな音楽を発掘、共有とあるので、インディースの方の作品発表ってイメージはあるのですが…
シェアに関して言えばYouTubeのVEVO(こちらはインディーズではありませんが)のような規約の明快さ、に欠けるような気がします。

なんというか商用利、改変、著作権なんかの検索がしづらいです…(;一_一)

SoundCloudで商用利用・改変可なフリー音源の探し方
という記事を発見したのですが記事の説明にあった『タブ』もクラッシック版でないと使えませんし、ドロップダウンのCreativeCommonsからリンクしても記事の説明のような検索は出来ないようです。
2010/08/27 記事ですので、仕様が変わっているのだと思いますが…

また別の記事なのですが、SOUNDCLOUDがユーザーに受け入れられた理由とは?※2012年の記事です。

ただ楽曲を配信するだけではなく、そして折角の楽曲を無償でリスナーの手に渡らせてしまうだけでもない。

なるほどプレイリストを見てみると『Download』と『Buy』があります。
どれを無料で聴いてもらって、どれを有料にするのかを作者が選べるわけですね。

そして、インディーレーベルや、個人制作者がダウンロード配信の仕組みを簡単に利用できることにより、一気にチャンスが広がった点。

こちらの記事を読んで、やはりインディーズの売り出しの場としても、大変盛り上がっているというのはわかりました。

楽曲も売り出し中のミュージシャン本人がDownloadをOKしたものなら、そりゃ合法だと思います。
無料で聴いていてハマったら、曲を購入するという流れは個人的に一番好きですので良い物があればどんどんシェアしていきたいとは思うのですが…

もうちょっと著作権関係の表示がわかりやすいといいんですけどね。

今回抜群に安全そうなタイトルの曲『Contest Remix’s – Creative Commons Some Rights Reserved』(笑)を選んだわけですが、タグや表示がどこにあるのかわからずこれでもちょっと不安です。

ヘルプもクラッシクのインターフェイスのキャプチャのままなので…う~んって感じです(;一_一)
もったいない…

お知らせ

というわけで、最後ちょっともやっとなまとめになってしまいましたが…
『ドキ!トラブルだらけのワードプレスブログ立ち上げ大会小ネタメモφ(. .)』二回目でございました。
本日消化出来たのは、本日のもう一つの更新記事と合わせて前回予告した中の2項目のみ;;

  • WordPressウワサのテーマSTINGERのカスタマイズでお世話になっている方々のサイト様のご紹介
  • オススメのフリー素材サイト
  • フリー素材の安全な使い方(著作権系)
  • コード貼り付け、音楽埋め込み等のプラグインの紹介
  • amazonJS「レスポンスをパースできません」エラーの対処法
  • ネットオウルでワードプレスをインストしてもログイン画面が表示されない時の対処法

まーマイペースでやってきますね;

ちなみに、小ネタで一つにまとめていた記事を分けました。
もう一つの記事はこちら↓
ワードプレスの記事内でコード表示をするには?【WPプラグイン】

でっは~(*´∀`*)ノシ

記事がお気に召しましたら投票していただけると嬉しいです♪
ブログランキング・にほんブログ村へにほんブログ村
Share on Tumblr

  • このエントリーをはてなブックマークに追加
  • Share on Tumblr

関連記事

photonヤバイ!と思って切ったら、「EWWW Image Optimizer」line1674のエラーでダブルパンチ!……死ぬかと思った! パクリサイトが、パクラレサイトの画像に直リンして画像を盗用するイメージ

サイトをコピーされた? でも、JETPACKのphotonを有効にしてると、「画像の差し替えの反撃」ができないみたい

   直リンで画像を登用される時の説明画像   登場人物:くつきちよこ 

記事を読む

Tumblrボタン(フォロー、共有)設置方法 記事下設置やプロフィールへの設置、その他シェア方法など イチパン!サンプル

WordPressでTumblrボタンを実装してみた(記事下、サイドバーへの設置、その他シェア方法など)

  Share on Tumblr こちら、昨日作ったくつキッチュの姉妹サイト『イチ

記事を読む

BrowserLabo亡き後、いろんなチェックサービスでシャドウと角丸のCSSチェックをしてみた "Select your web browser(s) by zipckr, on Flickr

ブラウザ表示チェック3大サービスを無料範囲内で試してみたよ♪

 各ブラウザによっての見え方を改めてテストしてみた Select your w

記事を読む

shout! by su neko, on Flickr Wordpressの画像編集に絶望したーっ アイキャッチ画像

WordPress3.9更新後の画像編集画面に絶望したーっ!…ので、よく使うスタイル指定をメモメモ…

なんだか最近Wordpressの画像編集機能が微妙です。 3.9に更新してからというも

記事を読む

html tattoo by webmove, on Flickr

ワードプレスの記事内でコード表示をするには?【WPプラグイン】

html tattoo by webmove, on Flickr もくじ ドキ!トラ

記事を読む

創作ブログに最適な「LINEトーク吹き出しCSS」で、表示が崩れるときの忘備録 カスタマイズサンプルアイキャッチ画像

創作ブログにピッタリな「LINEトーク風フキダシCSS」の表示が崩れるときの忘備録

あけましておめでとうございます。   会話形式の多いブログにピッタ

記事を読む

創作支援屋靴キッチュスクラップス!くつきちよこアイコン木の実モザイクVer  Illust by 佐藤利音 ベジェ化 by くつきちよこ

ランボー 怒りの新規ファイルのアップロードが出来ないWordPressトラブル※未解決 と、電子書籍出版お手伝い裏舞台

Panic stations ! by Craig Sunter - Thanx 2 Milli

記事を読む

サイトの名刺ファビコンテスト前哨戦-ファビコン設置方法-* アイキャッチ画像

動くファビコン、今ならアリ?

最近とんと見かけなくなった気がする動くファビコン… 今ならすごく目立つ気もしますが…実

記事を読む

Spanish dictionary pages up into the air by Horia Varla Wpでページめくり効果が簡単に使えるプラグインFlippingBook Galleryの使い方

1-Wpで電子書籍っぽいページめくり効果が使えるプラグインFlippingBook Galleryの使い方 基本編

  追記:「WordPressの更新後、『FlippingBook Ga

記事を読む

I believe I can fly - I believe I can touch the sky... by Harold Kuiper, on Flickr TOC+を使えば記事内リンクもツーステップで簡単♪ 『wp 文字まで飛ぶようにしたい』で検索されていらしたどなたかへの手紙 

TOC+を使えば同一記事内リンクもツーステップで簡単♪ 『wp 文字まで飛ぶようにしたい』で検索されていらしたどなたかへの手紙 

  秘密の抜け穴 I believe I can fly - I believe I can

記事を読む

Message

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

CAPTCHA


Time limit is exhausted. Please reload CAPTCHA.

  • 創作クラスタ応援し隊のくつきちよこ(崛起智世子)です。 このブログは、「ネット著 作権」、「セルフプロモーション」、「ワードプレス運用」、「電子書籍サービス」、 「自己出版(セルフパブリッシング)」、「創作」等に関する情報をお届けしておりま す。 ※Wiki『創作ステージ@まちペディア』(ちょっと押してますが)作成中です♪
  • follow us in feedly
  • くつキッチュ/スクラップス! on Tumblr

  • 「表現の自由を守る党」自作応援バナー くつきちよこ

  • パソコン工房「CLIP STUDIO PAINT PRO推奨パソコン」エントリーモデル登場