【超初心者】Word Press Cocoonの使いはじめの初期設定と公開に必要な手順と進め方

レンタルサーバー契約後、WordPressを始めてみたら思ったより難しいと手をこまねいている方も多いのではないでしょうか？

いざ色々と触ってみたけどハードルが高く、なんだか分からなくなってしまった、無駄に時間だけ経つけれど何も出来上がらない状況に陥った方に参考にしていただければと思います。

最初の状況はこんな感じ？

簡単だと評判だったので使ってみたら思うようにもできないし、機能がたくさんあって覚えることだらけで、結果として思っていたほど簡単ではなく、何も進まなかったというのが実感ではなかったでしょうか。

私も老後の楽しみの一つとして準備しようと始めましたが、全然進まなくなってしまったのでどうしようという状況に陥りました。そんな中、初心に戻ってやるべきことを整理してからは非常にスムーズになりましたので、実際これから進めようとしている方が以下のようなタイプでブログを始めようとしたら参考になりそうなので是非ご覧ください。備忘録的に書いた記事ですが、参考になればと思います。

勢いに任せない方が無難だなぁと痛感

インターネットに携わっていて、過去にホームページとかを担当していました。。。って感じのノリで始めると「つまずき」ます。私も昔はホームページの制作をしていましたが、現場を離れて十数年。ブログライフも楽しいかなぁと思い、改めて始めてみたところ浦島太郎状態です。当時はテキストエディタなどで制作していたので、ツールを使いながら制作するのは初めてです

ただ、なんとなく出てくるキーワード的なところは聞き覚えがありましたので、分かるだろうと思って早々にいじり始めたのが失敗の始まりでした。

いきなり真似てみようとは思わないこと

自分では出来ないから、いい感じのブログをググって真似しながら進めればできるかと思いましたが出来ませんでした。

何やっても出来なく落ち込みましたが、こうなったら基本から改めて考えなおすことが一番の早道だと思い、まずは初心に帰って進めようと計画してからは順調に、簡単に進めることができました。

ではどのように進めれば良いのか？

まずは「こんなイメージにしたい」「こんな風にしたい」「こう見せたい」などの考えは大切に心にしまい、サイトを立ち上げるための最低限必要な準備を先に進めていきましょう。

つまり、イメージをサイトに落とし込むといっても操作方法も分からないので悶々とします。原稿も初めてなので上手い具合に構成もできないのでさらに悶々とします。どんなジャンルを作ろうと考えても、準備ができてないのでカテゴリーを捻出できない。ただただ時間が過ぎてしまいます。

少し取り組み内容的にはつまらないと思ってしまいますが、あれこれいじるより先にサイトを立ち上げる時に必ず必要になる事から進め、WordPress【Cocoon】の設定に慣れていきましょう。

具体的に何すれば良いの？

• WordPress【Cocoon】初期設定の最低限の理解と設定
• サイトの体を成すために最低限のページ準備
• サイト運営するためのGoogle系サービスの準備
• 画像制作するためのソフト周りの準備

これらは機械的に済ませることができます。また本番公開しながら調整しながら、一連のWordPress【Cocoon】の動きに慣れることができます。深追いするのは後回しにしてくださいね。

まだ公開したくないという場合、後述のGoogle設定を行わなければ検索で見つかることも直ぐにはないかと思います。さらに心配という方は、練習では公開するけど、すぐに非公開等へ切り替えても良いかもしれませんので、考え方に合わせて調整をお願いします。

WordPress【Cocoon】の設定はどれからやれば良いの？

ググりながら自分の管理画面を眺めても、なんとなく動くことはわかるけど、具体的にはよく分からないと思います。慣れてくれば理解できるようになりますので、最初は最低限進めていこうと気持ちを落ち着かせて集中してみてはいかがでしょうか？

• WordPressを本格的に初期設定する前に押さえておくポイント
• サイトを運営していくための最初の骨格づくり

WordPress【Cocoon】で押さえておきたい最低限の機能と用語

WordPressの設定方法は、システム要素、デザイン要素、ラベルやブロック要素などが分かれているようで分かれていないところがややこしかったです。理解するしかないと思いますので、まずは以下のポイントを押さえておきましょう。

投稿一覧（ページを新規作成できます）

投稿とは、ググった時に皆さんがよく見るページです。記事などを書く際はこの投稿ページに書き、どんどん記事コンテンツを増やしていくページ。

カテゴリー・タグ（投稿ページに区分を持たせます）

投稿記事を関連付けする重要な機能。なにも知らずにいじっている時につまづきやすいところでしたので、一旦後回しにしておきましょう。

最初からカテゴリーなどはカチッと決まらないともいます。また、無理な分け方をするとコンテンツ準備も大変になってしまいますのでご注意ください。なので、投稿記事の下書きや構成をいくつか作成した後にでも考えていけば良いかと思います。

