GoogleSheets-HTMLImporter

JavaScript

Googleスプレッドシートからデータをインポートできる「GoogleSheets-HTMLImporter」

GoogleSheets-HTMLImporterは、GoogleスプレッドシートからデータをインポートできるjQueryプラグインです。GoogleスプレッドシートとはGoogleが提供するサービスで、Excelと同様に表計算やグラフの作成を行えるツールです。複数人と共同でファイルの作成・編集ができ、オンラインで作業が可能です。このGoogleスプレッドシートをサイトへインポートできるプラグインのご紹介です。

GoogleSheets-HTMLImporter

デモ

本来、サイトへデータや表を表示させる場合、<table>タグを使用する方法が主流です。しかし、<table>タグを使用されたことがある方はご存知かと思いますが、意外と面倒な作業です。データの量が多く複雑になる程、表のどの部分がどのようにサイトへ反映されるのかを想定しながらマークアップするので、ややこしく混乱してしまうこともあります。

そんな時は、本プラグインを使用すればGoogleスプレッドシートで作成されたデータをそのまま読み込みサイトへ反映することができるので、効率よくサイト構築を進めることができると思います。

本プラグインの導入方法は以下の手順になります。

< script  src = " http://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js " > </ script >
< script  src = " dist / jquery.gsImport.min.js " > </ script >
< div  class = " gsImport "
		 data-key = " Google-Sheets-Key "
		データインデックス = "シート番号"
		 data-headers = " String、of、Headers " >
	</ div >
< script > 
$(" .gsImport ")。gsImport(); 
</ script >	

以上のような手順で導入は完了です。ぜひご活用ください。特に大量なデータや更新が頻繁に必要なデータをお持ちの方へおすすめです。

GoogleSheets-HTMLImporter

関連記事

  1. slideSpeed

    JavaScript

    スライドアップ・ダウンを設定された速度で制御できる「slideSpeed」

    slideSpeedは、特定の要素のスライドアップ・スライドダウンを設…

  2. SWAPMYLI

    JavaScript

    スライドが切り替わるタイミングも分かりやすく表示させるギャラリーを実装できるjQueryプラグイン「…

    シンプルでよさそうだったのでメモしときます。スライドが切り替わるタイミ…

  3. no-image
  4. no-image

    JavaScript

    シンプルで美しい軽量のjQueryモーダルウィンドウ「umodal」

    umodalはスッキリしたシンプルで美しいモーダルウィンドウを実装でき…

  5. Bricks.js

    JavaScript

    超高速なMasonryレイアウトを実装できる「Bricks.js」

    Bricks.jsは、固定した幅で配置する画像などの要素をすばやく配置…

  6. KGallery

    JavaScript

    縦や横に配置されたサムネイルから画像を選択できるjQueryの画像ギャラリー「KGallery」

    縦や横に配置されたサムネイルから画像を選択することができるjQuery…

最近の記事

  1. ACC-TRBX
  2. ピスタチオ クリスマス ツリー フラペチーノ
  3. SF-G64T
  4. USB Type-C搭載ドッキングステーション

Facebookページ

PAGE TOP