Webサイトでユーザーのいないリンクを入力するか、リンクが壊れているページ/投稿をクリックすると、404ページなし(Page not Found)ページが表示されます。
WordPressの場合、ユーザーがいないURLにアクセスしようとすると、404ページテンプレート(404.php)によって生成された404ページが表示され、404ページテンプレートがない場合は、Webホスティングによって提供される404ページが表示されることがあります。
404エラーに対処する方法として、XNUMXつのことを考えることができます。
- 404ページテンプレートをカスタマイズする
- ホームページなど特定のページにリダイレクトする
[この記事は2024年1月16日に再作成され、再発行されました。 ]
404ページテンプレートをカスタマイズする
WordPress テーマごとに404ページのテンプレートは異なります。 GeneratePress テーマの場合、次の404ページが表示されます。
ベストセラーのテーマである Avadaの場合は、404ページが他のテーマに比べて少し気になっている。
このサイトでは、少しカスタマイズして、次のような画面が表示されます。最新の投稿と一緒に下に人気の投稿が表示されるようにしてみました。
404ページのテンプレートをカスタマイズする方法については、次の記事を参照してください。
404エラー時のホームページに移動(リダイレクト)させる
ユーザーがサイト内に存在しないページにアクセスしようとすると、ホームページまたは特定のページに移動することも検討できます。
ホームページにリダイレクトする方法としてカスタムコードを追加したり、All 404 Redirect to Homepageなどのプラグインを使用したりできます。
All 404 Redirect to Homepage プラグインの使用
All 404 Redirect to Homepage プラグインを使用すると、404エラーで簡単にホームページまたは特定のページにリダイレクトできます。
このプラグインは現在20万を超えるサイトにインストールされ使用されており、一部のYouTubeではこのプラグインを必須プラグインとして推奨しています。そして Cafe24の WordPress ブログホスティングにサインアップすると、このプラグインがデフォルトでインストールされているようです。
このプラグインは404ページの監視機能も提供します。
個人的には、この機能のためにあえてプラグインを使用する必要なしに、以下に示す簡単なコードをテーマ関数ファイルに追加することを好みます。
すべての404ページをホームページまたは特定のページにリダイレクトするように設定した場合は、SEOに積極的に作用するかどうかを慎重に監視してください。
カスタムコードを使用してリダイレクトを設定する
この作業には、 wp redirect 関数を利用できます。
たとえば、次のコードをテーマの関数ファイル(functions.php)に追加すると、すべての404エラーに対してホームページにリダイレクトされます。 (チャイルドテーマを作成し作業してください。)
add_action('template_redirect', 'custom_redirect_404_to_home');
function custom_redirect_404_to_home() {
if (is_404()) {
wp_redirect(home_url());
exit();
}
}
少し遅れてリダイレクトする場合は、次のコードを使用できます。これにより、最初に404エラーページが表示され、3秒後にホームページにリダイレクトされます。
add_action('template_redirect', 'custom_redirect_404_to_home');
function custom_redirect_404_to_home() {
if (is_404()) {
// Change the number '3' to the desired number of seconds before redirect
$redirect_time = 3;
wp_redirect(home_url(), $redirect_time);
exit();
}
}
上記の作業にはFTPに接続できる必要があります。
404エラーで特定のURLにリダイレクトしたい場合は、次のコードを使用できます。
add_action('template_redirect', 'custom_redirect_404_to_specific_page');
function custom_redirect_404_to_specific_page() {
if (is_404()) {
// 여기에 원하는 페이지의 URL을 입력하세요.
$specific_page_url = 'https://example.com/specific-page/';
wp_redirect($specific_page_url);
exit();
}
}
別の方法として、次のコードで404.phpページを置き換えることも可能です。 (テーマに404.phpファイルがない場合はXNUMXつ作成してください。)
<?php header("HTTP/1.1 301 Moved Permanently"); header("Location: ".get_bloginfo( 'url')); exit(); ?>
ホームページの代わりに他のリンクにリダイレクトさせることも可能です(header()関数は、 ここ を参照)。
header.phpファイルに追加することも可能です。次のコードをテーマフォルダ内のheader.phpファイルにヘッドセクションに追加すると、404エラーの3秒後にホームページにリダイレクトされます。
" />
404番目の3エラーページが表示され、XNUMX秒後にホームページにリダイレクトされるコードは、
「HTTPリダイレクトステータスコードはリダイレクトコード3xxでなければなりません。」
このように表示され、リダイレクトできません。
この問題は、wp_redirect()関数の301番目の引数として入力された値が、リダイレクトに必要なHTTPステータスコードではないために発生します。 wp_redirect() の 302 番目の引数はリダイレクト状態コード (3、XNUMX など) でなければなりません。 (この部分は後で修正します。)
これを解決するには、wp_redirect()関数で時間遅延を設定せずに、代わりにステータスコードを指定するだけです。リダイレクト後しばらく待ちたい場合は、JavaScriptを使用して解決できます。
add_action('template_redirect', 'custom_redirect_404_to_home');
function custom_redirect_404_to_home() {
if (is_404()) {
// 리디렉트 상태 코드 302를 사용하여 리디렉션 수행
wp_redirect(home_url(), 302);
exit();
}
}
上記のコードでは、302は一時リダイレクトのためのステータスコードです。 JavaScriptでリダイレクトを遅らせたい場合は、次のように実装することもできます。
add_action('template_redirect', 'custom_redirect_404_to_home');
function custom_redirect_404_to_home() {
if (is_404()) {
?>
<script type="text/javascript">
setTimeout(function(){
window.location.href = "<?php echo home_url(); ?>";
}, 3000); // 3초 후 리디렉션
</script>
<?php
exit();
}
}
JavaScriptコードで試してみますか?
JavaScriptコードで試してみると、3秒後にリダイレクトされますが、404エラーページを表示せずに、白い背景の空白ページが3秒間表示され、リダイレクトされます。
簡単には、404ページテンプレートのヘッダーに3秒の遅延コードを入れることもできます。
次のコードで好きなように動作するかどうかをテストしますか?
add_action('template_redirect', 'custom_redirect_404_meta');
function custom_redirect_404_meta() {
if (is_404()) {
add_action('wp_head', function() {
echo '<meta http-equiv="refresh" content="3;url=' . home_url() . '">';
});
}
}
404ページテンプレートのヘッダーに入れる3秒の遅延コードも関数ファイル(functions.php)に追加できますか?
私が提示したコードはチャイルドテーマの関数ファイルに追加してください。
別の方法で404ページのテンプレートを作成し、ヘッダー部分が直接3秒遅れて移動するコードを追加することもできます。
このサイトはwordpress의 공부에 최강입니다.
텍스트 문자 내의 링크 부분이 언더 바로부터 마우스 호버로 배경색(그라데이션)이 됩니다만, 이것의 방법을 가르쳐 주실 수 있습니까?CSS의 설정이라고 생각합니다만 잘 부탁드립니다
このサイトは、 wordpress 勉強に最強です。
テキスト文字のリンク部分がアンダーバーからマウスホバーで背景色(グラデーション)になりますが、この方法を教えていただけますか? CSS設定だと思いますがよろしくお願いします。
こんにちは、macさん。
CSSを使用してリンク効果を変更できます。以下の記事に方法が記載されていますので、参考にしてください。うまくいかない場合は、使用しているテーマなど、詳細情報をここにもう一度コメントしてください。
https://avada.tistory.com/2684