Softr で Google スプレッドシートの AI ツールを使用してディレクトリ ウェブサイトを作成しましょう – 簡単で無料です! 💯

この記事では、ノーコードWeb構築プラットフォームであるSoftrを使って、シンプルで実用的なAIツールディレクトリWebサイトを作成する方法を説明します。AIツールを分類・検索するためのWebサイトを作成したいという初心者の方に最適で、短期間で無料で始めることができます。
ディレクトリSoftr
目次 見せる

AIツールを含む様々なツールを収集・分類するウェブサイトディレクトリをSoftrプラットフォームを用いて構築します。Softrは、コードを一切書かずにドラッグ&ドロップ操作だけで簡単にウェブサイトを構築できるノーコードシステムです。ツール一覧をディレクトリ形式で表示するウェブサイトを構築したい初心者にとって最適で、AIツールの検索、比較、選定を容易にします。さらに、アフィリエイトプログラム、広告、ウェブサイトへの掲載などを通じて収益を得ることも可能です。SoftrはGoogleスプレッドシート、Airtable、SQLなどの様々なデータベースにも接続し、ウェブ上で効率的にデータを表示します。

ディレクトリ、AIツールとは何ですか?❓
人工知能 (AI) を活用するツールと Web サイトの中央ディレクトリ (またはカタログ)。ユーザーが AI ツールを簡単に検索、比較、選択できるようにするための「ディレクトリ/データベース」のような役割を果たします。

利点

ユーザーが簡単にアクセスできる AI ツールのリポジトリです。
ウェブサイトの訪問者数とトラフィックを継続的に増加させます。
AI エキスパートとしての信頼性とイメージを構築します。
コミュニティや専門プラットフォームへとさらに発展させることもできます。

収入を生み出す

アフィリエイト収益は、ユーザーがリンクを通じてサインアップまたは購入したときに発生します。
ウェブサイト上の広告スペースまたはバナーを販売します。
AI ツール所有者からプロモーション料金や注目のリストを受け取ります。
AdSense など、ウェブサイトに広告を掲載して収入を得ます。

Softrまたは ソフトリオ それは何ですか?

Softr(またはsoftr.io)は Web サイトおよび Web アプリケーションを構築するためのプラットフォーム。 ノーコード これにより、Web サイト、ポータル、メンバーシップ システム、ディレクトリ、ビジネス アプリなどを作成できます。 コードを書かずに。 ドラッグ アンド ドロップ システムを使用して、Airtable、SQL、Hubspot、Google Sheets、Supabase、BigQuery などのデータベースに接続し、必要なデータを Web 上で簡単に表示できます。

ロゴコンテナ

Softr プランの価格比較。

24 12 2025 13 46 07 ペイントのスクリーンショット
6864e900cd7036a463c36c74 343b37c1fef200e723f67b448e13d427 ポータル

ポータルと作業ツールを作成します。

Softr を使用すると、ユーザーはコードを記述せずにカスタム顧客ポータルを作成し、ユーザーフレンドリーなインターフェースを使用してさまざまなデータ ソースに接続することで、顧客データをリアルタイムで収集および管理できます。

美しいビジネス アプリケーションを作成します。

顧客ポータル、社内ツール、ダッシュボードなどの既成ソフトウェアでは、既存のデータを使用することで、ドラッグ アンド ドロップによるレイアウト、ユーザー ビュー、ロジックの簡単なカスタマイズが可能です。

学生ポータル
684faf5b92aee99a5eab0fae 会社イントラネットデータベースサムネイル

自己完結型データベース

使いやすいリレーショナルデータベースでビジネスデータを管理し、アプリケーションやワークフローの強化に活用できます。複雑な設定は不要で、スプレッドシートや他のツールからデータを瞬時にインポートできます。

自動化されたワークフロー

単純なタスクから多段階のワークフローまで、あらゆるものを自動化できます。トリガー、アクション、ロジックを備えた可視化ツールを活用して、ビジネスプロセスを自動化しましょう。

68f29e93f2e92bdcbf3acb4a 3cd7d0d8ab9d847881196644ca193fa7 特典Webhook p 800
6882474b4864601d98fb5d21 特典3 p 1080

内蔵AIシステム

