月額千円で始められるWordPressブログ開設マニュアル・後半Contents Management System

月額千円で始められるWordPressブログ開設マニュアル・後半

WordPress

現役フロントエンドエンジニアのかみーゆです。
WordPressを使ってブログ始めたい人へのマニュアル第二弾!WordPress設定、SEO設定、Gutenbergの最低限の使い方を解説しています。
サーバーの選び方、ドメインどーすりゃいい?インストールすらもわからない人も前半を見れば大丈夫。
さあ、WordPressでブログを始めましょう!!

WordPressブログ開設のためにざっくり何をする必要がある?

この記事は月約千円で始めるWordPressブログ解説の後半です。
前回の記事を読みたい方はこちらから。

月額千円で始められるWordPressブログ開設マニュアル・前半
月額千円で始められるWordPressブログ開設マニュアル・前半

現役フロントエンドエンジニアのかみーゆです。 WordPressって人気ですよね。WordPress使ってブログ始めたいけど何から手をつけて・・・

  • サーバーの準備(ドメインの反映に時間かかるよ)
  • WordPressインストール
  • WordPressの各種設定をしていこう(← 後半はここから)
  • WordPressのブログを書くための準備
  • 記事を書いてみよう
  • Analytics、search consoleの準備と設置

初期費用金額の試算を改めて紹介します。

年間費用  5,000円 ~ 
ドメイン取得料金 500円 ~

サーバー次第ですが月額1000円以内で始めることができます

必要なのはやる気ですww

WordPressの各種設定しよう

ブログを始めるために設定をしましょう。

ここでは最低限の設定のみ説明します。
今回ご紹介するのは最低限ブログを公開するための内容です。

前回はテーマをCocoonに設定するところまで行いました。

サイトの基本のSEO情報

ウェブサイトはユーザーが見たい情報をグーグル検索で探してたどり着くオーガニックサーチがきっかけで流入されてることが多いです。

私のサイトも7割以上がオーガニックサーチからの流入で記事を読んでもらってます。

 

クリックされる時に重要なのがサイトのタイトルディスクリプションです。

みなさんも検索するときに出くわす以下のような表示です。

seo05.png

必ずタイトルとディスクリプションを設定しましょう。

タイトルの設定

Cocoon設定から全体のタイトルとサイトの説明を設定しておきます。

wordpress2-01.jpg

 

AMPをオンに

wordpress2-02.jpg

モバイルで高速化表示するためにAMPをオンにしておきます。

ロゴ素材も必要です。幅600px、高さ60px以下で作っておきましょう。

ファビコンを設定する

ファビコンとはブラウザーのウィンドウタブの左側にあるちっこいアイコンです。

 

wordpress2-03.jpg

ファビコンはユーザーがサイトを探すための目印にもなります。
ファビコンの設定は「管理画面」 > 「外観」 > 「カスタマイズ」から画像をアップロードするだけです。

 

wordpress2-04.jpg

最近ライト・ダークモードと使っている人がいるのでデザインによっては白背景などをつけたほうが良さそう。いずれにせよ、必ず設定しましょう。

パーマネントリンクの設定

SEO上重要なのがURL。それをWordPressでは「設定」 > 「パーマリンク設定」からドメイン以下のURLの出力条件を変えることができます。

wordpress2-05.jpg

 

個人的にオススメなのは以下みたいなパターンです。

  • ドメイン/カテゴリー名/スラック名
  • ドメイン/スラック名
  • ドメイン/blogs/スラック名

記事idにしてしまうのが設定不要でラクなのですが、あえてスラックを毎回設定するようにします。

理由は検索エンジンがURLも解析しているからです。

 

記事のスラックは%post_name%にセットして、記事と関連する英単語を使うようにしましょう。

スラックをマルチバイト文字である日本語で設定してしまうと変な文字列(URLエンコード)になってしまいます。

wordpress2-06.jpg
↓↓↓↓

http://ドメイン/%E3%81%93%E3%82%8C%E3%81%AF%E3%83%AF%E3%83%BC%E3%83%89%E3%83%97%E3%83%AC%E3%82%B9%E3%81%AE%E6%8A%95%E7%A8%BF/

 

検索エンジンは長いURLを好まないし、先ほども述べたようにURLも解析しています。
スラックは必ず、英語で付けましょう。

画像の設定

サーバーの容量には上限があるので、不必要な画像が生成されないようにしておくのがオススメ。

私はアイキャッチといって記事をアピールする画像と記事内などに使う汎用的な画像の2種類だけ作るようにしています。


画像の設定は「設定」 > 「メディア」から変更できます。

wordpress2-07.jpg

 

画像のアスペクト比は4:3か16:9がオススメです。

 

WordPressは画像の設定で一枚しか画像が必要ない場合でも画像サイズに設定した数だけリサイズされて生成されます。
「中サイズ」と「大サイズ」を幅・高さ共に0にしておきます。これで、不要なデータが生成されなくなります。

 

