QuizXのようなサイト作ってみた~い!

何か新たなことを初めてみたいなぁ。
そんなことを思う方が多いのでは無いかと思います。

自分のサイト作ってみたいなぁ…

誰もが一度は考えるであろうこの妄想…。(考えないか…)

まぁ面倒臭そうだしよく分からないしブログやnoteとかあるし、みたいな感じで断念している気がするのです。

ただ、僕はどうしてもクイズのサイトを作ってみたいという気持ちが爆発してたので、知識0でしたが、分からないことは調べつつ運営することができていたりします!

サイトを作るといってもまぁやり方はたくさんあり、とにかく知識0の状態で始めるのは非常に時間がかかるのです。

色々なメリット・デメリットを比較しているサイトとかもありますが、いちいち比較していくのはとっても大変!(僕はそれでもちゃんと細かく見て比較しましたが…)

そこで、このQuizXというサイトの仕様で良ければもうドドーンと公開しちゃおうと思いまして、書いていこうと思います。

 

専門的な人が見たら、おいおいそりゃ説明足りんだろって部分もあるかもしれませんが、簡潔に分かりやすくというのを第一に考えているので、ある程度ざっくりとした説明にしています。

 

まず初めに!!

この記事を見ながら同時進行でいきたいので、まずは手元にメモ帳とかをご用意ください!

 

①サイト名+内容

サイト名とどんな内容なのかを書き出しましょう。

また簡単で良いので、人に説明する時にここがどんなサイトなのかの説明文なども一緒に考えてください。

(例)
サイト名:QuizX
内容:クイズに関することを書く。
説明文:早押しクイズ・競技クイズの問題を毎日更新するクイズサイト。

実はこの説明文、いらないでしょと思いがちですが、あとになって必要な場面が出てくることに気付くのです。

例えば、広告を付けるための登録時や、どんなサイトですか?と聞かれたときなどにも一言で伝えられるこの言葉が意外と重要です。

あと、たまにそれを見て初心に返ったりもできるかも。

 

さて、できましたか?
ここは納得いくまで考え尽くしてOKです。

 

②レンタルサーバーに登録

サイト名・内容・簡単な説明文は決まったら、あとは行動あるのみ!

サイト情報の保管や配信などをしてくれるサーバーをレンタルします。

実はこのレンタルサーバーは、選択肢がたくさんありますが、QuizXではX繋がりということもあり、ここを使わせていただいています。

エックスサーバー国内シェアNo.1、サーバー速度No.1!

以前、重大な操作ミスを起こして、サイトが吹き飛びましたが、エックスサーバー様に助けていただいて1時間以内に復旧したので絶大な信頼を置いています。

Xserverエックスサーバーの登録手順~
お申し込みはこちら> → 10日間無料お試し 新規お申込み
【サーバーID】何でもOK!
【プラン】X10
【WordPressクイックスタート】チェック有りがおすすめ。
(支払い方法はクレジットカードになりますが、チェックを付けると、設定にかかる時間が30分くらい短縮できます!)



12か月以上の申し込みで、初期費用0円とか自動更新設定もすると「独自ドメイン永久無料特典(プラン特典)とかの特典が付いてきます!(期間によっては他にもキャンペーンあるかも!)

(ちなみに僕の登録したときにはなかったキャンペーンで、初期費用3300円取られています…。)

ちょっと初期で出すお金が高い気もするけど、もうここから先は全て無料でいけます!

③サイトのドメイン取得・設定

先ほどのXserverからもらえる独自ドメイン永久無料特典を設定します。

いやいや、待て待て。Xserverの12か月以上のプランになんかしてないよ…!
という方は、お名前.comというところでドメインだけ購入することもできます!

ドメインっていうのは何かというと、http://◯◯◯.com/ の赤い部分のことをいいます。

そして今からこの◯◯◯の部分を決めます。

もしかしたらすでに自分が取ろうとしているドメインが取られている可能性もありますので、いくつか試してみて気に入ったものを取得しましょう!
〇〇〇には日本語とかも入れることはできますが、アルファベットが良いです。

ちなみにこの後ろにある.comという部分もいくつかある選択肢の中から好きなものが選べます…
選べますが!!

ここは.com.net にしましょう!
.linkとか.xyzとか一見カッコ良さげなものもありますが、ユーザーに信頼されにくいサイトになります。

~「独自ドメイン永久無料特典」の取得手順~
Xserverアカウントへログイン→サービスメニューの「各種特典のお申し込み」→独自ドメイン永久無料特典(プラン特典)の「この特典を使用する」→新規取得+お好きなドメイン名を入力→検索→気に入った物を取得

 

さて、ここからは導入編!

④WordPressを入れよう

WordPressってなんだ!?文字をつぶしちゃうのか!?

いいえ違います!!

簡単に言うと、記事を書いたりするための超便利ツール。しかも無料。

みなさんもよくご存知のあの超大手クイズWEBメディアなんかも、こちらのWordPressを使用して記事を書いております。

とにかく便利なやつなのでまずこれを入れましょう。

 

手順
サーバーパネルより「WordPress簡単インストール」→先ほど作ったドメイン名で「選択する」

簡単インストール完了後に、表示されたリンクをクリックするとログイン画面へ移動できます。

ちょっと詰まってしまった…というときにはここを見てみましょう!
WordPress簡単インストール手順|エックスサーバー

 

ログイン後の説明

左側のサイドバーにいくつか項目があると思います。