AIを活用してアプリケーション情報をリアルタイムで照会できます。AIエージェントを活用してデータに付加価値を加え、ワークフローを自動化できます。さらに、AIコビルダーを活用して開発を迅速化できます。

テンプレート(既成テンプレート)

クローン作成には、完全にカスタマイズ可能で使いやすいビジネス アプリ テンプレートが多数用意されています。また、初心者に適したユーザー フレンドリーなパズル ピースを使用して独自のテンプレートを作成することもできます。

24 12 2025 1 46 10 ペイントのスクリーンショット

無料のディレクトリウェブサイトをステップバイステップで作成しましょう💯

1

登録方法 ソフトリオ

ウェブサイトにアクセスしてください。 ソフトリオ

ソフトリオ
1ページ目
3ページ
4ページ
5ページ
6ページ
7ページ
1ページ目
3ページ
4ページ
5ページ
6ページ
7ページ
2

Google スプレッドシートを使用してデータベースを準備します。

Softr は次のデータベースを使用できます。

外部データベース/データ ソース — Airtable、Google Sheets、Notion、Coda、monday.com、HubSpot、ClickUp、Supabase、SQL データベース (PostgreSQL/MySQL/SQL Server/MariaDB)、BigQuery などの他のソースから、直接接続または API を介してデータを取得できます。

Google スプレッドシートを使用する理由は何ですか?

SoftrでGoogleスプレッドシートをデータベースとして使用すると、シンプルですぐにアクセスできるという利点があります。Googleスプレッドシートはクラウドベースなので、インターネット接続があればどこからでも閲覧・編集でき、スプレッドシートを編集するとデータがリアルタイムで更新されます。そのため、大規模なデータベース設定や独自のサーバーは不要です。また、チームでの共同作業を容易にし、既存のGoogleアカウントを使用して閲覧・編集権限を簡単に共有できます。Softrに接続すると、複雑なコーディングなしで、ウェブサイトやアプリに実際のデータをすぐに表示できます。

3

無料の CSV ファイルをダウンロードするには、gumroad にアクセスしてください。

へ移動 ガムロード
データを無料でダウンロードしてください。 (「適正価格を指定してください: 0」と入力)
へ移動 (以下の手順に従ってください)ファイル/ファイルのインポート/アップロード
Gumroad から受け取ったファイルをアップロードします。
スプレッドシートに名前を付けます。
無料の CSV データセットをダウンロードしてください。 7ページ 1
メールアドレスを入力してください 6ページ1
ダウンロードボタンをクリックします。 8ページ
「ファイル」メニューに移動し、「インポート」を選択します。 10ページ
「アップロード/参照」へ進みます。 11ページ
データを選択/データをインポート 12ページ
「スプレッドシート」という名前を入力します。 13ページ
7ページ 1
6ページ1
8ページ
10ページ
11ページ
12ページ
13ページ

Google スプレッドシートを設定する際の重要な手順。

注釈付き画像2

重要 **[ファイル] / [共有] / [Web に公開] に移動します。

設定 カンマ区切り値(csv)

フォーラム URL 内の AFF リンクに変更できます。

テキストスレッドでツールの説明を変更できます。

4

最初のアプリを作成しましょう。

「アプリ」に移動し、「新しいアプリの作成」ボタンをクリックします。 注釈付き画像
Google スプレッドシートを接続し、「新しいファイルを追加」ボタンをクリックします。 注釈付き画像4
データ テーブルを選択します。 注釈付き画像3
「続行」をクリックして接続します。 注釈付き画像6
ゴミ箱ボタンをクリックして削除(または新規作成)します。 注釈付き画像7
注釈付き画像
注釈付き画像4
注釈付き画像3
注釈付き画像6
注釈付き画像7
5

基本的なソフト ディレクトリを作成します。

基本情報の入力手順(理解)

すべてのブロックを削除します。ゴミ箱アイコンをクリックします。 注釈付き画像7
クリックして新しいブロックを作成するか、リストを選択します。 4ページ
Google スプレッドシートからデータを接続します。 5ページ
一番下までスクロールすると、行数またはカード数を選択できます。 7ページ
名前と説明を入力してください。 9ページ
注釈付き画像7
4ページ
5ページ
7ページ
9ページ

シートからデータを抽出する簡単な方法。

