WordPressサイトにSoundCloudプレイリストを埋め込むには?

WordPressは、あなたのサイト上のオーディオやプレイリストを挿入するためのデフォルトのショートコードを提供しています。 これは、自分のサーバー上でいくつかのオーディオファイルをホストする場合に非常に便利です。 しかし、私たちのほとんどは、私たち自身のオーディオを構成するミュージシャンではなく、誰かのオーディオを使用すると、著作権侵害になります。 ここでは、soundcloudのような第三者がオーディオホスティングサービスを提供し、一般ユーザーが合意されたライセンスの下で音楽を共有できるようにします。 また、多数のオーディオファイルがある場合は、サーバーの外部でホストすることをお勧めします。 それはあなたのサイトのページの読み込み速度を向上させるのに役立つだけでなく、より広い聴衆に手を差し伸べるのにも役立ちます。

この記事では、WordPressサイトにsoundcloud playlistを埋め込む方法を説明します。WordPress.com とWordPress.org サイト。

ステップ1–Soundcloudでプレイリストを作成

無料のSoundCloudアカウントにサインアップし、お気に入りの曲でプレイリストを作成します。 以下に示すように、”コレクション>プレイリスト”メニューの下にすべてのプレイリストを表示します:

Soundcloudでプレイリストを表示する

Soundcloudでプレイリストを表示する

ステップ2–プレイリストの埋め込みコードを取得する

WordPressサイトで共有したいプレ プレイリストに追加されたトラックのリストが表示され、”共有”ボタンをクリックします。 また、ここでプレイリストのシャッフルを有効または無効にすることができます。

SoundCloud Playlistを共有する

Soundcloud Playlistを共有する

共有、埋め込み、メッセージの三つのオプションを提供するポップアップ画面が表示されます。 「埋め込み」タブに移動し、表示デザインを選択し、WordPressサイトの埋め込みコードを取得します。

ステップ2.1-埋め込みコードWordPress.com ユーザー

SoundCloudは以下のためにのみサポートされているショートコードを持っていますWordPress.com ユーザー。 あなたのためのショートコードを取得するには、チェックボックス”ワードプレスコード”を選択しますWordPress.com サイト。

WordPressの埋め込みコードの取得

WordPressの埋め込みコードの取得

の埋め込みコードWordPress.com ユーザーは以下のようになります:


画面までスクロールし、”その他のオプション”をクリックして色を変更し、プレイリストの自動再生を有効または無効にします。

自動再生の有効化

自動再生の有効化

プレイリストのプレビューを表示し、”コードとプレビュー”の下のテキストボックスに表示されているコードをコ

ステップ2.2-埋め込みコードWordPress.org ユーザー

あなたが自己ホスト型を持っている場合WordPress.org サイトは、”WordPressのコード”チェックボックスを無効にし、埋め込みコードを取得するようにしてください。 以下に示すように、iframeコードである必要があります:

<iframe width="100%" height="450" scrolling="no" frameborder="no" src="https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/299620824&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true"></iframe>

ステップ3–WordPressにSoundCloud埋め込みコードを挿入する

埋め込みコードを取得したかどうかWordPress.com またはWordPress.org 挿入プロセスは同じで簡単です。 ただ、”テキスト”エディタの下の任意のテキストコンテンツに似たあなたのポストやページに埋め込みコードを貼り付けます。 オーディオプレーヤーを見るには、サイトを公開する必要がありますWordPress.com “ビジュアル”エディタに切り替えながらサイトには、オーディオプレーヤーが表示されますWordPress.org サイト。 以下は、soundcloud playerの実際の例ですWordPress.org サイト。

幅、高さとプレーヤーの自動再生プロパティは、直接埋め込みコード内で変更することができます。 また、”visual=true”パラメータを追加することで、プレイヤーの外観を変更することもできます。 たとえば、上記のデフォルトプレーヤーは、指定されたコードを使用して以下のように変更できます:

<iframe width=”100%”height=”300″scrolling=”no”frameborder=”yes”src=”https://w.soundcloud.com/player/?url=https%3A//api.soundcloud.com/playlists/299620824&amp;color=ff5500&amp;auto_play=false&amp;hide_related=false&amp;show_comments=true&amp;show_user=true&amp;show_reposts=false&amp;visual=true”></iframe>

あなたは、”テキスト”ウィジェットを使用してコードを貼り付けることにより、サイドバーとフッターウィジェット領域にプレーヤーを追加することができます。

WordPressで共有URLを挿入する

共有URLを使用してオーディオプレーヤーを挿入することも可能です。 「共有」ボタンをクリックすると、「共有」タブの下のURLをコピーしてWordPressの「ビジュアル」エディタに貼り付けるだけです。

SoundCloud共有URLコード

SoundCloud共有URLコード

enterキーを押して、WordPressがそのURLを以下のようなプレイリストに自動的に変換していることを確認します。

覚えておくべきポイント

  • SoundCloudは、個々のオーディオトラック、プレイリスト、WordPressサイト上のアカウントプロファイルを共有することができます。
  • URL共有メソッドと埋め込みコードメソッドの両方を使用できます。
  • 共有URLメソッドは、幅広いプロフィール画像で独自のプレイリストを共有するのに適しています。 埋め込みコードは、他のオーディオファイルを再生するために推奨されます。
  • 共有URLは”ビジュアル”エディタに貼り付ける必要があり、プレイヤーはエディタで見ることができます。
  • comサイトは”ビジュアル”エディタに貼り付ける必要があり、オーディオプレーヤーは公開されたサイトでのみ表示されます。
  • WordPress.org サイトは”テキスト”エディタに貼り付ける必要があり、プレイヤーはエディタで見ることができます。
  • WordPress.com SoundCloudのショートコードをサポートしていますが、WordPress.org しません。 だから、あなたのオーディオプレーヤーのための正しい埋め込みコードを取得するようにしてください。
  • 埋め込みコードのデフォルトパラメータを変更することで、プレイヤーをカスタマイズできます。 ただし、共有URLを介して挿入されたプレーヤーはカスタマイズできません。
  • orgには、soundcloudのショートコードを作成し、プレイリストを埋め込むための多くの無料のプラグインがあります。

Write a Comment

メールアドレスが公開されることはありません。