そして絶対に幅5000pxとかでっかい画像をアップしてはダメですよ!!!!
必ずリサイズしてUPLOADしてください。

 

画像たくさん作らなきゃいけないんだって思っている方いると思います。
結構無料ソフトもあるのでそういうものを活用してください。

私のオススメはAdobeのプロトタイプソフトXDです。

wordpress2-09.jpg

XDダウンロード

元々はワイヤーやデザインカンプを作るためのソフトですが無料で使えます。

複雑な作図はコツが要りますがカンタンな単なイラスト作成や画像にフィルターもかけることができます。

XDを使うためにはAdobeアカウントが必要です。

記事を書くための設定

WordPressは書きたいジャンルごとに記事を整理できます。どんな種類の記事を書くかしっかり決めておきましょう。

整理方法は2種類あります。あらかじめルールを決めておくことをオススメします!

カテゴリーの設定

最初にどんな記事ジャンルの記事を書くか決めておくことをオススメします。
あらかじめジャンルを整理しておくと自分の書きたいことがブレにくいですし、ユーザーもこの人何が伝えたいんだろうってならなくて済みます。

カテゴリー記事が増えてきたらカテゴリーごとに一覧ページが勝手に作られます。
ユーザーも見たいジャンルの記事が一気に探せてベンリです。

カテゴリーにもスラック設定があります。

 

これが重要。

 

ちゃんと設定してないとカテゴリー名がそのままスラックとして適用されます。日本語はマルチバイト文字なのでなっがーいURLになってしまいます。
記事ごとのスラック同様、必ず英語でタイトルをつけましょう。

カテゴリーごとに名前とスラックと説明を設定しておきましょう。

wordpress2-10.jpg

タグの設定

タグもカテゴリー同様、細かいキーワードのジャンルごとに記事の整理ができます。カテゴリーは階層構造を持てますが、タグは持てません。

カテゴリーでしっかりカテゴライズする分、タグは意識せず自由度高く使うことをオススメします。混乱しそうであれば、あえて使わないという選択肢もあります。

wordpress2-11.jpg

 

タグも増やしすぎるとカオスになります。20こまでといった感じで上限を決めることをオススメします。

そのほか最低限必要なページがあれば用意しましょう

その他の必要なページがあれば、随時固定ページを利用して作ります。
現時点で最低限あればいいページは以下ぐらいかと。

  • プロフィール
  • プライバシーポリシー

 

特にプライバシーポリシーは設置しておきましょう。

理由は計測のためにAnalyticsを使うから。Analyticsを使うためにはCookieという個人データを取り扱う機能を利用します。個人情報保護方針の上で同意を取る必要があります。

たかだか個人のブログでも、訴えられないよう必ず設置しておきます。

プライバシーポリシーページはデフォルトでWordPress上、あらかじめ下書きで準備されています。

wordpress2-12.jpg

適宜必要であれば修正して使いましょう。

noindexを外す

はい。ここまででなんとか公開準備ができました。早速公開してみましょう。
サイトインストール時、検索エンジンにクロールされないように設定しておいた以下の設定を解除します。

wordpress2-13.jpg

Search Console、Google Analyticsのアカウント作成してサイトを計測しよう

CocoonはSEOに特化したテーマなのでGoogle Analyticsやsearch console(通称サチコ)の設定がカンタンです。
まずはGoogleアカウントでそれぞれのアカウントを解説しましょう。

 

Webサイトの解析には両方のアカウントが必要です。
役割の違いですがざっくり言うと以下の通り。

 

  • Search Console ... ユーザーがサイトに到達するまでのデータを集積します。
    sitemapの送信・管理や被リンクの数も調べることができます。サイトのユーザビリティの問題やエラーなどもこちらで確認できます。
  • Google Analytics ... ユーザーがサイトに到達した後のデータを集積します。
    PV、セッション数、滞在時間などを分析できます。

 

Cocoon設定の「アクセス解析・承認」から設定します。

wordpress2-14.jpg

Google Analytics

Google Analyticsのアカウントを作成します。

Google Analytics

そして、「トラッキング ID」を追加すればOKです。

wordpress2-15.jpg

 

設定後、トラッキングコードからテストトラフィックを送信してチェックしてみましょう。

 

wordpress2-16.jpg

Analytics設定でやっておいてほしいこと

正しい解析は正しい数値から。

このままだと、自分が確認のために閲覧したデータも計測されてしまいます。
なのでフィルターに自分の使っているIPアドレスの除外設定をしておきましょう。

wordpress2-17.jpg

自分の使っているIPアドレスは以下のようなサービスで調べることができます。

 

ネットワーク監視サービス

 

なお、IPアドレスは固定IPアドレスの契約をしていない場合はルーターの電源を落としたなどで変わることがあります。