LogoUrl テーブルから画像を取得します。 注釈付き画像10
Google スプレッドシートからウェブサイト/ツール/列のタイトルを抽出します。 注釈付き画像11
カテゴリ列からカテゴリを取得/色を調整します。 注釈付き画像12
テキスト スレッドからツールの説明を取得します。 注釈付き画像13
ランク列からスコアを取得します。 注釈付き画像14
注釈付き画像10
注釈付き画像11
注釈付き画像12
注釈付き画像13
注釈付き画像14

上下にドラッグすることでお好みに合わせてレイアウトを調整できます。

検索、フィルタリング、クリックカードの設定。

[フィルター] までスクロールし、名前を付けるか空白のままにして、[カテゴリ] を選択します。 注釈付き画像15
「オプション / すべてのタグを削除」まで下にスクロールします。 注釈付き画像16
必要な新しいタグを追加します (一度に 1 つのタグ、またはセミコロンで区切られた複数のタグ)。 注釈付き画像17
ボタンは削除できます (使用しません)。 注釈付き画像18
[アクション] / [クリック時の項目] に移動し、[URL を開く] / [次の形式で開く] / [新しいタブ] を選択します。 注釈付き画像20
注釈付き画像15
注釈付き画像16
注釈付き画像17
注釈付き画像18
注釈付き画像20

複数のタグを挿入します。 (複数のタグをセミコロンで区切って挿入します)

カード テーブルがツール URL にクリック可能であることを確認してください。

*** メニューへ移動 アクション / クリック時のアイテム / URL を開く / 次の場所で開く / 新しいタブを選択

スタイル、フォーマット、テキスト、色を変更します。

タイトルと説明については、「スタイル」/「タイトルとサブタイトル」を参照してください。 注釈付き画像21
検索とタグ付け 注釈付き画像22
スコアの色 / コンテンツ / ランク / ブラシアイコンの変更 注釈付き画像23
テキストを変更します。 注釈付き画像24
カードの名前と説明については、「スタイル」/「アイテム フィールド」/「見出しとテキスト」を参照してください。 注釈付き画像25
カードの枠線の色を変更する – スタイル / 一般 / カード 注釈付き画像26
テーマに移動して、カードのスタイル (見出し、説明、背景色) を変更します。 注釈付き画像27
注釈付き画像21
注釈付き画像22
注釈付き画像23
注釈付き画像24
注釈付き画像25
注釈付き画像26
注釈付き画像27

カードのスタイル、幅、背景色、フォント、および背景全体を変更するには、左側の「テーマ」に移動します。

ヘッダーメニューとサイドバーを追加します。

メニューを追加するには 3 つの方法があります。左側のブロック ボックスをクリックし、右側のレイアウトを選択します。 注釈付き画像28
レイアウト / トップ&サイド 注釈付き画像29
メニュー項目を追加します。「追加」ボタンをクリックします。 注釈付き画像30
美観上の理由から、さまざまなメニュー項目にアイコンを追加できます。 注釈付き画像31
[スタイル] に移動して、サイズ、色、メニュー オプションをカスタマイズします (色については、左側の [テーマ] に移動します)。 注釈付き画像32
注釈付き画像28
注釈付き画像29
注釈付き画像30
注釈付き画像31
注釈付き画像32

3つのメニューオプションから選択できます。

トップ - トップメニュー
サイド – サイドメニュー
トップ&サイド - メニュー(トップディッシュとサイドディッシュ)

メニューの種類

ページ – 既存のページのメニュー。
カテゴリー – カテゴリーメニュー(他のサブメニューを追加)
外部 URL – さまざまなリンクの URL を入力するためのメニュー。

ソフトフッターを追加します。

ページのページ/設定アイコンにフッター メニューを追加します。 注釈付き画像33
フッター/新しいフッターを作成をクリック 注釈付き画像34
フッター ボックスをクリックし、右側でフッター スタイルを選択します (スタイルは 2 つあります)。 注釈付き画像35
下部の URL とソーシャル メディア スライダーをカスタマイズし、スタイルに合わせてサイズを変更します。 注釈付き画像36
注釈付き画像33
注釈付き画像34
注釈付き画像35
注釈付き画像36

FavicoinのSEO最適化:名前と説明

