ノーコード情報満載!

  1. ノーコード
  2. 70 view

Sheet2Siteの使い方を日本語で解説!基本操作の流れをマスター

さまざまなノーコード開発ツールが リリース されていますが、 Googleスプレッドシート を編集して Webサイト を開発できる特徴的なツールがsheet2siteです。こちらでは、sheet2siteの使い方についてお話しします。

sheet2siteのアカウント作成

sheet2siteのトップページ
画像:www.sheet2site.com

Sheet2siteを利用する場合、まずアカウントを作成する必要があります。

Sheet2siteには無料プランがないため、最初からコストが発生します。ホームページで提供されているのは、月額29ドルの「BASIC」と月額49ドルの「PREMIUM」の2種類です。それぞれのプランの説明ボックスに記載されている「GET STARTED」をクリックするとメールアドレスの入力画面に遷移し、アカウント作成の手続きが始まります。

いずれのプランにも30日間の返金保証があるため、実質30日間は体験版として利用可能です。「PREMIUM」では、チャット機能や JavaScript / CSS スタイルが搭載されていますが、一通りの開発は「BASIC」でも十分に可能と考えられます。

画面の見方

Sheet2siteでは、既存のテンプレートから編集を加えてWebページを構築する手法が基本です。

サービスサイトには、目的に応じた数多くのテンプレートが公開されています。

Sheet2siteは Googleスプレッドシート からWebページを構築するノーコード開発ツールであり、パラメータの変更はGoogleスプレッドシートから行います。Googleスプレッドシートは、Googleが提供している表計算のサービスであり、画面構成は一般的な表計算ツールであるExcelと大きな違いはありません。開発中は、主にこのGoogleスプレッドシートの画面を見ながら作業をしていくことになります。

基本的なWebサイトの開発方法

上述したとおり、shee2siteはテンプレートを編集して Webサイト を作るサービスです。以下に一般的なグリッドレイアウトのサイトを作る手順をご紹介します。

テンプレートのコピー

まずは、任意のテンプレートを選択し、コピーしてください。グリッドレイアウトのテンプレートは、以下のようなシートで構成されています。

  • Content
  • main-page
  • filters
  • update/Help

各シートの内容に編集を加えて、サイトを構築します。

Content

Contentのシートで変更できるのは、グリッド部分の情報です。以下のような項目を編集します。

  • Title(タイトル)
  • Description(ディスクリプション)
  • Link(ページリンク)
  • Image(背景画像)
  • Small text-1(左上に配置するテキスト)
  • Small text-2(右下に配置するテキスト)
  • Filtering by this(フィルタ用)

Main-page

Main-pageはサイトの全体的な情報を設定するシートです。以下のような情報を編集できます。

  • Title( Webサイト のタイトル)
  • Description(ディスクリプション)
  • Background image link(背景画像)
  • Card-width(グリッド幅)
  • Card-height(グリッド高)

filters

filtersは、フィルタを登録するシートです。Contentsシートで編集した「Filtering by this」に書いたものでフィルタリングが可能になります。

リンクの登録

編集したスプレッドシートのリンクを、サービスサイト下部の「Make your website for Free」に表示される「Paste it here」に貼り付けます。

公開設定

スプレッドシートに戻り、「ファイル」タブから「ウェブに公開」→「公開」を選択します。

Webサイト生成

スプレッドシートのリンクをペーストしたページに戻り、「Generate」をクリックすると、編集したスプレッドシートに基づいて Webサイト が生成されます。

Sheet2siteでの開発事例

Sheet2siteでのWebサイト開発事例をご紹介します。

求人情報掲示板

サンフランシスコの求人情報掲示板「MY JOB IN SF」は、sheet2siteで開発されました。シンプルな構造ながら、条件に応じた絞り込み機能、キーワード検索などの機能を過不足なく盛り込んでいます。

ITコミュニティサイト

フランス産のITコミュニティサイト「TechCommunities.fr」は、sheet2siteで開発されました。 スタートアップ や性別といった条件でコミュニティをフィルタリングできます。このように、sheet2siteはコミュニティサービスでの導入例が目立ちます。

Sheet2site事例集

公式ホームページの事例集ページ自体がsheet2site作成されているのが特徴です。当然ながら、紹介されている事例も、実際の Webサイト 開発で役立つものばかりです。

まとめ

Sheet2siteは英語版しかなく、資料も英語中心であることから少しハードルが高いノーコード開発ツールかもしれません。しかし、テンプレートの多さや公式ページで事例を公表している点は大きな魅力です。使い方さえ理解すれば、開発の幅は無限に広がります。

ノーコードの最近記事

  1. Autifyの概要からテスト自動化への導入事例までを徹底解説

  2. Platioはノーコードで作成できる便利な業務アプリ!機能や特徴を解説

  3. UNIFINITYで業務効率アップ!使い方とメリットやデメリット

  4. WebアプリとWebシステムの開発に役立つ!FastAPPの概要

  5. STORESの使い方を解説!初心者でも分かる基本や応用のまとめ

関連記事

PAGE TOP