シナリオ執筆の為、更新停滞気味です

エディタXを使って探索者まとめサイトやキャラクターまとめサイトを作る。WixSTUDIO、テンプレートを使って探索者まとめサイトやキャラクターまとめサイトを作る① 新規登録編&データベース作成 前編 エディタXの登録方法、CMSとは、CMSの追加方法、コレクションの作成、データベースのフィールド追加、データベースに画像を追加する方法 Editor X

目次

最終的に作れるもの

ホームのページ&動的ページ

管理画面データベース(CMS)!今回は此処の作り方のみ、やります!

動的ページを一つ作れば、
後は管理画面のCMSを変更するだけで
自動的にページを作成することが出来ます。

導入

男子D
男子D

TLにあった探索者まとめを
管理しやすいサイトが作りたい。

CMSと連携する
やり方ですかね…?

男子B
男子B

僕もWixやXエディタを触って
数週間なので、
至らないところがありますが、
やってみましょうか。

男子B
男子B
男子D
男子D

コードは分からない…

Xエディタはコード不要なので、
一緒に見ながら
サイトを作る事が出来ますよ

男子B
男子B

CMSとは

CMS(コンテンツ・マネジメント・システム)

ウェブサイトの運営・管理を効率化するツールであり、
専門的な技術を持たない人でもウェブページの編集や更新を簡単に行うことができます。

HTMLやCSSの知識がなくても、テキストや画像の更新、ページの追加や削除など、
ウェブサイトの内容を直感的に操作することができます。

男子D
男子D

そのCMSって言うのは?

ざっくり言うと、
ウェブページの編集を
プログラミング言語なしで
行うことが出来るツール、
と思って下さい。

男子B
男子B
男子D
男子D

便利だ

XエディタのCMSは
Notion、Excelを触ったことある人は
6割は理解できると思います。

男子B
男子B

会員登録

サイト開く

まず、エディタXを
開いて下さい

男子B
男子B
男子D
男子D

開いた

今すぐ作成を押す

男子D
男子D

今すぐ作成を押して良い?

大丈夫ですよ

男子B
男子B
男子D
男子D

ログインのページは
「新規登録」で良い?

そうですね

男子B
男子B
男子D
男子D

登録画面になった

此処のサイトは
メールアドレスが
サイトのアドレスと直結します

男子B
男子B

tarouという名前のアドレスは、サイト名にtarouが付きます。

男子D
男子D

その場合は、
アドレス作ればいい?

そうですね、
それが無難だと思います

男子B
男子B
男子D
男子D

アンケートっぽいのが
出てきた。

とりあえず、
「その他」「自身」で
次に進んでください

男子B
男子B
男子D
男子D

テンプレートの選択は
白紙で良い?

そうですね、
今回は白紙で合っています。

男子B
男子B
男子D
男子D

チュートリアルツアーに参加する?
と聞かれた。

かなり分かりやすかったですが、
今回は「閉じる」で

男子B
男子B
男子D
男子D

本当に真っ白になったよ…?

今回は
データベースを作成するので
ここの部分は
真っ白なままで終わります

男子B
男子B
男子D
男子D

データベースって、
響きからして、格好良い…

では、やりましょうか

男子B
男子B

データベース(CMS)を作成

では、左上にある
表っぽいマークの付いた
CMSボタンを押してください

男子B
男子B
男子D
男子D

押すよ

男子D
男子D

CMSを追加、と出てきた。

これは
「追加する」でOKです。

男子B
男子B
男子D
男子D

CMSという画面だけ出た

では、
コレクションを
クリックして下さい。

男子B
男子B
男子D
男子D

分かった、
コレクションを押すよ

男子D
男子D

このまま
「コレクションの作成」を
押せば良い?

はい、それでいいです。

男子B
男子B
男子D
男子D

コレクションを作成する、の
メニューに飛んだよ

コレクションの名前は
何でも良いですが、
便宜上、「探索者一覧」と
記入して下さい

男子B
男子B
男子D
男子D

オーヴァード一覧とかが良い

出来なくもないですが、
今回はオーヴァードの事を
知らない人もいるので、
探索者にしましょうか

男子B
男子B
男子D
男子D

分かった。
探索者一覧、と入れる

男子D
男子D

作成

男子D
男子D

Excel表みたいなのが
出てきたね

ここに「フィールドを追加」して
表の要素を増やしていきます

男子B
男子B

データベースのフィールド追加

フィールド=タイトル、みたいなもの
※名前、画像、動画まで管理が可能※

今回、追加したいフィールドについて
画像、数字、テキスト、リッチテキスト、タグ

フィールドは
色々な種類があるので
種類ごとに追加していきますね

男子B
男子B

これだけ抑えれば分かる人は分かる!

男子D
男子D

フィールドを追加して、
要素を増やしていくだけだね?

完全に理解していますね、
そうです。

男子B
男子B

とはいえ、
たまにどうすればいいか
分からなくなることもあるので、
順番にやっていきますよ

男子B
男子B

フィールドタイプ:画像

フィールドタイプ:画像で、
アイコン、全身、背景、バストアップのフィールドを作る

まず、画像ですね、
ページを作る為に
必要な要素は4つ

男子B
男子B

立ち絵がない場合は、フリー立ち絵などをお借りして試してください↓

背景イラストがない場合は、フリー立ち絵などをお借りして試してください↓

どちらもサイトによって規約が違うので、確認の上行って下さいませ

丸形アイコンで
トップ画面を作るので、
その時にアイコンは使います

男子B
男子B

他は動的ページで使います。

男子D
男子D

分かりやすいけど、
図解の文字が――

男子D
男子D

ちょっと主張強い

分かればいいんですよ、
分かれば。

男子B
男子B

細かい装飾は
Cとかに聞いてください
僕は完成すれば良い派ですから

男子B
男子B

①フィールドを追加する

まず、
フィールドを追加します。

男子B
男子B

②フィールドタイプを選択

男子D
男子D

フィールドタイプを
選択、と出てきた。

男子D
男子D

画像で良い?

はい、
画像で合っています。

男子B
男子B
男子D
男子D

なら、選択をクリックするよ

③フィールド名を入れる

フィールド名は
タイトルなので
アイコンとかの名前を入れます

男子B
男子B
男子D
男子D

アイコンのフィールドが出た。

④アイコンを入れてみる

では、
アイコン画像を
入れましょうか

男子B
男子B

アイコンタイトルの下を
クリックして下さい

男子B
男子B
男子D
男子D

青くなって画像を追加、
と書かれているね

その「画像を追加」を
クリックして下さい

男子B
男子B
男子D
男子D

画像選択画面になったから
「アップロード」で良い?

はい、アップロードを
クリックして下さい

男子B
男子B
男子D
男子D

またアップロードが
出たから押すよ

男子D
男子D

ファイルを選択して、
アップロードする

そうですね

男子B
男子B
男子D
男子D

出来たよ

……では、
アイテムを追加を
押してください

男子B
男子B
男子D
男子D

アイコンが
アップロードできた

良かった。

男子B
男子B

なら、あとは同じように
他の画像も
アップロードすれば完了です。

男子B
男子B

関連記事

TOP

多くの方に教えてくださると、喜びます!
  • URLをコピーしました!
  • URLをコピーしました!

この記事を書いた人

今はゲームシナリオを書いている者です。
アナログゲームを嗜む脚本家、小説家、人狼もマダミスも好き。

目次