設定メニュー(左)/一般に移動します。 注釈付き画像37
1. 名前 2. ドメインの変更 3. favicoin のアップロード 4. ウェブサイトのアイコンまたはロゴをアップロードして名前を変更します。 注釈付き画像38
「カスタム ドメイン」でカスタム ドメインを追加できます。 注釈付き画像39
Google Search Consoleに接続できます。 注釈付き画像40
各ページのSEO名と説明を設定します: ページ / 設定(歯車アイコン)/ SEO / タイトル / 説明 注釈付き画像41
ログインしなくても誰でも閲覧できるように設定します。 注釈付き画像43
注釈付き画像37
注釈付き画像38
注釈付き画像39
注釈付き画像40
注釈付き画像41
注釈付き画像43

重要なのは、各ページの「ページ」→「設定」(歯車アイコン)→「表示」→「訪問者」に移動して、すべてのユーザーがログインせずに当社の Web サイトにアクセスできるようにする必要があることです。

6

最初のウェブサイトを公開します。

注釈付き画像42
「プレビュー」ボタンをクリックすると、Web サイトのプレビューが表示されます。
公開の準備をするには、「公開」ボタンをクリックします。
サブドメインを変更することができます。
情報を確認しました。ボタンをクリックしてください。

softr が作成した Web ページにアクセスしてください。

色とフォントの例。
スクリーンキャプチャ siamdirectorytools softr アプリ 2026 01 05 15 46 26

softr が作成した Web ページにアクセスしてください。

色とフォントの例。
スクリーンキャプチャツール softr アプリ 2026 01 05 16 24 13

方法 2 を使用してディレクトリを作成する方法と、ツールのスクリーンショットを示します。

事前に必要なもの。

画像やツールのスクリーンショットの URL をホストするには、ホスティングが必要になります。
ツールのスクリーンショットを含むスレッドを含めるように CSV ファイルを設定します (スレッドではツールのスクリーンショットの URL が使用されます)。
1

タイプ 2 ディレクトリにはどのような追加機能がありますか?

  • ツールのウェブサイトのスクリーンショット。
  • ツールの具体的な詳細ページは SEO に適しています。
  • カテゴリ別の類似ツール
  • 複数の言語を作成します。
  • ツール提出ページ
2

ディレクトリ用の Google スプレッドシートを作成する (方法 2)

シートと列に名前を付けます。 注釈付き画像44
データ入力の例。 注釈付き画像45
注釈付き画像44
注釈付き画像45
シートに名前を付け、title – Rank – URL – Category – LogoUrl – Text – Webscreen という名前の列を作成します。
手動データ入力 – タイトル – ランク – URL(ツールのURL) – カテゴリー – LogoUrl(ツールアイコンのアドレス) – テキスト(ツールの説明) – Web画面(ツールのスクリーンショットのアドレス)
他の言語のスレッドも追加できます。

もっと速い方法があります。データを手動で入力せずに CSV データ テーブルを購入することができます。

🌐 ウェブサイト名: 1300 以上のツール。
📝 16 の言語でツールの説明があります。
🏷️ ツールカテゴリー
🧩 ウェブサイトアイコン/Favicoin
🖼️ ウェブサイトのスクリーンショットのセット
😎 アフィリエイト URL を追加して、支払いを受け取るのを待つだけです。
1

新しい Google スプレッドシートを作成します。

タイトル – ランク – URL(ツールのURL) – カテゴリー – ロゴURL(ツールアイコンのアドレス) – テキスト(ツールの説明) – ウェブスクリーン(ツールのスクリーンショットのアドレス)
新しいスプレッドシートを作成します。 注釈付き画像46
「ファイル / インポート」に移動します。 注釈付き画像47
CSVデータをインポートします。 注釈付き画像48
スプレッドシートの置き換えを選択し、データのインポートをクリックします。 注釈付き画像49
注釈付き画像50
注釈付き画像46
注釈付き画像47
注釈付き画像48
注釈付き画像49
注釈付き画像50
2

ウェブサイトのスクリーンショット セットの使用方法。

(画像のホスティング、CDN、またはクラウド ストレージが必要になります。)

ホスティングに画像をアップロードする方法の例。 ホスティング

