今回は何だか難しくて手を付けられなかったブログの開設を1日で終わらせるプログラムです。
最後までよろしくお願いいたします。
必要なものは
・パソコン
・携帯電話
・ネット環境
・クレジットカード
・Gmailアドレス
です。
所要時間は1時間程度。
今回はややこしいことは言いません。とりあえず作成していただく上で必要な手順のみとなります。
ちょっとエスプレッソでもキュッといただいて気を引き締めましょう。
では、いきます。
ロードマップ
していただくことはこちら。
作業内容と料金
①住所を決める＝ドメイン名＝URLを決めて購入する（0〜数千円/年）
②土地を買う＝サーバーを借りる（数百円〜数千円/月）
③家を建てる＝ワードプレスをインストールする（無料）
④鍵をつける＝サイトをSSL化する（無料）
⑤家具を揃える＝プラグインとテーマをインストールする（0〜数万円）
住所を決める
まず、インターネット上で住所（URL）を決めます。
サイト名と同じか近しいもので、かつ分かりやすくて長すぎないものがいいですね。
こちらは予め考えていらっしゃると思いますので、早速購入に進みます。
まず、ドメインサイトで使えるドメインを検索していきましょう。
今回は「ムームードメイン」を使います。
ご自身が使いたい名前＋ドメイン（.com .jpなど）の組み合わせが既に使われてしまっていると取得出来ませんので、どれが使えるかを検索します。
もし使われてしまっている場合はちょっとアレンジしてみましょう。
検索窓に検索したいものを入力して「検索する」をクリックすると、使用可能なものにのみ「カートに追加」タブが表示されます。
気に入ったものがあったら、「カートに追加」。すると新規登録画面に飛びます。
初めての方は「新規登録」をクリックして、
メールアドレスとパスワード（8文字以上、半角英数、記号のうち2種類以上の組み合わせ）を作成して入力しましょう。
本人確認のため、SNS認証の画面に移りますので、携帯番号を入力、「認証コードを送信する」をクリック。
入力した携帯電話のSNSメッセージに届いた番号を入力、「本人確認をして登録する」をクリック。
本人確認が完了しましたら、初めに登録したメールアドレスに通知がされます。
先ほど既にドメインをカートに入れたので、カートに戻って購入手続きを済ませましょう。
続いて「ドメイン設定」の画面に移ります。
「ドメイン設定」は下記の通りに。
その下の同時申し込みとオプションサービスはスルーして。
クレジットカード情報を入力します。
料金は1年分になりますが、自動更新設定がされていますので希望されない方は解除するようにしてください。
続いて「お客様情報入力」です。
同じ画面で次のステップまで進めそうですよ。
土地を買う
提携会社で土地（サーバー）を借りる手続きをしてくれるみたいなので、そのまましちゃいましょう。
レンタルサーバーは「ロリポップ」という会社で借ります。
この10日間無料のお試し期間を利用しましょう。
「お試し利用する」をクリックするとプランが選択できます。
「エコノミープラン」が一番安価なのですが、ワードプレスがダウンロード出来ませんので、「ライトプラン」を選択します。
容量、スピード共に他のレンタルサーバーで1,000円以上するのと同じぐらいのスペックなので特に問題ありません。
もう初めから「がつがついくよ！」って思ってる方は「スタンダードプラン」でもいいと思います。
プランを選択しましたら、「利用規約」を一読して、同意。
「取得する」をクリック。
完了したらこの画面が出ますよ。
まだ住所と土地が結びついていない状態ですので、「登記」を行います。
「ムームーDNSセットアップ」をクリックするとコントロールパネルへ飛びます。
下図のように「ドメイン」と「ロリポップ」（サーバー）を紐付けます。
「セットアップ情報変更」をクリックしますと、
「正常に終了しました」のポップが現れますので、OKを押して登記は完了です。
登録したGmailアドレスに「ロリポップ」からメールが届いているはずなので確認しましょう。
これでサーバーを使うことが出来ます。
届いたメールに載っている「ロリポップのドメイン」「独自ドメイン」「パスワード」は必須なので、保存しておいてくださいね。
家を建てる
借りた土地に家を建てていきます。
ロリポップのコントロールパネルにログインします。
先ほどのGmailに送られてきたドメインとパスワードを入力しましょう。
管理画面に入ることが出来ました。
（もしかしたらここで個人情報を入力する必要があるかもしれません）
この画面に移ったら、「WordPressをインストール」をクリック。家を建てましょう。
「サイトURL」には取得したドメインが表示されているはずです。
それ以下は任意となりますが、これはデータベースで管理されるファイル名となります。
たくさんファイルを作成しない場合は無くても問題ありません。
「サイトのタイトル」「ユーザー名」はすぐに変更できます（公開はされません）ので適当でOKです。
「パスワード」は8文字以上、大文字と小文字のアルファベット、数字、記号の組み合わせが必要です。
「メールアドレス」にはロリポップからのお知らせが届きます。
「プライバシー」のところは、公開後、検索されて表示されても良ければチェックを入れましょう。
まだ作成段階だから公開されたくない場合はチェックを外しておきましょう。
入力内容を確認したら「承諾する」をクリック「インストール」でインストールが開始されます。
ものの数秒です。無事！インストールが完了しました！
「公開ページ」と「管理ページ」のURLはブックマークやスクリーンショットを取っておくことをおすすめいたします。
バックアップも取っておいたほうが安心ですが、ワードプレス内のバックアップでもOKです。
無事ワードプレスをインストール出来ていたらGmailにも通知が来ていますので確認しましょう。
ここでワードプレスに入っていじりたいところですが、裏ではまだ接続作業をしている状態。
ワードプレスの画面を開いてもエラー表示が出る場合があります。
ですので、作業が終わるまで、家に鍵をかける作業にうつりましょう。
鍵をつける
ホームページのURLに「この接続は保護されていません」とかいう表示を見たことがあると思いますが、これを「保護されています」に変更。
鍵マークが付くようにします。
ロリポップの左サイドバー「セキュリティ」から「独自SSL証明書導入」をクリックします。
すると、すぐ申し込み画面に。
「無料独自SSLを設定する」をクリック。
その下にご自身のドメイン一覧が現れますが、「SSL保護されていないドメイン」に今のドメインが表示されるはずです。
そちらにチェックを入れ、「独自SSL（無料）を設定する」をクリック。
「SSL設定作業中」の表示が出ればOK。
15分ぐらいで完了しますので、その間に今度はワードプレス内のセキュリティ設定をします。
先ほどワードプレスから送られてきたGmailに載っている「ログイン先」をクリックします。
認証画面に飛びますので、ロリポップの設定で入力したユーザー名とパスワードを入力します。
「ダッシュボード」（管理画面）に入ることが出来ました！
さぁ、もう少しです。もうちょっとだけがんばりましょう。
左サイドバーの「設定」から「一般」を選択します。
「一般設定」ではこのサイトのアドレスが「http（保護されていない）〜」の設定になっているので、「https（保護されている）〜」の表示に書き換えをします。
書き換えをしたら、一番下にある「変更を保存」をクリックして完了です。
重要な変更をすると、パスワードの入力を求められるので入力しましょう。
これが終わると、
URLに鍵マークが付いているのがわかりますね。
表示画面でも確認してみましょう。そのすぐ下のホームマークにカーソルを合わせると、「サイトを表示」の文字が現れますのでクリックしてみましょう。
この設定、一番初めにやっておかないと、手順が増えてしまいますのでこのタイミングでやってしまうことをおすすめいたします。
家具を揃える
では重要な設備から揃えていくことにしましょう。
まず、「パーマリンク設定」から。
パーマリンクとは、記事を表示した時に出るURLの後半部分のこと。これを書いた日付などではなく、SEO上優位になる「記事名」に設定します。
「設定」から「パーマリンク設定」へ行きまして、
「カスタム構造」の空欄部分に「/%postname%」と入力します。
入力したら、「変更を保存」を忘れずに。
では、次に運営に必要なプラグインを入れていきます。
プラグイン＝アプリ という認識でOKです。
めんどくさいことを勝手にやってくれる強い味方です。
入れるのはこちら。
-
-
- Classic Editor
- UpdraftPlus WordPress Backup Plugin
- Google XML Sitemaps
- All In One SEO Pack
- WordPress Ping Optimizer
- PuSHPress
- Broken Link Checker
- Contact Form 7
- Akismet
-
まず、プラグインのインストール方法から。
Classic Editor
設定が特にない「Classic Editor」を見本にいきます。
こちらは入れなくても問題ないのですが、最近ワードプレスの書式が変わりまして、それがとんでもなく入力しにくいので前バージョンにするプラグイン。
なので、今のままで書くのが苦じゃない方は入れないで大丈夫です。
書式を見たい方は「投稿」から「新規作成」をクリックして見てみてね。
プラグインをインストールするにはサイドバー「プラグイン」から「新規追加」をクリック。
キーワードに入力すると該当のものが表示されるので、右上にある「インストール」をクリックします。（下の図では「有効」になってるとこです。）
インストールが完了したら青い「有効」タブが現れますのでそちらをクリック。
もしくは「プラグイン」から「インストール済みプラグイン」をクリックします。
一覧に表示されるので、「有効化」をクリックすればOKです。
（下図で「停止|設定」と書かれているところに出るよ。）
特に設定の必要のないプラグインはこれで完了。動き始めます。
では次からはちょっと設定が必要なもの。
UpdraftPlus WordPress Backup Plugin
その名の通りバックアップをしてくれる必須プラグイン。
インストールして有効化しますと、
「設定」をクリックして設定画面に進みます。
「今すぐバックアップ」をクリックしましょう。
ポップが出てきましたが、特に問題なさそうなのでこのまま進めます。
「今すぐバックアップ」をクリックすると、すぐにバックアップを開始してくれます。
数分で完了していましたよ。
ちなみに「設定」を開きますと、定期的にバックアップをしてくれるようです。
保存先も設定することができます。管理画面にログインさえ出来れば復元は可能なので、こちらも導入しておきましょう。
Google XML Sitemaps
Googleさまにブログの更新をいち早く伝えてもらうためのツール。
公開してから検索エンジンに認識してもらえるようにいち早くお知らせしてくれるというのがこいつの役割です。
「インストール」して「有効化」しましょう。
あとは以下の通りに設定。残りはデフォルトで問題ないと思います。
基本的な設定
投稿の優先順位
Sitemapコンテンツ
Change Frequencies
後から書かれたものの方が先にインデックスされるというのを防ぐことも出来ます。
All In One SEO Pack
はい、きました。SEO。聞いたことあるけどなんなんでしょう。
こちらもひとまず「インストール」からの「有効化」。
これね、ちょっと設定がややこしいのですが、用は導入しているSNSとかも含めて、検索されやすいように関連づけてGoogleさまにアピールするっていう作業をしてくれるやつです。
なのでひと通りブログを公開できる状態になってからの設定でいいかな、とは思うのですが、「Googleアナリティクス」の設定だけは先に済ませておきましょう。
ということで別タブを開いてGoogleアナリティクスの設定をします。
Googleアナリティクス
まずGoogleのトップ画面に飛びまして、右上のアイコンをクリック。
そこからビジネスツールのところまでスクロールしますと、「アナリティクス」が出てきます。
これは、ブログがどれだけ見られているのか、どこからアクセスがあるのか、というのを計測してくれるという必須ツールです。
これね。
「無料で利用する」をクリックしまして、
初めてログインする方はこちらで「お申し込み」をクリック。
アカウントについて入力していきます。
まずアカウント名。ご自身で判断できる名前で大丈夫です。後はデフォルトで。
次に「ウェブ」を選択。
次はワードプレスで作成した「サイトの名」「サイトURL」「業種」「タイムゾーン」は日本に設定しておきましょう。
確認したら「作成」をクリック。
すると「トラッキングID」というのが出てきますので、こちらをコピー。
先ほどのプラグイン「All In One SEO Pack」に貼り付けをします。
では、ワードプレスに戻りまして、
ダッシュボードには「All In One SEO」と大きく出ていますのでこちらを開くと設定画面に入ります。
少し下にスクロールした「Googleアナリティクス」の「GoogleアナリティクスID」に貼り付け。
いつも通り「設定を更新」をお忘れなく！
これで「Googleアナリティクス」に読者さまの閲覧情報が表示されるようになります。
ただし翌日以降となりますので、見たい方は早く記事を書いて色んなところで告知しましょう。
WordPress Ping Optimizer
こちらもSEO関係です。
世界中から情報を集める「Ping」ってやろうに「ここにもあるよ！」をちょうどいいタイミングで知らせてくれるプラグインです。
なんかさっきのやつと混ざりそうですが、似ているようで非なり。
ちなみに何回も知らせればいいってもんじゃなくて、更新するたびにぴこぴこ知らせてたらスパム扱いされるっていうのを防ぐ役割も果たしてくれます。
なので入れといてください。これも割と簡単です。
お馴染みの「インストール」して「有効化」からの、「設定」「WordPress Ping Optimizer」です。
そしてこの空欄部分に、世界中の「Ping」を貼り付けます。
貼り付けるのはこちら。
http://rpc.pingomatic.com/
http://blog.goo.ne.jp/XMLRPC
http://www.blogpeople.net/servlet/weblogUpdates
http://ping.blo.gs/
http://blogsearch.google.co.jp/ping/RPC2
http://blogsearch.google.com/ping/RPC2
http://rpc.reader.livedoor.com/ping
http://ping.fc2.com/
http://ping.feedburner.com/
http://ping.rss.drecom.jp/
http://wpdocs.sourceforge.jp/Update_Services
http://rpc.pingomatic.com/
http://ping.blogranking.net/
http://ranking.kuruten.jp/ping
http://www.blogstyle.jp/
http://www.blogpeople.net/ping/
http://ping.freeblogranking.com/xmlrpc/
http://rpc.weblogs.com/RPC2
http://services.newsgator.com/ngws/xmlrpcping.aspx
http://ping.dendou.jp/
http://blog.with2.net/ping.php/
http://ping.cocolog-nifty.com/xmlrpc
http://ping.sitecms.net
http://pingoo.jp/ping/
http://taichistereo.net/xmlrpc/
http://ping.blogmura.com/xmlrpc/hidmbp2r256f
このままコピペしていただいて、その下の「Save Settings」をクリックすれば完了です。
PuSHPress
またしてもSEO関係です。
まだ出来立てほやほやのあなたのブログがどんなにいい記事を書いたとしても、既に検索上位にいるサイトより突然上に来ることはありません。
そして既に検索上位にいるサイトがあなたの超優良記事をパクったとしても、たぶんバレません。
…ってことを防いでくれるプラグインです。
こちらは設定いらず。
「インストール」して「有効化」でOKです。
Broken Link Checker
ブログに貼っているリンクが切れていた場合教えてくれるプラグイン。
読者さまの信頼とも大きく関わるので必要だと思っています。めっちゃ前に書いたやつなんていちいちチェックしないしね…
こちらも「インストール」して「有効化」。
この通りの設定で問題ないかと。「変更を保存」をお忘れなくね。
一般設定
ブログ内のリンク設定
チェックするリンク対象設定
Contact Form 7
コンタクトフォームを作成してくれるプラグインです。
お客さま、読者さまからのお問い合わせフォームを簡単に設置できます。
まずは「インストール」と「有効化」。
「お問い合わせ」から「コンタクトフォーム」下の「新規作成」をクリックします。
すると既にフォームが出来上がっているので、タイトルを入れます。
項目はご覧の通り。
もちろん、この上に文章をプラスすることも出来ます。
そのお隣「メール」はフォームから送られてきたものがどこに（ご自身のメールアドレス）届くかの設定。
「メッセージ」は、送信後に送信者に送られるメッセージのテンプレです。ここは特にいじらなくてもいいかなと思います。
ちなみにこちらはこのブログのコンタクトフォームです。
名称（公開されません）を入力したら、右端の「保存」をクリック。
するとコードが生成されます。
こいつを固定ページとか、投稿の文面に貼ると、フォームが表示されるというわけ。
ちなみにこんな感じです。
Akismet
こちらはコメント欄を開放している場合にスパムをブロックする用なのですが、正直コメント欄を開放するの自体おすすめしないので必要ないかな。と思います。
必要な方は、たぶん元々ワードプレスに入っていると思うので検索してみてください。
「コメント開放すんの、やめとこ…」と思った方は、これでプラグインは終了です。
お疲れさまでした。
おまけ1：おすすめテーマ
Cocoon
情報発信コミュニティに入っていた時に教えていただいたのがこちら。
しばらく使っていましたが、かなりシンプルです。
なので写真が映えるのと、洗練されたイメージになります。
設定ページでプレビューを見ながら直感的にカスタマイズしていけるので、初心者の方でも問題なしだと思いますよ。
AFFINGER
アフィリエイトにかなり有効ということですが、単純に色々な機能（画面がスライドショーみたいになるやつとか）を使ってみたかったのと、投稿ページをランディングページ化出来るというのでこちらを採用。
大手のTCDでもよかったんですけど、なんか上を見だすとキリがないし、色んなデモサイト見てても結局写真の美しさ＝サイトの美しさだな、と感じたのでこちらをポチり。
こっちにお金を使うのなら、プログラミング勉強するか、写真にお金をかける方がいいと思ってます。
おまけ2：おすすめフリー画像ツール
Unsplash
眺めてるだけでもかなり癒されます。
とにかく画質がいい。画像が多い。そしてフリーダウンロード。商用利用もOKです。
品のあるサイトを作りたいなら知っておいて損はないと思いますよ。
ハンコでアソブ
ハンコのかすれ具合が可愛い、ちょっとノスタルジックな画像です。
文中のひと休み的なアクセントに良いかなと。形式はPNG。
ICOOON MONO
アイコン系フリー素材です。
ダウンロードは背景が透過された状態で出来るのでかなり使いやすいと思います。
形式はPNG、JPG、SVG。画像サイズも選ぶことが出来るので大きく表示してもボケないのがマル。
似たやつで「iconmonstr」っていうのもあります。
unDraw
これ、ちょっと使えそうだなーと一瞬思いましたが、インテリっぽいノウハウ系のブログみたいな印象がつきそうなので使い方に悩みますね。
一部分だけ切り取って使うのはありかな、と思っています。
ちなみに色とかはカスタマイズ出来るので、かなり自由度はある感じ。
画像をクリックしたら「Download PNG for blog posts/social media」の方をクリックするとPNGで取得出来ます。
おまけ3：おすすめサイトギャラリー
とりあえず眺めていれば感性が上がりそうなデザインサイトをまとめたサイトです。
記事を書く合間に見るだけでもかなりインスピレーションが沸くようになると思いますよ。
ではまとめてどうぞ。
webdesignclip
https://www.webdesignclip.com/
sankoudesign
muuuuu
awwwards
ユーザーが投票してランキングが決まるという海外ではかなり有名なサイト。
siteinspire
こちらはロンドンから。
とまぁキリがないですが、美しいもので脳内を満たすのは良いことだと思います。
とりあえず高い基準で物事を見るようにしていきましょう。
では、本日はお疲れさまでした。
頭がいっぱいになっているとは思いますが、本番はここからです。
あなたの感じていることを、感じたままに綴っていきましょう。
ミルクたっぷりのカフェオレでも飲んで、ひと息つきましょうか。
本日もごちそうさまでした。
