Modelos de Temas: Páginas de Erros

Assim como todo bom usuário de internet, pode acontecer dele digitar uma URL que não exista em nosso site, e acabar caindo na famosa página 404 Não Encontrado.

Só que, se ele fizer isso atualmente no nosso tema, ele vai cair direto na index.php, que sabemos que não é beeeem lá uma página de erro, não é verdade?

E para casos como esses, temos que estar preparados 👻

Com relação a páginas de erros, o WordPress conta com diversos modelos de templates que podemos usar para tratar cada um deles (consulte os códigos HTTP para ver quais são).

Como você viu no link acima - isto é, se você clicou 😑 -, vemos que existem diversos tipos de códigos diferentes, que vão desde, 200, 300, 400, 500... Onde o WordPress oferece suporte a maioria deles.

Vamos começar pelos mais relevantes:

401.php: Página de erro para o código de status HTTP 401 (Não Autorizado).

403.php: Página de erro para o código de status HTTP 403 (Proibido).

404.php: Página de erro para o código de status HTTP 404 (Não Encontrado).

500.php: Página de erro para o código de status HTTP 500 (Erro Interno do Servidor).

502.php: Página de erro para o código de status HTTP 502 (Gateway Ruim).

503.php: Página de erro para o código de status HTTP 503 (Serviço Indisponível).

504.php: Página de erro para o código de status HTTP 504 (Tempo Limite da Porta de Entrada).

Beleza, então é só criar um desses arquivos dentro da pasta do meu tema que o WordPress lida com o resto?

Claro que não, você vai precisar estiliza-lo 😉

Criando um arquivo de status code

Para testarmos, vou pegar como exemplo o arquivo 404.php.

Dentro da pasta raiz do seu tema, crie um novo arquivo chamado 404.php:

<?php
/**
 * O template para a página 404
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package WPMicilini
 * @since 1.0
 */

get_header(); 

?>

<h1>404 Página não encontrada!</h1>
<p><a href="esc_url(home_url('/'))"></a></p>

<?php
get_footer();
?>

Como podemos ver, o conteúdo inicial sempre começa com a abertura das tags PHP, onde inserimos algumas informações relevantes sobre o arquivo em formato de comentários, e é claro, importamos o cabeçalho e o rodapé por meio das funções get_header() e get_footer().

A página de status code, é bem simples e enxuta, onde no meu caso, inseri uma tag <h1> informando o título da página, junto com um link que leva o usuário diretamente para a página inicial do nosso site.

home_url('/'): Retorna a URL do seu site principal.

A página de status code, costuma ser bem simples mesmo, contendo somente um link que leva o seu visitante para a página principal, onde em muitos temas, nem cabeçalho e rodapé possuem, sabia disso?

É claro que você pode estilizar as suas páginas de status code da maneira como desejar, trazendo novas funções, tags condicionais, novos layouts e etc.

Como faço para testar essa página?

É simples, basta digitar na URL um endereço do seu site que não existe. Por exemplo: http://localhost/minha-primeira-aplicacao/eu-sei-que-essa-pagina-nao-existe

Estilizando sua página de status code

Muitos criadores de tema, costumam estilizar de forma um pouco diferente suas páginas de status code, principalmente a página 404.

Onde alguns deles costumam adicionar um formulário de pesquisa, e um widget responsável por trazer os últimos 3 posts publicados, vejamos:

<?php
/**
 * O template para a página 404
 *
 * @link https://codex.wordpress.org/Template_Hierarchy
 *
 * @package WPMicilini
 * @since 1.0
 */

get_header(); 

?>

<h1>404 Página não encontrada!</h1>
<p><a href="esc_url(home_url('/'))"></a></p>

<h2>Que tal fazer uma busca?</h2>
<?php get_search_form(); ?>

<?php the_widget('WP_Widget_Recent_Posts', array('title' => 'Latest Posts', 'number' => 4)); ?>

<?php
get_footer();
?>

get_search_form(): Função do WordPress que retorna o formulário de pesquisa padrão do WordPress, ou o conteúdo do arquivo searchform.php quando este existir.

the_widget(): É uma função do WordPress que permite exibir um widget específico em uma área de widget no seu tema ou template.

No caso dele, estamos usando o recurso WP_Widget_Recent_Posts, que é um widget padrão do WordPress que exibe uma lista dos posts mais recentes do seu site.

Vejamos um exemplo de uso com parâmetros mais completos:

the_widget('WP_Widget_Recent_Posts', array(
 'title' => 'Posts Recentes',
 'number' => 5, // Número de posts a exibir
 'taxonomy' => 'category', // Taxonomia a ser excluída (opcional)
 'exclude' => '1,2,3', // IDs de categorias a serem excluídas (opcional)
 'author' => '', // ID do autor a ser excluído (opcional)
));

Outros tipos de modelos de páginas

Acompanhe a lista abaixo, onde listamos os diferentes modelos de páginas associados com os status code suportados pelo HTTP:

400.php: Página de erro para o código de status HTTP 400 (Solicitação Inválida).

401.php: Página de erro para o código de status HTTP 401 (Não Autorizado).

402.php: Página de erro para o código de status HTTP 402 (Pagamento Necessário).

403.php: Página de erro para o código de status HTTP 403 (Proibido).

404.php: Página de erro para o código de status HTTP 404 (Não Encontrado).

405.php: Página de erro para o código de status HTTP 405 (Método Não Permitido).

406.php: Página de erro para o código de status HTTP 406 (Não Aceitável).

407.php: Página de erro para o código de status HTTP 407 (Autenticação de Proxy Necessária).

408.php: Página de erro para o código de status HTTP 408 (Tempo Limite da Solicitação).

409.php: Página de erro para o código de status HTTP 409 (Conflito).

410.php: Página de erro para o código de status HTTP 410 (Desaparecido).

411.php: Página de erro para o código de status HTTP 411 (Comprimento Necessário).

412.php: Página de erro para o código de status HTTP 412 (Pré-condição Falhada).

413.php: Página de erro para o código de status HTTP 413 (Entidade de Solicitação Muito Grande).

414.php: Página de erro para o código de status HTTP 414 (URI da Solicitação Muito Longa).

415.php: Página de erro para o código de status HTTP 415 (Tipo de Mídia Não Suportado).

416.php: Página de erro para o código de status HTTP 416 (Solicitação de Faixa Não Satisfatória).

417.php: Página de erro para o código de status HTTP 417 (Falha na Expectativa).

418.php: Página de erro para o código de status HTTP 418 (Eu sou um bule de chá).

419.php: Página de erro para o código de status HTTP 419 (Timeout durante autenticação).

420.php: Página de erro para o código de status HTTP 420 (Aprimorar Sua Calma).

421.php: Página de erro para o código de status HTTP 421 (Conexão Indireta com Requisição).

422.php: Página de erro para o código de status HTTP 422 (Entidade Não Processável).

423.php: Página de erro para o código de status HTTP 423 (Bloqueado).

424.php: Página de erro para o código de status HTTP 424 (Falha de Dependência).

426.php: Página de erro para o código de status HTTP 426 (Upgrade Necessário).

428.php: Página de erro para o código de status HTTP 428 (Pré-condição Requerida).

429.php: Página de erro para o código de status HTTP 429 (Muitas Requisições).

431.php: Página de erro para o código de status HTTP 431 (Solicitação de Campos de Cabeçalho Muito Grande).

451.php: Página de erro para o código de status HTTP 451 (Indisponível por Motivos Legais).

500.php: Página de erro para o código de status HTTP 500 (Erro Interno do Servidor).

501.php: Página de erro para o código de status HTTP 501 (Não Implementado).

502.php: Página de erro para o código de status HTTP 502 (Bad Gateway).

503.php: Página de erro para o código de status HTTP 503 (Serviço Indisponível).

504.php: Página de erro para o código de status HTTP 504 (Gateway Timeout).

505.php: Página de erro para o código de status HTTP 505 (Versão HTTP Não Suportada).

506.php: Página de erro para o código de status HTTP 506 (Variação de Negociação Também Negociável).

507.php: Página de erro para o código de status HTTP 507 (Armazenamento Insuficiente).

508.php: Página de erro para o código de status HTTP 508 (Loop Detectado).

510.php: Página de erro para o código de status HTTP 510 (Exigência de Extensões de Rede).

511.php: Página de erro para o código de status HTTP 511 (Autenticação de Rede Exigida).

520.php: Página de erro para o código de status HTTP 520 (Web Server Retorna um Erro Desconhecido).

521.php: Página de erro para o código de status HTTP 521 (Web Server Está Inativo).

522.php: Página de erro para o código de status HTTP 522 (Conexão com o Servidor Web Cronometrada).

523.php: Página de erro para o código de status HTTP 523 (Origem Inacessível).

524.php: Página de erro para o código de status HTTP 524 (Um Timeout Ocorreu).

525.php: Página de erro para o código de status HTTP 525 (SSL Handshake Falhou).

526.php: Página de erro para o código de status HTTP 526 (SSL Certificate Não é Válido).

527.php: Página de erro para o código de status HTTP 527 (Erro Railgun).

530.php: Página de erro para o código de status HTTP 530 (Erro de Site Desconhecido).

598.php: Página de erro para o código de status HTTP 598 (Rede Leva um Tempo).

599.php: Página de erro para o código de status HTTP 599 (Conexão com a Rede Timeout).

Eu preciso ter todos esses arquivos dentro do meu tema?

Não, pois vale ressaltar que a criação de templates para todos esses códigos de status pode ser excessiva, neste caso, é recomendável escolher aqueles que são mais relevantes para o contexto do seu site.

Conclusão

Neste conteúdo, você aprendeu a criar as páginas de erros no seu tema do WordPress.

Até a próxima lição 🥳