固定ページ（ページを新規作成できます）

無限に増やしていくページではなく、サイト内で標準実装するページを作成していくイメージ。例えば、会社HPであれば会社概要、プライバシーポリシーなどのページを作成する時に使います。固定ページを活用して記事やカスタムページは色々とできそうですが、今は難しく考えるのをやめておきましょう。

Cocoon設定（サイト全体、各部分の調整が行えます）

タブをクリックすることで目的ごとの設定ができるページ。「外観」と少し分かりにくいところですが、何か基本的な設定するところとでも覚えておきましょう。

外観（サイト全体、各部分の調整が行えます）

主にいじるのは、「ウジェット」「メニュー」「テーマファイルエディタ」となります。何か組み込む時に設定したり、コードを挿入したりするところとでも覚えておきましょう。

プラグイン（WordPressを拡張させるソフトの追加ができます）

WordPress【Cocoon】プラットフォームに便利な機能をインストールするところで、以降の手順で問い合わせフォームを作る時に利用します。

WordPress【Cocoon】で押さえておきたい最低限の進め方

手順として、WordPress管理画面だけではなく、Googleサービスのページでの登録作業などもあります。これからブログを楽しんでいく未来の時間と比べればわずかな時間ですので、焦らず順に頑張りましょう。

では、以下にて具体的に説明していきます。

Googleアカウントを作成

今後必要になるので、まだ取得していない方は、取得することをお勧めします。既に取得済みアカウントをお持ちの方は、既存アカウントにするか、改めて新規取得するか決めておきましょう。

プライバシーポリシーの原稿準備

個人サイトでも準備しておいた方が良いです。ネットで調べながらサンプルを見つけて下書き原稿を作成しましょう。作成には少し時間が必要になるかもしれません。まずはこの原稿ができてから次の手順へ進んだ方がよいです。初めての原稿となりますので、下書き用としてテキスト編集系のエディタなどを用いた方が良いですね。

固定ページ「プライバシーポリシー」の作成

投稿ではなく固定ページの新規作成からプライバシーポリシーのページを作成しましょう。複雑に考えるのではなく、以下ブロックを利用しながら作成してみましょう。サイト幅などが気になると思いますが、一旦後回しということで。

タイトル	プライバシーポリシーなどページタイトルを記入
見出しH2	各項のタイトルのタイトルを「見出しH2」を利用して入力
段落	各見出しに伴うテキスト情報を入力

固定ページ「お問い合わせフォーム」の作成

サイト運営には必要なページとなりますので、このタイミングで準備を進めておきましょう。このお問い合わせフォームは、サイトに対しての総合受付みたいなもので、投稿記事からコメントをもらうためのフォームではないです。

1. 固定ページの新規作成から進み、タイトルに「お問い合わせフォーム」と入れて作成。
   ※一度、公開しちゃっても良いかと思います。
2. プラグインから新規追加から「contact form 7」を検索してインストール、その後に有効化。
3. 左ナビ「お問い合わせから」からデフォルトの「コンタクトフォーム 1」を編集で開き、そのまま一度保存してください。
4. 再度、「コンタクトフォーム 1」を編集から開き、上部の青帯のショートコードをコピー。
5. 先ほど作成した「固定ページ：お問い合わせフォーム」の編集画面を表示します。タイトル下を一度クリックしてテキストを入力できる状態にしてから、先ほどのコードを貼り付けて更新。
6. 右側のURL箇所からURLをコピー後に別ブラウザへURL貼り付け、お問い合わせフォームを表示してから送信テストしてみてください。メールが管理画面所有者アドレスに届けば成功です。
   ※細かなオプション設定はありますが、それは後回しにしましょう。

固定ページ「サイトマップ」の作成

簡単に作できますので、この段階でさっさと一旦生成してしまいましょう。生成とは、WordPressに「定型コード」を埋め込むだけで簡単にできてしまいます。この定型コードのことを「ショートコード」といいます。ここで使うショートコード以外にも色々ありますので、必要に応じて活用してみてください。

1. 固定ページの新規作成から進み、タイトルに「サイトマップ」と入れて作成。
2. タイトル下を一度クリックして、「　 [sitemap] 　」を貼り付けて保存。
   ※一度、公開しちゃっても良いかと思います。
   ※ショートコード内にオプションを入れることで表示切り替えができます。
   　例）[sitemap page=0]
3. 右側のURL箇所からURLをコピー後に別ブラウザにて表示を確認してみてください。

Cocoon設定から少しだけ調整

本来であれば調整事項はもっとあるかと思いますが、まずは慣れながら進めるという観点で記載しています。各タブごとに調整が終わりましたら、「変更をまとめて保存」ボタンをお忘れなくクリックください。

