Twenty Twenty-Twoテーマのことを知りたい！で勝手に立ち上げた本デモサイトで行っている、TT2テーマへカスタマイズした内容、使用しているプラグイン、自身で作成した子テーマの機能概要です。
※現在の情報です
使用しているプラグイン
本サイトで使用しているプラグインです。
※KBは私が作成しているサイトの紹介ページです
| プラグイン名 | 紹介ページ | プラグインの主な機能 |
|---|---|---|
| XML Sitemap & Google News | ＫＢ ・ 公式 | XML形式のサイトマップを自動生成してくれます |
| Imsanity | ＫＢ ・ 公式 | アップロードした画像を圧縮してくれます |
| WebP Express | ＫＢ ・ 公式 | 画像をwebP形式で出力してくれます |
| WP File Manager | ＫＢ ・ 公式 | FTPの代替として、カスタマイズ時のファイル転送で使用しています（必要時のみ有効にしています） |
| WEN Featured Image | ＫＢ ・ 公式 | 管理画面でアイキャッチ画像の変更が簡単にできます （必要時のみ有効にしています） |
| Sticky Block | ＫＢ ・ 公式 | スクロールしても固定表示されるブロックを作成できます |
| Optimize Database after Deleting Revisions | ＫＢ ・ 公式 | 定期的に自動でデータベースの掃除をしてくれます |
| WP Revisions Control | ＫＢ ・ 公式 | テーマファイル・投稿などのリビジョン数を制限してくれます |
| Analytics Insights for Google Analytics 4 (AIWP) | ＫＢ ・ 公式 | Google Analyticsのアクセス解析データをダッシュボード上で確認できます |
| Custom Post Type UI | ＫＢ ・ 公式 | カスタム投稿タイプを管理するために使用しています |
独自に行っている機能追加
※リンクのあるものは、本サイト内、私が管理する他のサイトのリンク先ページで導入方法などを紹介しています
独自の機能追加は、こちらで配布している子テーマを有効化した上で、コードの追加などを行っています。
プログラムの追加
| 機能 | 機能の説明 |
|---|---|
| SEOフィールド | 投稿（固定ページ）編集画面へカスタムフィールドフォームを設置し、入力した値を「title」「description」「keywords」タグでヘッダーへ出力するようにしています |
| 絵文字の不使用 | 標準で読み込まれる絵文字機能を無効にしています |
| ログインをメールアドレスに限定 | さまざまな方法で明らかになってしまうユーザーIDを使ったログインを禁止するようにしています |
| 作者スラグの変更 | 作者の投稿一覧などでURL上に表示されてしまう作者スラグを任意の文字列へ変更できるようにしています |
| JSの遅延読み込み | enqueue_scriptsで読み込まれるすべてのスクリプトに対して、defer属性を付与し、レンダリングがブロックされないようにしています |
| ブロックスタイル | 段落ブロック：注意・警告・チェック・アイディアのデザイン選択できるようにしています テーブルブロック：太い枠線を指定できるようにしています 見出しブロック：サイト特有のデザインを選択できるようにしています クエリーループタイトル：見出しと同じデザインを選択できるようにしています コードブロック：ブロック幅を80%もしくは50%に指定できるようにしています リストブロック：注意・警告・チェック・アイディアのデザイン選択を追加しています スペーサーブロック：高さのプリセットを追加しています |
| ショートコード | 表示の限定、最終更新日の表示など、あったらいいなというものをショートコード化して使えるようにしています |
| アイコンフォント | アイコンフォントをテーマ内で使用できるようにしています ※2022年9月18日現在、ダッシュアイコンを使うようにし、特定のページでのみサードパーティのアイコンフォントを読み込ませるよう変更しました |
| アイコンショートコード | アイコンフォントをショートコードで呼び出せるようにしています ※ダッシュアイコンもショートコードで呼び出せるようにしています |
| ブロックパターン | 独自のブロックパターンの登録・呼び出しができるようにしています |
| クイック編集 | クイック編集で最終更新日を変更しないようにしています |
| ページ内遷移ボタン | 「ページ上部へ戻る」「ホームへ移動」ボタンを画面右下へ表示しています |
| 更新日のコントロール | 編集画面で更新日を「更新する」「更新しない」「更新日を削除」できるようにしています |
| 更新日順リスト | フロントエンドの一覧（アーカイブなど）を更新日順で表示するようにしています |
| フィードの更新日順出力 | RSSフィードの表示順を更新日順で並び替えしています |
| 関連投稿の表示 | 投稿テンプレート本文末尾へ同一カテゴリーの関連投稿を表示させています |
| 最終更新日の一覧表示 | 管理画面側、投稿・固定ページの一覧へ並び替え可能な状態にして、最終更新日を表示させています |
| 自動alt | alt属性設定のない画像に自動で「ページタイトル」と「サイトタイトル」を挿入するようにしています |
| SNSシェアボタン他 | ショートコードで「Twitter」「Facebook」「Hatena」「LinkedIn」のシェアボタンと、RSSフィードページの表示、メールリンクを出力できるようにしています |
| REST API制限 | セキュリティ対策のため、通常運営に影響のあるものを除き、外部からのREST API経由での情報取得を防いでいます |
| タグのリスト表示 | 投稿編集画面で、タグをカテゴリーと同じ、一覧表示にしています |
| 再利用ブロックメニュー | 管理画面のメニューに再利用ブロックへのリンクを表示しています |
| 「-scaled」生成停止 | メディアへの画像アップロード時に「-scaled」ファイルが生成されないようにしています |
| メディアファイルのNoindex化 | メディアファイルページが検索エンジンにインデックスされないようにしています |
| メディアファイルへの直アクセス禁止 | メディアファイルへ直接アクセスされた際、トップページへ遷移するようにしています |
| XML-RPC通信を無効にする | XML-RPC通信を無効にしてリモートでの悪意あるアクセスを防いでいます |
| サイト内検索最適化 | サイト内検索フォームに入力された全角スペースを半角スペースへ変換し、検索精度を向上させています |
| 日付出力 | 個別投稿の「公開日」「最終更新日」を西暦和暦混在で表示しています（最終更新日のみを検索エンジンへ伝えるようにしています） |
| モバイル判定 | タブレットをパソコンと認識するコードを追加して、適宜使用しています |
| 背景画像 | サイト背景に画像を設定できるようにしています |
| 個別CSS、JS | 単独の投稿・固定ページごとにカスタムCSS、カスタムJSを追加できるようにしています（編集画面に入力ボックスを表示、HTML上ではフッターへ出力） |
| 管理画面のタイトル | 管理画面の投稿・固定ページ一覧のタイトル部分の幅を強制的に広げて見やすくしています |
| ブロック選択 | 編集画面のブロック選択を2列表示から1列表示にして見やすくしています |
| Canonicalタグの出力 | ヘッダー内へcanonicalタグを出力するようにしています |
上記の機能および上記以外の機能を追加してプラグインにした【Hima Art Utility】を以下のページで配布していますので、よかったら導入してみてください。
theme.jsonの記述変更
子テーマのtheme.jsonへ上書きして適用させています
| 項目 | 内容 |
|---|---|
| カスタムカラー | 文字装飾用のカラー設定を追加しています |
| サイト幅の設定 | 標準幅840px、幅広1260pxへ設定しています |
| フォント | 標準フォントの種類を変更しています 同時に見出し部分のフォントも変更した標準フォントに合わせています |
| フォントサイズ | サイト内のフォントサイズを各所変更しています |
| テンプレート選択 | TT2デフォルトで削除できないテンプレートを編集画面から選択できないようにしています |
子テーマの機能一覧
自身で作成した子テーマの機能一覧です。以下のページで配布してますので、よかったらご使用ください。
| 機能 | 概要 | |
|---|---|---|
| グローバル設定 | theme.json | 親テーマのtheme.jsonを上書きします |
| 管理画面のデザイン | admin-style.css | 管理画面側に独自のデザインを追加できます |
| エディタのデザイン | editor-style.css | 編集画面側に独自デザインを追加できます |
| 追加JS | child-script.js | JavaScript、jQueryなどを追加できます |
| ヘッダーコード追加 | insert-header.php | ヘッダーへアクセス解析用スクリプトなどを出力できます |
| フッターコード追加 | insert-footer.php | フッターへアクセス解析用スクリプトなどを出力できます |
| テンプレートショートコード | parts.php | テンプレートをショートコード化して、テーマテンプレート内などへ出力できます（全3か所分） |
