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. JUMBLE

    JavaScript

    テキストの色をカラフルにシャッフルさせるjQueryプラグイン「JUMBLE」

    JUMBLEというjQueryプラグインを使えば、指定したテキストの色…

  2. no-image
  3. Ion Zoom

    JavaScript

    シンプルで美しいLightbox系のjQueryプラグイン「Ion Zoom」

    シンプルで美しいLightbox系のjQueryプラグイン「Ion Z…

  4. multi-list

    JavaScript

    複数の選択可能なリストにするためのjQueryプラグイン「multi-list」

    multi-listは、順序付けされていないリストを複数の選択可能なリ…

  5. no-image

    JavaScript

    スライドアニメーションによる多階層なハンバーガーメニュー「ggContentMenu」

    ggContentMenuはスライドアニメーションを備えた多階層に最適…

  6. Bar Indicator

    JavaScript

    数値をインジケーターで見やすく表示できる「Bar Indicator」

    Bar Indicatorは数値をインジケーターで表示させることができ…

最近の記事

  1. EH-NA0B
  2. KPS-88
  3. Happy Plugs AIR1
  4. cheero Stream 10000mAh
  5. BOSE HOME SPEAKER 300

アーカイブ

PAGE TOP