WixCodeの使い方(その2:データベース作成とデータの設定)

WixCodeの使い方(その2:データベース作成とデータの設定)

Posted at November 27,2017 12:03 AM
Tag:[Wix]

本エントリーでは、Wixブログに新しいデータベースを作成し、作成したデータベースに値を設定する手順を説明します。

手順の前に「Wixブログの作り方」の手順でブログを作成し、「マイアプリ」が表示されている画面左上の「サイトを管理」をクリック。

サイトを管理

左側にある「サイトを編集」をクリック。これでテンプレート編集画面に遷移します。

サイトを編集

1.データベースの作成

左サイドバーの「Collections」のリンクをクリック。

Collections

展開されたツリーの「新しいコレクションを追加」をクリック。

新しいコレクションを追加

「Start Creating」をクリック。

(クリックで拡大、以下同様)
Start Creating

データベース名を設定する「Give this database collection a name」フィールドが表示されます。

Give this database collection a name

ここでは「Products」と入力します。

Products

「What’s this database collection for?」の右側にあるアイコンをクリック。

What’s this database collection for?

データベースの種類を選択します。

データベースの種類を選択

選択する種類によってデータベースにアクセスする権限が異なるようです。

  • Site Content:誰でも参照可能
  • Form Input:誰でも設定可能
  • User-Generated Content:誰でも参照可能、メンバーのみ設定可能
  • Content for Members:メンバーのみ参照可能
  • Form Input from Members:メンバーのみ設定可能
  • Private Data:管理者のみアクセス可能
  • Custom Use:権限をカスタマイズ可能

ここでは誰でも参照可能な「Site Content」を選択します。

Site Content

「Create Collection」をクリック。

Create Collection

これでデータベースの作成が終わり、テーブル作成画面に切り替わります。

データベースのテーブル作成画面

2.データベースカラムの作成

次にデータベースカラムの作成を行います。

データベース作成直後には「Title」というカラムがデフォルトで用意されています。

まずはこのカラムの名称を変更し、そのあと新しいカラムを追加します。

「Title」の部分にカーソルをあてると、右側に設定用のアイコンが表示されます。

設定用のアイコン

設定用のアイコンをクリックして、「Edit Properties」をクリック。

Edit Properties

カラムの編集画面が表示されます。

カラムの編集画面""

Column Name欄の「Title」を「Product Name」に変更して「Update」をクリック。

Update

これで変更されました。

変更

カラムを追加する場合はデフォルトカラム右側の+をクリック。

カラムを追加

カラムの編集画面が表示されるので、ここでは名前に「Price」を設定します。

名前に「Price」を設定

「Data Type」をクリックして、データの型を「Number」に変更します。

データの型を「Number」に変更

「Add」をクリック。

Add

これでカラムが追加されました。

カラム追加

同じ要領で画像用のカラムも追加します。

画像用のカラムも追加

画像用のカラムも追加

3.データの入力

最後に、作成したカラムにデータを設定します。

テキストデータはカラムをダブルクリックすれば入力できます。

データの入力

任意のデータを入力します。

任意のデータを入力

画像はカラムに表示された「+」をクリックします。

「+」をクリック

「画像をアップロード」をクリックして画像をアップロードします。

画像をアップロード

アップロード後、「画像を追加」をクリック。

画像を追加

画像が追加されました。

画像が追加

データベース左の「+」をクリックして、同じ要領でデータを入力します。

データベース左の「+」をクリック

データを追加したところです。

データを追加したところ

4.レコードの挿入

データを挿入したい場合は、挿入したい直前のレコードを選択して「+」または「Add Row」をクリックします。たとえば1と2の間にデータを挿入したい場合は、1のレコードを選択して「+」または「Add Row」をクリック。

レコードの挿入

これで挿入されました。

レコードの挿入

5.レコードの削除

不要なレコードは、数字の部分で右クリックして「delete」を選択します。

レコードの削除

6.データベースの保存

入力したデータを保存するため、右上にある「保存」をクリックします。

保存

これで作成したデータが保存されます。

関連記事
トラックバックURL


コメントする
greeting

*必須

*必須(非表示)


ご質問のコメントの回答については、内容あるいは多忙の場合、1週間以上かかる場合があります。また、すべてのご質問にはお答えできない可能性があります。予めご了承ください。

太字イタリックアンダーラインハイパーリンク引用
[サインインしない場合はここにCAPTCHAを表示します]

コメント投稿後にScript Errorや500エラーが表示された場合は、すぐに再送信せず、ブラウザの「戻る」ボタンで一旦エントリーのページに戻り(プレビュー画面で投稿した場合は、投稿内容をマウスコピーしてからエントリーのページに戻り)、ブラウザをリロードして投稿コメントが反映されていることを確認してください。

コメント欄に(X)HTMLタグやMTタグを記述される場合、「<」は「&lt;」、「>」は「&gt;」と入力してください。例えば「<$MTBlogURL$>」は「&lt;$MTBlogURL$&gt;」となります(全て半角文字)