「全体」タブ

• 「サイトフォント」「文字サイズ」箇所は、標準か少し大小いれる程度で調整。
• 「サイトアイコンフォント」箇所は、「Font Awesome 5」を選択。

「カラム」タブ

コンテンツ幅は800pxだと広すぎるので、少し縮めておく方が良いかもしれないですね。先ほど制作したプライバシーポリシーのプレビューなど参照しながら「コンテンツ幅」箇所を700−780px辺りのお好みで調整してみてください。デザインを入れる時に改めて調整してみてください。

「投稿」タブ

問い合わせフォームとは別に、投稿記事箇所に閲覧者からのコメントフォームを表示or非表示を設定できます。デフォルトでは表示されてしまうので、最初の段階でコメントはまだ不要と思いましたら「コメント設定」「表示」箇所のチェックボックスをOFFにしておきましょう。

「ヘッダー」タブ

「ヘッダーレイアウト」箇所のプルダウンを選択して、お好みのレイアウトを選択してみてください。それ以外の調整は以降の楽しみとして、配置感を掴むというレベルで変更しながら調整してみてください。

外観からフッターメニューを設定してサイトの体裁作り

「外観」→「メニュー」を開いて「新しいメニューを作成しましょう」から新規設定していきましょう。

新しいメニューの画面では、メニュー名に「グローバルフッターメニュー」など入力してから「メニューを作成」ボタンを一度クリックください。

その後、左側の「メニュー項目追加」から、カスタムリンクでホームを追加し、選択でプライバシーポリシーやお問合せなどを選択して設定し、右側の下部「メニュー設定」から「フッター」にチェックを入れて「メニューを保存」してください。

投稿からサンプル記事を２つ３つ作成して公開

「投稿」→「新規追加」から記事を一度公開してみましょう。何か入っていれば良いと思いますので、タイトルに「テスト記事−1から−3」とでも入力して投稿記事を作成してみてください。テキスト情報は適当な文字を入力するだけでOKです。不必要になりましたら削除ください。

パーマリンクの設定方針を決めて調整

固定ページ、投稿ページのURL情報になります。上記で公開したページを見るとURLが日本語表示されているかと思います。このURLを日本語含みで進めるか、英数で統一していくかになります。

どちらでも良いみたいです。ただ、日本語をそのまま利用するとURLを貼り付ける時にエンコードされて「%E&」などの記号で表現されてしまい、URLを別サイトへ貼り付けたりメモしたりする時に必要以上に長くなってしまいます。なので私は英語にしようと思っています。設定場所は投稿、固定ページ共に、右側の概要欄「URL」箇所をクリックして変更ができます。

Googleアナリティクス4（GA4）の設定

サイトへの流入後のアクセス数などを把握するためのwebツールをgoogleが提供していますのでアカウントを開設しましょう。

GA4でのアカウント開設時に発行されたコード（「トラッキングコード」）を「外観」→「テーマファイルエディタ」→右側の「tmp-user」→「head-insert.php」へ発行されたコードを貼り付けます。貼り付け後、「ファイルを更新」ボタンをお忘れなく。更新完了しましたら、Googleアナリティクスの管理画面を見ながら、既に公開したページを遷移しながら表示してみてください。アクセス数が上がり始めていたら成功です。

Google サーチコンソールの設定

サイトへの流入前の検索状況などを把握するためのwebツールをgoogleが提供していますのでアカウントを開設しましょう。特に重要なのが、このサービスでご自身のサイトURLやサイトマップの登録ができ、「Google検索に登録してね」というあくまでも依頼の設定ができます。

ドメインとURLプレフィックスの選択があります。サイト立ち上げ時でサブドメインもないので、私はURLプレフィックスで登録を進めてみました。

SEO的な細かな観点では必要なことはまだあるのですが、サイトとしてはこれで公開されている状況で且つ検索エンジンにも早く来てねの設定が完了できています。細かな調整は必要になるかと思いますが、記事を投稿しながら色々と試してみてください。

さぁー、あとは投稿記事を書いていきましょう

ここまで来ると全体的な準備や調整するべき箇所の概要やポイントなどもわかってくると思います。あとはお好みでWordPressをカスタマイズしながら記事を書いていきましょう。

まとめ

この記事では、Word Press 【Cocoon】の利用を開始したけど、なにか悶々と進まない方向けに、初心者の自分が進めてきた流れを紹介してみました。もちろん先輩ブロガーさんたちが作成した、もっと良い方法もあるかと思います。私もまだ初心者なため完成度が低くお恥ずかしいですが、練習を積み重ねてブラッシュアップしてまいります。一緒に進めていきましょう。

最後まで、お読みいただき誠にありがとうございました。
皆様の楽しみが充実することを願っております。