注釈付き画像51
「アップロード」ボタンをクリックします。 注釈付き画像53
注釈付き画像54
Zip ファイルを抽出するには、右クリックして /Extract を選択します。 注釈付き画像55
フォルダーに移動し、ドラッグ アンド ドロップして、「Webscreen-web」という名前を付けます。 注釈付き画像58
注釈付き画像51
注釈付き画像53
注釈付き画像54
注釈付き画像55
注釈付き画像58
3

画像の URL を編集する簡単な方法。

(独自のドメインに置き換えてください。画像の URL をテストしてください。)
Web 画面列をクリックします。 注釈付き画像59
編集/検索と置換をクリックします。 注釈付き画像60
ドメイン https://siammakemoney.com/ を置き換えます 自分のドメインを入力します **「すべて置換」**をクリックします 注釈付き画像62
注釈付き画像59
注釈付き画像60
注釈付き画像62

画像のURLをテストしてください。例: https://siammakemoney.com/Webscreen-web/affiliatebooster.webp

Google スプレッドシートの検索と置換ツールを使用して、https://siammakemoney.com/ をあなたのドメインに置き換えてください。

GoogleスプレッドシートをStudioに接続する方法

1

Google スプレッドシートで CSV を設定します。

スプレッドシートの名前を変更して使いやすくします。 注釈付き画像63
共有可能なシートを設定する: /ファイル/共有/ウェブに公開 注釈付き画像64
カンマ区切り値(CSV)に設定します。 注釈付き画像65
注釈付き画像66
注釈付き画像63
注釈付き画像64
注釈付き画像65
注釈付き画像66
2

Google Sheets に接続するようにソフトウェアを構成します。

注釈付き画像67
注釈付き画像68
注釈付き画像69
注釈付き画像70
注釈付き画像71
注釈付き画像67
注釈付き画像68
注釈付き画像69
注釈付き画像70
注釈付き画像71
3

ソフトウェアを正しく装飾、構成、接続します。

(ソフト上のボックスからデータを削除して再作成してください。)その他使用方法につきましては、上記のソフト基本作成の項をご参照ください。
グリッドレイアウトを選択します。 注釈付き画像72
Googleスプレッドシートを接続する 注釈付き画像73
注釈付き画像74
ウェブサイトのスクリーンショットをカードに表示されるように設定します。 注釈付き画像75
Google スプレッドシートに一致するカテゴリを設定する方法。 注釈付き画像77
ツールの説明の取得を構成します。 注釈付き画像78
ツール専用のページを作成します。 注釈付き画像79
カードをクリック可能にするには、URL にアクセスしてください。 注釈付き画像80
注釈付き画像72
注釈付き画像73
注釈付き画像74
注釈付き画像75
注釈付き画像77
注釈付き画像78
注釈付き画像79
注釈付き画像80

AFF URL を投稿できるフォーラムはどれですか?

シートの「URL」という列に URL を入力できます。

このソフトウェアは無料ですか?

SoftR は、カスタム ドメイン、公開アプリ 1 つ、データベース 5,000 個、ワークフロー アクション 500 個を含む無料のスターター パッケージを提供しています。

Softr(有料版)

Softr データベースには、50,000 件のエントリ、1,000 の AI クレジット、カスタム コード、カスタム メール送信者、アプリのダウンロード機能、ユーザー フィードバックが含まれています。

Softr で基本テーマをカスタマイズするにはどうすればよいですか?

左側のテーマメニューに移動し、フォント、色、サイズを設定します。

Softr は、Favicon ドメインの説明を構成します。

左側の「設定」メニューに移動し、アプリケーション名、サブドメイン、ロゴ、カスタムドメインを定義します。

Softr は追加のページを作成できますか?

左側の「ページ」メニューに移動して作成できます。

Google 検索の SEO 設定を構成します。

[設定] (左側) / [SEO] に移動します。

Googleアナリティクスを接続する方法

[設定] / [統合] に移動して、Google Analytics を見つけます。

Google スプレッドシートに接続できません。

シートを共有可能に設定します: /ファイル/共有/Webに公開/ カンマ区切り値 (CSV) に設定します。
Facebookコメントボックス
前の記事

初心者向けBloggerテーマ作成ガイド:Bloggerの空白ページ