Googleスプレッドシートは便利な表ツールですが、ブログやWebサイトに貼り付けるとき、「表の一部だけを見せたい」「表示する行・列を絞りたい」というケースもあります。
この記事では、スプレッドシートの一部分だけをiframeでブログに埋め込む方法を紹介します。
見本
前提：表示範囲と公開範囲は別に考える
先に「ウェブに公開」でファイルを公開し、そのうえで埋め込みコードの表示範囲を絞ります。
公開する範囲と、記事で見せる範囲は別の設定です。
手順（通常の流れ）
ファイル→共有→ウェブに公開- 表示形式：
埋め込む - 表示したいシートを選択
- 表示される
<iframe>コードをコピー
公開設定ではファイル全体か対象シートを選びます。
rangeは埋め込みの表示を絞る指定で、範囲外のデータへのアクセスを制限する設定ではありません。
非公開データを含む表を公開し、rangeだけで隠す運用は避けてください。
公開用の別ファイルへ、見せてよいデータだけを用意すると管理しやすくなります。
特定の範囲だけを埋め込む方法
以下のようにiframeコードに range パラメータを追加すれば、指定範囲のみ表示できます。
例：A1〜N13の範囲を表示
<iframe title="公開スプレッドシートの指定範囲 A1:N13" src="https://docs.google.com/spreadsheets/d/1wZtnlYqkMsoLr9ykiHo5PFf0t36jr4OYr8BQZcq1uNA/pubhtml?gid=1673223265&single=true&widget=true&headers=false&range=A1%3AN13" width="570" height="330" style="max-width:100%;border:0;" loading="lazy"></iframe>主要パラメータの解説
| パラメータ | 意味・効果 |
|---|---|
single=true | 指定シートを単独で表示する指定（公開権限は変更しない） |
widget=true | シートタブの表示指定。trueで表示 |
headers=false | 行列番号（A,1など）を非表示 |
range=A1%3AN13 | 表示したい範囲（A1:N13）をURLエンコードで指定 |
iframeタグに width や height を追加して表示サイズを自由に変更可能です。
見本
記事冒頭に表示
注意点：閲覧権限と公開範囲
- ウェブ公開の閲覧対象はアカウントや組織設定にも依存します。個人情報や機密情報は公開用データへ含めないでください。
- 通常の共有設定と「ウェブに公開」は別に確認します。埋め込みを記事から削除しただけでは、公開URLの公開停止にはなりません。
WordPressへの貼り付けと戻し方
上のコードはこのページの公開見本です。
自分の表を埋め込むときは、Googleが生成した埋め込みコードを元にし、srcはその生成されたURLをそのまま使います（公開用のURLは手で組み立てず、ファイルIDを直接書きません）。
gidも生成されたコードの値のままにします。
追加するパラメータは、既存の「?」を残して「&」でつなぎます。
WordPressの「カスタムHTML」ブロックへ貼り付け、プレビューで確認してください。
PHPのfunctions.phpへは貼りません。
max-width:100%は記事幅からのはみ出しを抑えますが、表の列を自動で折り返す指定ではありません。
スマホでは表の内部を横にスクロールして読めるか確認します。
titleは埋め込み内容を説明する名前へ変更し、heightは必要な高さに調整してください。
表示されない場合は、公開URL・gid・range、Google側の公開状態を確認します。
ログイン中だけ見える状態になっていないかも確認してください。
WordPressの編集権限やセキュリティ設定によりiframeが保存時に除去される場合もあります。
サイトから外すときはカスタムHTMLブロックを削除します。
Google側での公開も止める場合は「ウェブに公開」画面の公開設定から停止します。
ほかの記事にも埋め込んでいる場合は、それらの表示も止まる点を確認してください。
公開設定と各パラメータはGoogle公式の公開・埋め込みヘルプを参照しています。
確認した環境と未確認の点
この記事の見本は公開中のGoogleスプレッドシートを読み込む構成です。
表示はご自身の環境でも確認してください。
iframeの内部をスクロールする操作とキーボードでの移動は確認できていないため、公開前にご自身の環境で試してください。
2026年10月28日に、range・gid・widget・headersをGoogle公式ヘルプで確認しました。
singleは、掲載した埋め込みコードに含まれる指定です。
Google側の仕様変更で表示が変わる場合があります。
表示が合わないときの切り分け
まず、元の公開URLをログインしていない閲覧環境で開きます。
ここで表示されない場合は、WordPressのコードを変える前に公開状態を確認してください。
公開URLは開けるのに記事で消える場合は、保存後もカスタムHTMLにiframeが残っているか確認します。
消えていたら管理者に編集権限を相談し、設定をむやみに弱めないでください。
違うシートが表示される場合は、公開時に選んだシートとgidを照合します。
先に幅や高さを調整しても、対象シートの間違いは解消しません。
範囲が違う場合は、rangeの開始セルと終了セルを確認します。
見本のA1:N13なら、左上A1と右下N13の内容を原表と比べましょう。
一部が切れて見える場合は、表示対象の誤りと枠の小ささを分けて調べます。
PCとスマホで端の列まで読めるか確認してください。
変更前の埋め込みコードを残し、範囲・幅・高さを1項目ずつ変えます。
うまくいかなければ元のコードに戻して比較します。
確認記録には、公開シート名、表示範囲、閲覧端末、確認日を残します。
非公開の表を試験用に公開する必要はありません。
まとめ
- iframeでスプレッドシートを貼るときは、range指定で見せる範囲を絞れる
- rangeは表示を絞る指定で、範囲外のデータへのアクセス制限ではない
- 表示サイズは
width/heightで調整し、スマホでは表の内部を横スクロールして読む
表をHTMLとして貼りたい場合はExcelの表をHTMLのテーブルに変換する方法、ほかの使い方はWordPressの使い方まとめから探せます。