投稿は、通常の記事を書くときに押します。
固定ページは、一覧には表示されないけど、プライバシーポリシーとかお問い合わせとかの必要なページ。
外観は、見た目。テーマとかメニューバーの設定を行います。
プラグインは、いわゆるアプリみたいなもの。ワードプレスに追加していくことで多機能になっていきます。
設定は、サイト名や管理者メールアドレスなどを入力できます。もうここは設定しちゃいましょう。

⑤サイト全体の基礎となるテーマはこれ!

まずテーマといって、このサイトの全体的な見栄えのお話。

WordPress自体は無料でも、そこの中で配布しているカッコいいテーマとかは有料とかだったりするんです。よくあるソシャゲの基本プレー無料とかいうやつですね。

有料のテーマはだいたい1つで1〜2万円くらい。

…高くね?と思いませんか。その通り、高いです!

そこで、無料で使えるCocoon(コクーン)というテーマにしましょう。

外観→テーマ→テーマのアップロードにCocoonを追加。

まぁ他にも無料で使える良いのはたくさんありますが、細かく比較して悩む時間がもったいないのでCocoonをダウンロードしましょう。

ざっくりと何が良いかというと、無料ですが、かなり自由度の高い編集ができること。初心者にも使いやすく、超多機能です。

 

と、紹介はしていましたが、2021年10月にQuizXはCocoonから新たな有料テーマ「THE THOR」に移行しました!
正直、Cocoonでも十分に色々できます!実際それで2年半やってきてたしね!!
ただ後々少しでも乗り換える予定があったり、長く継続していくつもりであれば、お財布と相談してこのTHE THORをオススメします。
1000記事公開してからこれに乗り換えましたが、そうとう面倒なコトになってます…。
それでもデザインが良いのでひたすらレイアウト直してます。税込16280円…うん、高いネ!

⑥プラグインを入れてみよう

手順
プラグイン→新規追加→プラグインの検索

Google XML Sitemap
サイトマップを作成し、検索エンジンに見つけやすくなる。

All in one SEO Pack
メタタグを設定できる。ページ概要や検索されないようにすることなどもできる。

TinyMCE Advanced
投稿するときのメニューを追加して記事が作りやすくなる。

Contact Form 7
お問い合わせフォームが作成できる。

Broken Link Checker
リンク切れがあるページを自動チェック。

他にも色々用途によって入れるべきもの、そうでないものあると思いますが、①~③は絶対に入れておいた方が良いと思います!

これでおおまかな設定は一通り終了です!
(上で述べたTHE THORであれば、②③④は不要です!)

⑦クイズ系プラグイン3選+α

Quiz And Survey Master

時間制限、記述形式、選択式、解答によって配点を変えたり、とにかくやろうと思ったことは何でもできます。最強です。
ですが、クイズ作成をするまでに多機能すぎて、慣れるまでの操作が非常に時間がかかります。
自由度は高いものの上級者向けかもしれません!
(参考記事:2種類の答えがあるクイズ

ARI Stream Quiz

直感で操作できます。見栄えが良いです!
選択式クイズを作成することができ、問題や選択肢順もランダムにできます。とにかく非常に簡単。
QuizXはこれを主に使用しています。初心者向け!
(参考記事:国旗検定

Quiz Maker

クイズはテキスト形式や選択形式などを織り交ぜて出題できる。
感覚的には①Quiz And Survey Masterと②ARI Stream Quizの間のような存在。
中級者向け!

Google Form

これはプラグインではありませんが、細かい解答データがすぐに分かるので正答率なども簡単に出すことができます。クイズにおいてはめちゃくちゃ使えるのでオススメします!
(参考記事:【第7弾】4択テストの問題+結果発表

 

⑧サイトの収益化

やっぱり気になるのは広告ってどうやってつけるかという部分ですよね。
主に使うのがGoogle AdSenseというものです。

ただこれにはサイトの審査が入ります。

プライバシーポリシーが記載されているか、記事数が5~10本くらいあるかなどが見られます。

 

どちらにしろ、まずは記事を公開して行くという作業からスタートとなりますので思いのままにじゃんじゃん書いていきましょう!

今は申請してから3日くらいで審査結果がでるんだとか!!

⑨WordPressでできること。

ここから先は、可能性無限大です。

ログインが必要な会員制の記事にしたり、
チャットルーム作ったり、
日記感覚でブログを作ってみたり、
パスワードを知っている人だけの限定公開にしたり、
ユーザーが誰でも投稿や編集できるサイトにしたり、
自分のネットショップを作って販売したり、
まとめサイトを作ってみたり、
動画貼ったり、Twitterのツイート貼ったり…

とにかく自分がこれをやってみようかなと思ったことはけっこう出来ると思いますので、ここから先はアイディアをフル活用して色々と調べてやってみると良いと思います!

 

最後に…

なんでこんな記事書いてんの?と思いましたよね?

理由は3つ。

①筆者であるnagiはクイズが作るのに非常に時間がかかってしまい、一応メモとして残していたサイトの作り方というものの需要があるかと思ったので公開!
②QuizX宛てのメールで、2か月に1回くらい「サイトってどうやって作るんですか?」みたいなものが来る!
③クイズYouTuberとかは増えてきたけど、クイズサイト運営とかは少ないなぁと感じるので色んなクイズサイトを見てみたいなという思いから!

たまにはこういう記事も良いのかなぁと思い作ってみました~。
ぜひサイトを作る際には参考にしてみてね!

4000字越えのガッツリとした記事になりましたとさ!!