WordPress童貞がWebサイトを完成させるまで<後編>

さてさて。Wordpress童貞の皆さま。笑
前回は「Wordpressの立ち上げから→テーマ選択→子テーマ作成」までを説明したけど、今回はその後の「カスタマイズ」について書いていきたいと思います。
▼Wordpress童貞がWebサイトを完成させるまで<前編>
https://hajimekadoi.com/wp-biginer-first-part
WordPress童貞のあなたは、カスタマイズって一言で言われても「何をカスタマイズせなアカンねんな。」って感じになりますよね。笑
だから、今回は「Webサイト」として機能する最低限の部分のカスタマイズにフォーカスして話していきたいと思います。僕が歩んできた道のりが、誰かのヒントになれば幸いです。
プラグインをインストール
まずはここから。Wordpressにはプラグインっていう便利なモノがあって。わざわざコードを書かなくても色んな機能を追加することができるような、僕たちみたいなプログラミング初心者には最高の機能が搭載されているんです。
ありがたや。
インストールの仕方は「ダッシュボード→プラグイン→新規追加」って流れで好きなプラグインを簡単にインストールすることができます。
個人的に必須と思ってるプラグインは、
・All in one seo pack
・TinyMCE Advanced
・Contactform7
この3つです。俺は他にもインストールしてるけど、最低限必要なのはコレです。
All in seo packは、その名の通り「SEO対策」の為に必須のプラグイン。
TinyMCE Advancedは、記事投稿を簡単にしてくれるプラグイン。
Contactform7は、簡単にお問い合わせフォームを準備できるプラグイン。
最低この3つさえあれば、Webサイトとして機能する事は間違いないらしい。
ただし、ここでそれを説明したら、一個で一つの記事分の文章量になってくるんで、この道のプロフェッショナルである「バズ部」様に教えてもらってくだされ。バズ部は最高でござる。
▼バズ部
https://bazubu.com/category/wordpress
ナビゲーションメニューを決める
ナビゲーションメニューってなに?って簡単に言えば、このサイトの上部にあるメニューの部分がそれにあたります。
この部分は、最初にテーマを有効化した段階では、全くの表記されてないんです。
僕はなぜか表記されているものやと思ってました。笑
ここの設定の手順は、
・固定ページで各ページを準備する。
・メニューで構造を決める。
この2つさえクリアすれば準備できます。
一つ一つ説明していきます。
固定ページで各ページを準備する
準備の仕方はかなり簡単。
「ダッシュボード→固定ページ→新規追加」って流れで、編集のページに行けます。
このページまで飛べたら、あとは内容を決めるだけ。
一番上にある入力欄がそのページの題名になるので「会社案内」やら「ブログ」やら「お問い合わせ」やらそれに則した題名を決める。
そのあと、下の入力欄に必要な内容を明記していけばOKです。
ちなみに、最初の段階では「ビジュアル」の部分に「フォントサイズ」とかのメニューはないと思うけど、これは前述にある「TinyMCE Advanced」ってプラグインで設定しとります。これがなかったら僕は投稿すらできません。。笑
メニューで構造を決める
固定ページの準備ができたら、あとはメニューで表示する順番とかを決めればOK。
メニューは「ダッシュボード→外観→メニュー→メニューの編集」で設定することが出来ます。
この左の項目にある「固定ページ」を開いて、任意のページを右側に当てはめていくだけで完成するって感じです。
僕の場合は、「About,Service,Works,Blog,Contact」をナビゲーションメニューに設定したいから、それを当てはめたって事。でWebサイトに上から順番に左詰に設置されていくから、好みの順番に設定すれば完了です。
これで「ナビゲーションメニュー」の設定はOKです。
見出しについて
さて。今までの流れで、もう外見はかなりWebサイトっぽくなってきたと思うけど、ブログに記事を投稿していかないと、循環のない残念な寂しいサイトになってまう。これは避けたいです。笑
で。文章を書き出して最初にぶつかる壁が「見出し」ってやつだと思います。
見出しのカスタマイズ
まずはカスタマイズから。
見出しって、みんなオシャレにデザインしてますよね。でも、これって最初は大文字でしか表示されへんのです。それやったら表情がないし、面白くないですよね。
で。そのためには上の画像のように「カスタマイズ」しないといけません。
それを助けてくれたのが「Free Time Network」っていうサイトです。この人の説明は半端なくわかりやすい。バカな僕でも「見出し」を設定することができたのは、このサイトのおかげです。笑
▼Free Time Network
http://freetimenetwork.com/wpftn/original-midashi-1314.html
見出しの順番
最後に「見出し」の順番について。
これって意外と見落としてしまいがちなんですけど、ここでミスると「SEO」的に残念な結果になるらしい。
見出しって、「見出し1、見出し2、見出し3・・・・・」って感じで順番があって、その順番を間違えたり、ルールとは違う事をしてしまうとサーバー側が上手くクロールしてくれないらしいです。クロールってなんやねん。って話なんですけど。笑
まぁややこしい話は置いといて、「SEO」的によろしくないって感じで捉えててください。笑
テキストテキストテキスト
見出し2
テキストテキストテキスト
見出し3
テキストテキストテキスト
見出し2
テキストテキストテキスト
こんな感じで、「見出し2→見出し2→見出し3→見出し2」って流れなら問題はないらしい。「見出し1」は基本的には「タイトル」で使ってるんで、文章内には含まない方がいいらしいです。
なんか「見出し1」は1記事につき一つって決まってるんです。
この表を見ても多分、何が正解で何が間違いか分からないと思うので、以下の失敗例を見て下さい。
テキストテキストテキスト
見出し3 ←最初に「見出し3」が来ることはない。普通、最初の見出しは「見出し2」。
テキストテキストテキスト
見出し2
テキストテキストテキスト
見出し2
テキストテキストテキスト
失敗例はこんな感じです。
他にも「見出し2→見出し4→見出し2」とかもアウトらしいです。
要するに「正しい順番で見出しを使ってくれ」って事ですね。
▽補足
「見出し1」が自分の使用してるテーマで、実際にタイトルで使われてるかどうか確認したければ、その記事のプレビューか、自分が書いた過去の記事まで飛んで「表示→開発・管理→ソースを表示」で確認できます。
Macを使用している人は、そのソースを表示させたら「Command+F」で「h1」を検索かけたらすぐに見つける事ができるはずです。
最後に
WordPress童貞の旅もここまでです。
ここまできたら、あとはその運営を続けていくだけですな。
WordPressは奥が深いから、僕もまだまだ分からへん部分がアホみたいにありますし、戸惑う部分もめちゃくちゃあるけど、随時ググって問題解決していけばなんとかなります。
「根性・根気・粘り強さ」で共に乗り越えましょう。結局最後はそれです。笑
最後まで見てくれた人はありがとうございます。
WordPress童貞万歳!!!笑