Fukasawa WordPressテーマのカスタマイズ方法

Fukasawa(WordPressテーマ)のカスタマイズ

Fukasawa は写真家やコレクター向けの最小限の石積みスタイルのブログテーマです。レスポンシブ対応のデザイン、ブロックエディター/グーテンベルクのサポート、画像のサポート、ギャラリーおよびビデオ投稿フォーマット、4つのカスタムウィジェット、アーカイブページテンプレート、ギャラリースライドショー、カスタムアクセントカラーのサポート、カスタムロゴのサポート、およびエディタースタイルが特長です。

Fukasawa をカスタマイズするには、大きく分けて機能とデザイン性をカスタマイズすることになります。どちらも手段が複数ありますので、事前に理解して取り組まれるとよいでしょう。特にテーマのコードを直接編集する方法はリスクも高いので、よく理解されている方以外にはおすすめできません。

Fukasawa の概要

Fukasawa の特徴はブログトップページが記事の一覧表示がリスト表示ではなくタイル(石積み)表示のテーマです。テーマディレクトリからインストールできるテーマです。記事はページ先頭部にアイキャッチ画像が自動で挿入されます。

wordpress.orgFukasawa
バージョン2.0.5
最終更新日2020年8月23日
有効インストール10000+
PHPバージョン5.6以上
Fukasawa 作成者サイト
Fukasawa の概要

Fukasawa をインストールするにはダッシュボードから外観 → テーマ → 新規追加 → Fukasawaで検索しインストールを開始します。

Fukasawa のカスタマイズ

Fukasawa をカスタマイズする方法は大きく分けて、テーマカスタマイザーを使う、cssの追加をする、直接テンプレート(PHP)ファイルを書き換えるになります。プラグインを利用すると素早く安全にカスタマイズすることも可能です。

プラグインを利用するにしても、直接テンプレート(PHP)ファイルを書き換えるにしてもリスクが発生するので、バックアップ環境は整えておかれることを推奨します。

Fukasawa をカスタマイズするには下記の手順で行います。

  1. WEBサイトの構成を考える (※注1)
  2. 不要な機能を削除する
  3. 必要な拡張機能(プラグイン)を追加する
  4. グローバルナビゲーションやサイドメニューを作る
  5. TOPページを作る
  6. 会社案内ページを作る
  7. 事業内容ページを作る
  8. お知らせや、ブログ(製品やサービスをカテゴリーに構成する)を設置する

※ 注1)固定ページ・投稿ページのコンテンツを書き出す。そしてカテゴリーやタグを振り分ける。などの設計書・制作ガイドラインを作成しておくと作業をスムースに進めることができ、修正が発生しても最小限の工程で完結できるようになります。

Fukasawa のテーマカスタマイザーでは、色や背景画像、メニューやウィジェットに設置する内容などをカスタマイズします。Fukasawa は以下の内容がカスタマイズできます。

サイト基本情報サイトのタイトルとキャッチフレーズを設定できる
アクセント色を選択
メニュー表示は1ケ所
ウィジェットサイドバー
ホームページ設定固定ページか新着情報
追加CSSスタイルシートを追加
Fukasawa の テーマカスタマイザー

Fukasawa のカスタマイズはいろいろな方法があります。WordPressの管理画面からカスタマイザーを利用してフォントや色、レイアウトなどをカスタマイズする方法。CSSを追加してカスタマイズする方法。プラグインをインストールして機能をカスタマイズする方法。「テーマーの編集」から直接編集する方法などがあります。

Fukasawa に css(スタイルシート)を追加

Twenty Twenty に css(スタイルシート)を追加
Twenty Twenty に css(スタイルシート)を追加

部分的に色を変更したり、文字の大きさを変更したりしたいのであればcss(スタイルシート)を追加することになります。cssの(スタイルシート)を追加する場合は、テーマカスタマイザーの「css追加」を利用するか、テンプレートファイルの「style.css」に追加することになります。

テーマカスタマイザーの「css追加」は複雑なコード編集は苦手ですが、テーマの更新に上書きされることはありません。逆にテンプレートファイルの「style.css」は上書きされるので、子テーマで対応するか、バックアップをとり対応するかになります。

テンプレートファイル(PHP)のカスタマイズ

Fukasawa のテンプレートファイル(テーマファイル)、テーマファイルエディタで編集

  • テーマのための関数
  • 404テンプレート
  • コメント
  • content.php
  • テーマフッター
  • テーマヘッダー
  • 画像添付テンプレート
  • メインインデックスのテンプレート
  • pagenation.php
  • 単一テンプレート
  • readme.txt

テンプレートファイルを直接編集してカスタマイズすることもできます。ただ、この方法は高度な知識を必要とされますので、十分な知識をお持ちの方におすすめなります。記述ミスによって画面が表示されなくなったり、管理画面にログインすらできなくなったりすることもあります。

Fukasawa をプラグインでカスタマイズ

公式テーマは審査後公認され無料で利用できるようになります。基本部のみの配信のため拡張機能を利用したい場合はプラグインで機能を拡張させることになります。

Table of Contents Plusページ内のコンテンツの目次を作成
All in One SEO PackSEOを一括して設定
WP Multibyte Patchマルチバイト文字の修正(コンタクトフォームを利用するなら必須)
Duplicatorサイトを丸ごとコピーしてバックアップ
WP Maintenance Modeメンテナンス中であることを表示
Pz-LinkCard外部リンクをカード形式で表示
WP-Optimizeデータベースをクリーンアップ
Insert Pagesページ内に文章を埋め込む
RedirectionURLをリダイレクト
Broken Link Checkerリンク切れをチェックする
カスタマイズに使いたいプラグイン

Fukasawa のウィジェット

Fukasawa のウイジェットエリアはサイドバーのみになっています。(ウイジェットとはサイドバーにメニューやカテゴリー新着記事などを簡単に追加・追加できる拡張機能です。

ヘッダーやサイドバー、フッターなどのウィジェットエリアと呼ばれる場所に配置されます。検索ボックスやメニュー、カテゴリやタグ、最新の記事、カレンダーなどの機能をドラッグ&ドロップで簡単に実現できます。