スポンサーリンク

WordPressにGoogleスプレッドシートを埋め込む

Wordpress

Googleスプレットシートを利用していますが、便利ですよね。スプレットシートをWordpressに埋め込む手順をまとめておきます。

埋め込み方法

スプレットシートの埋め込みは以下の手順の通りで簡単です。

  1. Google スプレッドシートでファイルを開きます。
  2. 上部の [ファイル次に [ウェブに公開] をクリックします。
  3. 表示されたウィンドウで [埋め込む] をクリックします。
  4. [公開] をクリックします。
  5. テキスト ボックス内の HTML をコピーして、サイトやブログに貼り付けます。

埋め込むシートを開き、メニューから[ファイル]①→[ウェブに公開 ]②をクリックします。

 

 

 

 

 

 

[埋め込む]①を選んで[公開]②をクリックします。

 

 

 

 

 

埋め込むURLが払い出されますので、コピーしてブログ等に反映します。

 

 

表示のカスタマイズ

スプレッドシートの一部を表示したり非表示にしたりするには、サイトやブログ上で HTML を編集します。

URLパラメータ

取得したURLにパラメータで表示形式などを指定できます。

  • gid=: シート ID。
  • range=: ウェブに公開されている行と列。A1:B14 などです。
  • widget=: true または false。true の場合、シートタブが下部に表示されます。
  • headers=: true または false。true の場合、行番号と列文字が表示されます。
  • chrome=: true または false。true の場合、タイトルとフッターが表示されます。

 URLパラメータ 例

gid=0&range=a1:e4&widget=false&headers=false&chrome=false

 

スタイル

表示域(幅、高さ)や表示枠が固定なので、そのまま埋め込むと以下の様な表示になります。URLパラメータは指定してます。

スタイル設定 例

style="width: 100%; height: 200px; border: 0;"
↓↓↓↓↓

Excel Online(エクセルオンライン)

Excel Online(エクセルオンライン)についても埋め込みをしてみまたが、Excel Online(エクセルオンライン)の方が扱いやすいですね。

コメント

  1. まさこ より:

    スタイルシートの表示設定、助かりました。
    無事、表示できたのですが、
    ホームページに張り付けたときに、
    背景を透過することは可能でしょうか。
    可能であれば、その方法を教えてください。