Lightningの404ページの内容を自分仕様に変更する方法

2024年5月6日 2026年1月22日

Iro

Contents

- 0.0.1 404のレイアウト設定を1カラムに
  - 0.0.1.1 Lightning の 404ページの内容を書き換える | ベクトレ

1 _g3/template-parts/main-404.php
2 functions.php
- 2.1 フックで改変する場合
  - - 2.1.0.1 Lightningの404ページの見出しやパンくずをわかりやすく書き換える方法

404のレイアウト設定を1カラムに

外観→カスタマイズから、404のレイアウト設定を1カラムにしておく。

404ページの内容の書き換えをするには

_g3/template-parts/main-404.php

Lightning 14.13.0 以降では、404ページ用に _g3/template-parts/main-404.php を新たに追加しています。

<?php
/**
 * 404 main template
 *
 * @package vektor-inc/lightning
 */
?>

<div class="main-section-no-posts">
	<p>
		<?php echo __( 'The page you are looking for cannot be found.', 'lightning' ); ?>
	</p>
</div>

<?php
/**
 * 404 main template
 *
 * @package vektor-inc/lightning
 */
?>

<div class="main-section-no-posts">
	<p>
		<?php echo __( 'The page you are looking for cannot be found.', 'lightning' ); ?>
	</p>
</div>

functions.php

フックで改変する場合

子テーマにファイルを複製しなくても、子テーマのfunctions.phpなどに以下のようなコードで改変可能です。

アクセスしたページが存在しない場合に表示されるエラーページのことです。削除されたページにアクセスしたときや、URLのタイプミスの際などに表示されるものです。404ページが表示された際にも、ユーザーが探している情報を見つけやすくするようにページの内容を工夫し、離脱を抑えてサイト内の回遊を促します。

// メインセクションテンプレートを制御するためのフィルターを追加
add_filter(
	'lightning_is_main_section_template',
	function( $return ) {
		// もし現在のページが404エラーページならば
		if ( is_404() ) {
			// メインセクションテンプレートを無効にする
			$return = false;
		}
		// フィルターの結果を返す
		return $return;
	}
);

// メインセクションに内容を追加するためのアクションを追加
add_action(
	'lightning_main_section_append',
	function () {
		// もし現在のページが404エラーページならば
		if ( is_404() ) :
			// カスタマイズした404ページの内容を表示する
			echo '<p>独自にカスタマイズした404ページの内容</p>';
		endif;
	}
);

// メインセクションテンプレートを制御するためのフィルターを追加
add_filter(
	'lightning_is_main_section_template',
	function( $return ) {
		// もし現在のページが404エラーページならば
		if ( is_404() ) {
			// メインセクションテンプレートを無効にする
			$return = false;
		}
		// フィルターの結果を返す
		return $return;
	}
);

// メインセクションに内容を追加するためのアクションを追加
add_action(
	'lightning_main_section_append',
	function () {
		// もし現在のページが404エラーページならば
		if ( is_404() ) :
			// カスタマイズした404ページの内容を表示する
			echo '<p>独自にカスタマイズした404ページの内容</p>';
		endif;
	}
);