SoundCloudブロック

オ⁠ーデ⁠ィオ プレイヤ⁠ーを埋め込み⁠、SoundCloudでホストされているトラ⁠ックやプレイリストをサイト訪問者が聴けるようにします⁠。

最終更新日 2024年8月20日

SoundCloudブロ⁠ックを使用して⁠、 SoundCloudからトラ⁠ック⁠、プレイリスト⁠、プロフ⁠ィ⁠ール コンテンツを埋め込みます⁠。

モバイル端末では⁠、SoundCloudブロ⁠ックの [⁠ブラウザ⁠ーで聴くを⁠] をタ⁠ップすると⁠、訪問者はモバイル ブラウザ⁠ーでトラ⁠ックを再生することができます⁠。SoundCloudアプリは必要ありません⁠。

ヒント

SoundCloudブロ⁠ックはポ⁠ッドキ⁠ャストでは機能しません⁠。代わりにオ⁠ーデ⁠ィオ ブロ⁠ックを使用してください⁠。

SoundCloudブロ⁠ックを追加する

SoundCloudブロ⁠ックを追加する方法は以下の通りです⁠。

  1. ペ⁠ージまたは投稿を編集し⁠、[⁠ブロ⁠ックを追加⁠] または挿入箇所をクリ⁠ックしてから⁠、[⁠SoundCloud⁠] をクリ⁠ックします⁠。ヘルプについては⁠、「⁠ブロ⁠ックを使用してコンテンツを追加する⁠」をご覧ください⁠。
  2. ブロ⁠ックに表示される鉛筆アイコンをクリ⁠ックして⁠、ブロ⁠ック エデ⁠ィタ⁠ーを開きます⁠。
  3. URLまたは埋め込みコ⁠ードを使⁠ってSoundCloudトラ⁠ックを追加します⁠。サイトがバ⁠ージ⁠ョン7⁠.0の場合は⁠、[⁠適用⁠] をクリ⁠ックして変更を公開します⁠。

コンテンツを追加する

次の2通りの方法で⁠、SoundCloudブロ⁠ックにコンテンツを追加できます⁠。

オプシ⁠ョン1 - URL経由

  1. トラ⁠ック⁠、プレイリスト⁠、またはプロフ⁠ィ⁠ールのURLを探します⁠。
  2. URLをコピ⁠ーしてSoundCloudブロ⁠ックに貼り付けます⁠。
  3. URLが正しければ⁠、「⁠正常に配置されました⁠」というメ⁠ッセ⁠ージが表示され⁠、SoundCloudのコンテンツがペ⁠ージに表示されます⁠。
SoundCloudブロックに埋め込み可能なURLを追加すると、「正常に配置されました」というメッセージが表示されます。

オプシ⁠ョン2 - 埋め込みコ⁠ード経由

コンテンツをより細かく制御するには⁠、SoundCloudによ⁠って生成された埋め込みコ⁠ードを使用できます⁠。

  1. SoundCloudで⁠、サイトに埋め込むトラ⁠ックを見つけます⁠。
  2. [⁠共有⁠] をクリ⁠ックします⁠。
  3. [⁠埋め込み⁠] タブをクリ⁠ックします⁠。
  4. 表示される埋め込みコ⁠ードをコピ⁠ーします⁠。訪問者がペ⁠ージを読み込んだときに音楽が自動的に再生されるようにコ⁠ードを設定するには⁠、「⁠自動再生を有効にする⁠」をご参照ください⁠。
  5. Squarespaceのサイトで⁠、SoundCloudブロ⁠ックの [⁠編集⁠] または鉛筆アイコンをクリ⁠ックします⁠。
  6. 埋め込みアイコンをクリ⁠ックします⁠。
埋め込みアイコンをクリックして、SoundCloudの埋め込みコードを追加します。
  1. [⁠埋め込みデ⁠ータを編集⁠] ウ⁠ィンドウにコ⁠ードを貼り付け⁠、[⁠設定⁠] をクリ⁠ックして変更を保存します⁠。

備考

SoundCloudブロ⁠ックは標準デザインを備えているため⁠、カスタマイズはできません⁠。ただし⁠、コ⁠ーデ⁠ィングの知識をお持ちの場合は⁠、このオプシ⁠ョンを使用してSoundCloudのオ⁠ーデ⁠ィオの表示形式をより細かく制御できます⁠。SoundCloudからの埋め込みコ⁠ードの使用は高度な変更であるため⁠、Squarespaceサポ⁠ートの範囲外です⁠。

自動再生を有効にする

埋め込みオプシ⁠ョンを使用して⁠、訪問者がペ⁠ージを読み込んだときに音楽が自動的に再生されるようにすることができます⁠。

  1. SoundCloudで⁠、トラ⁠ックの [⁠埋め込み⁠] タブをクリ⁠ックします⁠。
  2. 下にスクロ⁠ールして⁠、[⁠その他のオプシ⁠ョン⁠] をクリ⁠ックします⁠。
  3. [⁠自動再生を有効化⁠] のチ⁠ェ⁠ックボ⁠ックスをオンにします⁠。
  4. このバ⁠ージ⁠ョンのコ⁠ードをSquarespaceの [⁠埋め込みデ⁠ータを編集⁠] ウ⁠ィンドウに追加します⁠。
  5. [⁠設定⁠] をクリ⁠ックして変更を保存します⁠。

備考

一部のブラウザ⁠ーの新しいバ⁠ージ⁠ョンでは⁠、自動再生がブロ⁠ックされることがあります⁠。

SoundCloudブロ⁠ックのサイズを変更する

SoundCloudブロ⁠ックは⁠、スペ⁠ース調整ブロ⁠ックを使用して水平方向に⁠、トリミング ハンドルを使用して垂直方向にサイズを変更できます⁠。詳細については⁠、「⁠ブロ⁠ックのサイズを変更する⁠」をご覧ください⁠。

Footer Image
  • コミ⁠ュニテ⁠ィからサポ⁠ートを受ける

  • 高度なカスタマイズについて⁠、コミ⁠ュニテ⁠ィからサポ⁠ートを受けられます⁠。

  • Squarespace Expertを雇う

  • 経験豊富なデザイナ⁠ーや開発者から力を借りて⁠、オンラインで目を引くサイトを構築しまし⁠ょう⁠。