WordPressによるWebサイト制作のための，究極のレシピ集が登場。制作の現場で使われる定番テクニックからプロ技まで，余すところなく集めました。テーマカスタマイズ／テーマ作成／投稿ページ・固定ページ／一覧ページ／ヘッダー・フッター／カスタム投稿タイプ／カスタムフィールドなど，目的別にレシピを整理。「あのしくみはどう作るんだろう？」が，スグにわかります。Webサイト運営者からWebプログラマーまで，WordPressを扱うすべての方にお届けします。WordPress 5.xに対応。
こんな方におすすめ
- WordPressの入門レベルを卒業しているひと
- WordPressサイトを自分でカスタマイズしたい管理者のかた
- WordPressのユーザーからサイト制作者にレベルアップしたいひと
書誌情報
書名 『WordPressデザインレシピ集』
ISBN-13 978-4-297-10778-9
著者 狩野祐東
刊行 2019年 8月 24日
仕様 672ページ、A5判
価格 本体 2,780円＋税
発行 技術評論社
本書が取り上げられました！
目次
Chapter 1 WordPressの基本と環境設定のテクニック
「WordPressとはなに？」「WordPressの動作環境は？」「そもそもWordPressってどういうもの？」WordPressを使ってWebサイトを構築するにあたり、基本的な知識と最低限知っておくべき操作をまとめました。
- 001WordPressってどんなもの？
- 002WordPressでどんなサイトが作れるの？
- 003WordPressの管理画面でどんなことができるの？
- 004WordPress導入のメリット・デメリット
- 005サイトを公開するまでの作業の大まかな流れを知りたい
- 006サイトを作る・運用するのに必要な知識を知りたい
- 007WordPressの料金や利用規約（ライセンス）を知りたい
- 008WordPressの動作環境を知りたい
- 009WordPressをインストールしたい
- 010データベースの接頭辞を変えたい
- 011管理画面にログインしたい・ログアウトしたい
- 012管理画面の全体像を知りたい
Chapter 2 コンテンツ投稿のテクニック
WordPress 5.0から、コンテンツを投稿するためのエディターが新しくなり、操作方法もガラッと変わりました。
この章では、新エディターを使ったコンテンツの作成方法を中心に、記事を作成、編集、投稿するときの操作方法を目的別に紹介します。
ただ、当面は旧型のエディターを使用してサイトを更新するケースも多いことが予想されます。新エディターだけでなく、旧エディターでの編集方法も詳しく解説します。
- 013WordPressで投稿できるページの種類を知りたい
- 014記事を投稿したい
- 015記事にカテゴリーやタグを追加したい
- 016固定ページを投稿したい
- 017すでにある投稿や固定ページを編集したい
- 018公開設定について詳しく知りたい
- 019投稿を前の状態に戻したい
- 020新エディターの特徴を知りたい
- 021新エディターと旧エディターのどちらを使えばよいか知りたい
- 022新エディターの基本的な操作方法を知りたい①
- 023新エディターの基本的な操作方法を知りたい②
- 024追加できるブロックの種類を知りたい
- 025旧エディターの基本的な操作方法を知りたい
- 026ビジュアルモードで記事を編集したい
- 027テキストモードで記事を編集したい
- 028リンクを設定したい
- 029投稿に画像を追加したい
- 030ギャラリーやカバーを追加したい
- 031HTMLタグを入力したい
- 032「続きを読む」を挿入したい
- 033ページ区切りを挿入したい
- 034Instagramの写真を埋め込みたい
- 035最新の記事一覧を挿入したい
- 036再利用ブロックを使いたい
- 037抜粋を追加したい
- 038固定ページのパーマリンクを設定したい
- 039固定ページの親ページ・子ページを設定したい
- 040カテゴリーを作成したい・整理したい
- 041自動で設定されるカテゴリーを変更したい
- 042アイキャッチ画像を追加したい
- 043記事ごとのコメント設定をしたい
- 044WP Multibyte Patchとはなにか知りたい
- 045プライバシーポリシーページを作成したい
Chapter 3 サイト全体の設定をするテクニック
管理画面でサイト全体に関わる設定をする方法を紹介します。サイト全体の動作やページの階層構造を決める設定から、記事を投稿するときの設定、プラグインのインストール方法など、一度サイトを公開したあともよく使う操作を集めています。
- 046サイトの基本情報を設定したい
- 047ホームページに表示されるコンテンツを設定したい
- 048一覧ページに表示される投稿数を変更したい
- 049パーマリンクを設定したい
- 050テーマをインストールして見た目をがらっと変えたい
- 051テーマを削除したい
- 052テーマカスタマイザーを使ってサイト全体の設定をしたい
- 053サイトのナビゲーションを作成したい
- 054ウィジェットを使ってコンテンツを追加したい
- 055基本的なディスカッションの設定方法を知りたい
- 056プラグインをインストールしたい
- 057WordPress本体を更新したい
Chapter 4 既存テーマのカスタマイズテクニック
本章では既存のテーマ——公式テーマからダウンロードしてきたものやすでに運用しているWebサイトのテーマ——をカスタマイズして、デザインを調整する方法を紹介しています。
- 058HTMLの基礎知識
- 059CSSの基礎知識
- 060HTML，CSSのソースコードを解読したい
- 061WordPressのフォルダとファイルの構成を知りたい
- 062子テーマを作成したい
- 063テーマにサムネイル画像を追加したい
- 064子テーマのCSSを編集したい
- 065既存テーマのHTML部分をカスタマイズしたい
- 066表示されているページに使われているテンプレートを知りたい
Chapter 5 テーマ作成の基本テクニック
テーマを新規に作成する場合、はじめにページの静的なHTMLファイルを作って、それをテーマに変換するという作業の流れでおこなうのが一般的です。ここではそうした、テーマを新規に制作する場合のテクニックを、作業の流れの順に紹介しています。
- 067PHPの基礎知識
- 068WordPressの基本的な動作の仕組みを知りたい
- 069テーマ作成に必要なスキルを知りたい
- 070一般的なサイト制作のワークフローを知りたい
- 071テーマ用HTML，CSS作成の注意点を知りたい
- 072新規テーマ作成の準備をしたい
- 073HTMLファイルからテーマを作成したい
- 074テンプレートタグとはなにか知りたい
- 075functions.phpとはどういうものか知りたい
- 076style.cssの書式を知りたい
- 077style.cssを読み込みたい
- 078ページのヘッダー部分を分離したい
- 079ページのフッター部分を分離したい
- 080ページの文字コードを設定したい
- 081ページ全体の言語を<html>タグに出力したい
- 082<title>タグにタイトルを表示したい
- 083<body>タグにclass属性を追加したい
- 084テーマで使う画像をまとめたい
- 085テーマで使う画像をページに表示したい
- 086CSSに記述する背景画像のパスを知りたい
- 087要素に背景画像を適用したい
- 088<img>タグで画像を表示したい
- 089ループとは何か知りたい
- 090フロントページにコンテンツを表示したい
Chapter 6 ページのバリエーションを増やすテクニック
個別投稿ページ、一覧ページ、固定ページ…WordPressには大きく分けて3 種類の「ページ」があります。これらのページを表示するために必要な、テーマ作成のテクニックを紹介します。
- 091WordPressのページのタイプを知りたい
- 092投稿ページ用のテンプレートを作りたい
- 093サイドバーを分離したい
- 094投稿ページにコンテンツを表示したい
- 095固定ページ用のテンプレートを作りたい
- 096一覧ページ用のテンプレートを作りたい
- 097一覧ページから各投稿ページにリンクしたい
- 098ホームページにリンクしたい
- 099固定ページにリンクしたい
- 100カテゴリー別一覧ページにリンクしたい
Chapter 7 標準的な機能をテーマに組み込むテクニック
アイキャッチ画像の表示からRSSフィードの配信まで、WordPressには追加的な機能がいろいろあります。こうした機能をテーマに組み込んで、より充実したWebサイトにするテクニックの数々を紹介します。
- 101アクション，フィルターがどういうものか知りたい
- 102外部サイトからJavaScriptファイルを読み込みたい
- 103テーマフォルダ内にあるJavaScriptファイルを読み込みたい
- 104アイキャッチ画像を登録できるようにしたい
- 105アイキャッチ画像をページに表示したい
- 106アイキャッチ画像のサイズを指定して表示したい
- 107アイキャッチ画像にclass属性を追加したい
- 108アイキャッチ画像がないときには別の画像を表示したい
- 109カスタムサイズのアイキャッチ画像を登録したい
- 110カスタムサイズのアイキャッチ画像を表示したい
- 111RSSフィードを配信したい
- 112HTML5書式を有効化したい
- 113FontAwesomeを使えるようにしたい
Chapter 8 投稿ページ・固定ページの作成テクニック
投稿ページや固定ページを作成するさまざまなテクニックを紹介します。投稿や固定ページには、タグ、カテゴリー、作者名などさまざまな情報が含まれています。これらの情報をページに表示させる方法や、コメント欄、お問い合わせフォームの設置など一般的な投稿とは少し異なるコンテンツを表示させる方法を紹介します。
- 114テンプレート階層について知りたい
- 115投稿の公開日を表示したい
- 116投稿の公開時刻を表示したい
- 117日時の表示フォーマットを設定したい
- 118投稿のタグを表示したい
- 119タグの表示フォーマットを変更したい
- 120投稿のカテゴリーを表示したい
- 121複数のカテゴリーを並べて表示したい
- 122タイトルの横にカテゴリーを表示したい
- 123投稿のパーマリンクを表示したい
- 124投稿作者の名前を表示したい
- 125投稿作者のWebサイトにリンクしたい
- 126投稿作者のプロフィールを表示したい
- 127ページ分割に対応したい
- 128ページ分割リンクの表示をカスタマイズしたい
- 129前後の投稿にリンクしたい
- 130前後の投稿へのリンクの表示をカスタマイズしたい
- 131Webサイトのホームページを作成したい
- 132ホームとは別にブログのトップページを作成したい
- 133固定ページのテンプレートを作成したい
- 134特定の固定ページ向けの専用テンプレートを作成したい
- 135エラーページを作成したい
- 136投稿ページにコメント機能を追加したい
- 137コメントの受付を終了したら「終了しました」と表示したい
- 138お問い合わせページを作りたい
Chapter 9 一覧ページの作成テクニック
一覧ページを作成するためのテクニックを紹介します。抜粋やページネーションなど、一覧ページに特有の機能を組み込む手法のほか、サイト内検索を実装し、検索結果ページを作成する方法も取り上げます。
- 139一覧ページについて詳しく知りたい
- 140汎用的な一覧ページを作成したい
- 141記事がないときには別のコンテンツを表示したい
- 142一覧ページに抜粋を表示したい
- 143抜粋で表示される文字数を変更したい
- 144抜粋の末尾に表示される[…]を変えたい
- 145一覧ページにページネーションを追加したい
- 146ページネーションに表示するページ番号を増やしたい
- 147ページネーションの表示をカスタマイズしたい
- 148カテゴリー別の一覧ページにタイトルを表示したい
- 149作者別一覧ページを作成したい
- 150日付ごとの一覧ページを作成したい
- 151タグの一覧ページを作成したい
- 152検索フォームを組み込みたい
- 153検索結果ページを作成したい
Chapter 10 ヘッダー・フッター・サイドバーを作り込むテクニック
カスタムメニュー機能の有効化や各ページへのリンク、パンくずリストの設置など、ページのヘッダー部分やフッター部分でよく使われるテクニックの数々を紹介します。
- 154サイトのファビコンを設定したい
- 155サイトのタイトルをヘッダーに表示したい
- 156フッターにRSSフィードへのリンクを設置したい
- 157カスタムメニューを登録したい
- 158カスタムメニューをヘッダーに設置したい
- 159カスタムメニューのHTMLを調整したい
- 160ヘッダーとフッターにカスタムメニューを設置したい
- 161ウィジェット領域を定義したい
- 162サイドバーにウィジェット領域を設置したい
- 163複数のウィジェットを有効化したい
- 164ふたつのサイドバーで3コラムレイアウトを作りたい
- 165パンくずリストを表示したい
- 166パンくずリストを「フロントページだけ」表示しないようにしたい
- 167プライバシーポリシーページにリンクしたい
Chapter 11 カスタム投稿タイプを使いこなすテクニック
テーマを「カスタム投稿タイプ」や「カスタムタクソノミー」に対応するためのテクニックを取り上げます。カスタム投稿タイプはある程度以上のサイトを作るときには必ずといってよいほど使う重要な機能ですが、デフォルトでは有効になっていないことや、そもそも何なのかがなかなか理解しづらいため、苦手意識を持つ方が少なくありません。本章では、できるだけ簡単にカスタム投稿タイプに対応させて、有効に活用する方法を紹介します。
- 168カスタム投稿タイプとは何かを知りたい
- 169カスタム投稿タイプを作成したい
- 170カスタムタクソノミーとは何かを知りたい
- 171カテゴリー型のカスタムタクソノミーを作成したい
- 172タグ型のカスタムタクソノミーを作成したい
- 173もともとある「タグ」をカスタム投稿タイプでも使いたい
- 174カスタム投稿タイプの投稿をサイト内検索に含めたい
- 175カスタム投稿タイプの個別投稿ページを作成したい
- 176カスタム投稿タイプの一覧ページを作成したい
- 177一覧ページで投稿タイプ名を取得・表示したい
- 178個別投稿ページで投稿タイプ名を取得・表示したい
- 179投稿に割り当てられたタクソノミー項目を取得・表示したい
- 180タクソノミー項目が割り当てられているかどうかを調べたい
- 181カスタム投稿タイプの一覧ページにリンクしたい
- 182カスタム投稿タイプの個別投稿ページにリンクしたい
- 183特定のタクソノミー項目の記事を一覧表示したい
- 184タクソノミー一覧ページでタクソノミー名を表示したい
- 185タクソノミー一覧ページでタームを表示したい
- 186カスタム投稿タイプの投稿をRSSフィードに含めたい
Chapter 12 カスタムフィールドを使いこなすテクニック
「カスタムフィールド」は、投稿にタイトルやコンテンツ以外の入力欄を追加する機能です。おもにカスタム投稿タイプと一緒に使われ、ECサイトの商品紹介などある程度決まったフォーマットで多数のコンテンツを作成する必要があるときに効力を発揮します。本章ではカスタムフィールドを作成し、入力内容をページに表示させる方法について詳しく説明します。
- 187カスタムフィールドとは何かを知りたい
- 188投稿画面にカスタムフィールドを追加したい
- 189カスタムフィールドのテキスト入力欄を作りたい
- 190カスタムフィールドのチェックボックス欄を作成したい
- 191カスタムフィールドで画像のアップロードをしたい
- 192カスタムフィールドに入力したテキストをページに表示したい
- 193チェックボックスがついた項目だけを表示したい
- 194カスタムフィールドで登録した画像を表示したい
- 195カスタムフィールドの値を確認したい
- 196ページのディスクリプションを設定したい
- 197ページに固有のCSSを追加したい
Chapter 13 最新記事や関連する記事を一覧表示するテクニック
サイトのホームページ（トップページ）には、投稿ページの一覧だけでなく、カスタム投稿タイプの一覧などを載せたいことがあります。ページに複数のループを組み込んで、多様な一覧を表示させるテクニックのほか、独自ショートコードの作成など、より高度なWebサイトを作成したいときに役立つテクニックを紹介します。
- 198ホームに異なる種類の投稿を同時に表示したい
- 199一度に表示する投稿の件数を変更したい
- 200ホームに特定のカテゴリーの最新情報を表示したい
- 201ホームにカスタム投稿タイプの投稿を表示したい
- 202ループ部分を別ファイルにしたい
- 203ショートコードを自作したい
- 204テキストを書き換えられるショートコードを作りたい
- 205表示するボックスのタイトルや色を設定できるショートコードを作りたい
Chapter 14 運営・メンテナンスのテクニック
Webサイトは、いったん公開した後も、新しい情報を掲載したり、使いづらいデザインを修正するなどして情報の鮮度を保ち、多くの人に使ってもらうよう常に“アップデートする”ことが重要です。この章では、WordPressで構築したサイトを運営、管理するために重要なテクニックの数々を取り上げます。
- 206ユーザーを登録・追加したい
- 207権限グループについて詳しく知りたい
- 208ディスカッション設定を詳しく知りたい
- 209コメントスパムを削除したい
- 210更新情報を通知する必要はあるのか知りたい
- 211メールで投稿できるようにしたい
- 212スマートフォンから投稿できるようにしたい
- 213サイトの表示を高速化したい
- 214サイトをバックアップしたい
- 215データベースをエクスポートしたい
- 216データベースをインポートしたい
- 217データベースを直接操作してデータを復元したい
- 218SNSのボタンを表示したい
- 219Googleアナリティクスでアクセス状況を把握したい
- 220サイトマップ（sitemap.xml）を出力したい
- 221Google Adsenseを挿入したい
- 222サイトの安全性を高めたい
Chapter 15 開発環境構築のテクニック
WordPressのテーマをカスタマイズしたりプラグインを導入したりするとき、小規模なサイトであればオンラインに公開されているものを直接編集しても問題はないかもしれません。しかし、ある程度以上の規模のサイトを構築・運営するときは、作業用のパソコン（ローカル環境）でファイルを編集して動作確認をしてから、公開したほうがよいでしょう。本章ではローカル環境の構築を中心に、WordPressサイトを開発、運営するのに便利なテクニックの数々を紹介します。
- 223ローカル開発環境を構築したい
- 224ローカル開発環境でメール送信を確認したい
- 225ローカル開発環境のSSLを有効化したい
- 226デバッグモードを有効化したい
- 227オンラインでテーマを開発したい
- 228テーマを作るためのダミーのデータをインポートしたい
- 229開発に便利なプラグインを知りたい
- 230WordPressをコマンドラインで操作したい