なので、定期的に調べで変わっていないかチェックしましょう。

 

もしくはChromeのプラグイン、オプトアウトを入れておくのもオススメ。
Google Analytics オプトアウト

Search Consoleについて

Search Console

Cocoonでのサチコを認証する上で必要なデータは「設定」 > 「所有権の確認」から調べることができます。
HTML タグの認証方法を見てみます。

wordpress2-18.jpg

content=の"(ダブルクォーテーション)内の値をコピーし、search consoleのIDとして貼り付けます。

設定が終わったら、確認をポチっと押しましょう。

超ざっくり記事を書いてみよう!!

では早速Gutenberg(グーテンベルク)で記事を書いてみましょう!
GutenbergはHTMLの知識がなくても、書いた文章に応じてHTMLに変換してくれるWordPressのエディターです。

最低限、検索エンジンが解析しやすい記事の書き方をご紹介します。

見出しと段落はセットで使う

見出しはその下に続くコンテンツの要約です。

ユーザーにとってもSEO上もその一文を読めばどんな記事が書いてあるかわかるのでとても重要。

HTMLでは見出しタグといい、重要度別で1 ~ 6まで存在します。

wordpress2-19.jpg

 

h1から急にh4という使い方はせず必ず順番に使います。


ちなみにみなさん、雑誌や新聞を読む時見出しを読んでそのコンテンツをスキップするか決めませんか?

コンテンツを読むかどうかをユーザーに委ねることはユーザビリティアップにもつながります。

h1
 h2
   h3
 h2
 h2

箇条書きを積極的に使う

あるレストランに行ったとします。
メニューが以下だった場合どう思いますか?

お肉のコースはソーセージ、牛フィレステーキ、鶏のソテーです。

 

お肉のコース

  • ソーセージ
  • 牛フィレステーキ
  • 鶏のソテー

 

私であれば前者を見た途端発狂し、店主を呼ぶかもしれませんww

箇条書きの利点は文書を塊に分けることができるので、見た目も含め分かりやすくなります。
検索エンジンも同様で段落上の文章よりも、リスト化された方が解析しやすいんです。

Gutenbergを使えばカンタンなボタン操作で書いた文章をHTMLに変換できます。

wordpress2-20.jpg

 

箇条書きには大きく2種類あります。

並ぶ順番が決まっているものとそうでないものです。

基本的には文字の先頭にポチッと点があるものでいいですが、順番絶対コレって決まっている箇条書きをしたいときは番号のついたリストを使いましょう!!

アイキャッチ、カテゴリー、カテゴリー、スラックを設定したら公開だ!!

アイキャッチ、カテゴリー、カテゴリー、スラックすべて設定したら公開しましょう。
たくさん、記事を読んでもらうためにはSNSでシェアするのが一番手っ取り早いです。

 

ここで重要になるのがOGP設定
OGPとはオープングラフプロトコルの略で、主に各種SNSで解析されるデータです。

 

ポイントはOGP画像。

 

先ほど設定したアイキャッチ画像がそのまま転用されます。
適宜サイズやアスペクト比もSNSごとに容赦無く上下左右切断されます。

wordpress2-22.jpg

画像にロゴやテキスト・人物写真などが変なところで切れてないか各デバッガーでシェアする前に確認しましょう。

おまけ・絶対セキュリティのために入れておいて欲しいプラグイン

WordPressは何よりも狙われやすいCMSです。使う以上自分の身は自分で守る。プラグインで解決しましょう。

※ 万能ではないことを納得した上で使いましょう。

Site Guard

だいたいブルートフォースアタックは海外経由なので文字認証が日本語という時点で撃退できます。
SiteGuard WP Plugin
ただ、このプラグイン、さくらレンタルサーバー×G-Suiteとの組み合わせが死ぬほど悪かったです。
さくらレンタルサーバー×G-Suiteとの組み合わせがそもそも悪いのか。。。使うとき注意してください。

まとめ

これでWordPressサイトを最低限ブログを書けるレベルまで持っていけたのではないかと思います!

コンテンツは書いて経過を計測してPDCAを回す楽しさもあります。
この記事がみなさんの一助になれば幸いです。

ぜひ、WordPressを使ったブログライフをお楽しみください。
最後までお読みいただきありがとうございました。

関連記事もあわせてお読みください

Read More Blogs

よく読まれている記事

管理人について

IT戦士:かみーゆ

私、フロントエンドエンジニアのかみーゆです。日本でフロントエンドを中心に約10年Web制作 →→→ セブ島に転職してエンジニア講師 →→→ オフショア開発担当者(イマココ)。13歳の頃から「好きなように生きて好きなように死ぬ」が人生のKPI。なので、「楽しいか」、「かっこいいか」でやることを判断・取捨択一しています。好きなものは肉とビール。

About Me