Blog

デザインとフロントエンド担当ヒロトの開発ブログです。
今回は WordPress 初期構築の段階でいつもやっていること & ビギナーのとき知りたかったことをいつくか書いておきます。

* あくまで僕個人のメソッドなので、ふぅーん程度に思ってください

固定ページの「サンプルページ」を「トップページ」にする

インストール時から存在するサンプルページくん、削除するのも面倒もったいないので有効活用してあげましょう:

  • 名前を「トップページ」に変更
  • スラッグも home や top に変更
  • 設定 > 表示設定の「ホームページの表示」を「最新の投稿」ではなく固定ページ > 「トップページ」へ

「サンプルページ」は最初から公開状態になっています。放置すると検索結果に出てしまうので、使わないのであれば下書き、非公開あるいは削除。(ページ ID も 2 と綺麗なので個人的に好きです)

テーマ関数に機能追加

テーマ関数(functions.php)には、いつもミニマムこれらを追加してる気がします:

add_theme_support( 'title-tag' ); // タイトルタグ。必須。Yoast SEO で必要だったかな
add_theme_support( 'post-thumbnails' ); // アイキャッチ。必須。
add_theme_support( 'menus' );  // WP メニュー。ほぼ必須。

add_post_type_support( 'page', 'excerpt' ); // 固定ページでも抜粋使えるようにする。たまに便利。

パーマリンク設定

カスタム構造を選んで /%category%/ を間に追加

/%category%/%postname%/

こうすることで、(いまこのホームページは改修中なのでまだそうなってないですが)

masudakohboh.com/blog/post-name
masudakohboh.com/news/post-name
masudakohboh.com/work/post-name (こっちはカスタム投稿タイプだけども)

のような形になってどのカテゴリの記事なのか判別でき、構造もフォルダ分けのようになって綺麗だと思います。

ただ、日本語環境では日本語で記事タイトルを入力したとき記事のスラッグもそのまま日本語になってしまうので、たとえば新規投稿の下書き保存時に自動的に記事 ID に書き直す処理をテーマ関数に追加するなどもう一手間必要です。

プラグイン追加

以下、なくても動作はしますが毎回気づいたら入れてるやつ:

  • WP Multibyte Patch
    • ファイル名に日本語名が入ってるメディアをアップロードしても英数字に変換してくれる
    • すでにアップロードされているメディア名は変わらないので、初期の頃からインストールしておくのが吉
    • これが無いことによるエラーにはまだでくわしたことはないですが、URL 変換されたファイル名を見ると僕の OCD をトリガーするので最近の新規案件には必ず入れてます
  • Yoast SEO
    • 基本的な SEO 向けタグ生成してくれる
    • タイトルタグや検索結果の見た目もカスタム設定できるので、管理画面での記事名とは別にオモテ向きの <title> 文字設定できるところが便利
    • メタディスクリプションも設定できる
    • 記事別、投稿タイプ別に検索結果に表示しないように設定もできる(プライバシーポリシーとか)
    • 記事コンテンツの SEO チェックしてくれる(画像の ALT が抜けてるよーとか)
    • 「こら、ソースコードに SEO タグ直接書くんじゃない!」
  • Yoast Duplicate Post
    • ワンクリック記事複製ボタン追加。地味に助かる
  • Custom Post Type UI
    • カスタム投稿タイプ作るやつ。「イベント」、「ポートフォリオ」、「プロダクト」のようにデフォルトの「投稿」とは分けて管理したいときに。ブログやお知らせ系ではない内容の投稿が他に1つでも必要なら確定インストール
    • テーマ関数でもカスタム投稿タイプ作れますが、違うテーマに切り替えると使えなくなるのとコードの入力が手間
    • このプラグインは設定を単体でエクスポートできるので本番サイトに移植したりバックアップ取ったりするのが簡単
  • SVG Support
    • SVG ファイルをアップロードできるようになる。ぼくみたいなSVG 大好きマンには必須
  • Theme Switcha
    • より正確にテーマプレビューできる
    • 標準の「テーマ」の「プレビュー」はサイドバーついてるしリンク移動の挙動変だし使いづらい
  • All In One WP Migration
    • バックアップとデータの引越しに
    • エクスポート時、メディアなし、テーマなし、文字置換など、便利なオプションが満載
    • 最新バージョンは取り扱えるデータサイズが結構小さいので、制限の緩い古めのバージョン推奨。ベータ機能扱いだったけど任意のディレクトリ除外できるやつがあって便利だったなぁ…
  • Advanced Custom Fields や Custom Field Suite
    • カスタム項目追加します。すさまじく便利。
    • ソースコードにプレーンテキストをダイレクトに書くのはよろしくないので、最近はこの子たちを使ってすべて記事編集ページから変更できるようにしてます。多少 WP の操作に慣れていれば他の人でも変更できるので情報更新するときラク
    • ACF は有料版じゃないと繰り返し項目が使えないので、そこは CFS を活用
    • 「こら、テンプレートファイルに直接テキストを打ち込むんじゃない!」

とりあえずこんな感じでしょうか。今回はこの辺で!

CONTACT

masuda google maps

698-0025
島根県益田市あけぼの西町3-14

0856-25-7651

0856-25-7653

tokyo google maps

151-0066
東京都渋谷区西原2-35-1,
ブランエール代々幡103

03-5539-8835