Aprimorando campos personalizados do WordPress com filtragem de pesquisa

Coding a Band Website Created in Photoshop

Compartilhe esta postagem

Índice do Conteúdo

Receba nosso boletim

Novos contatos

nossa newsletter

Aprimorando campos personalizados do WordPress com filtragem de pesquisa

Campos personalizados do wordpress são um recurso excelente no WordPress. Eles permitem que você armazene qualquer informação extra (meta-dados) sobre uma postagem que você queira.

Quando comecei a usar o WordPress como um sistema de gerenciamento de conteúdo, evitei-o, pois pensei que seria difícil de usar para usuários finais (ou seja, o cliente), mas conforme aprendi mais sobre como personalizar os painéis de administração do WordPress, comecei a perceber o quão poderosa eles poderiam ser para um site WordPress.

No entanto, adicionar a capacidade de pesquisar suas postagens por campo personalizado é um pouco complicado; o recurso de pesquisa nativa do WordPress não pesquisa valores de campos personalizados.

Neste guia, mostrarei como trabalhar com campos personalizados e como torná-los ainda mais poderosos adicionando a capacidade de exibi-los e filtrá-los.

O que faremos é criar uma página de listagem de eventos muito simples para uma empresa que organiza Geléia eventos de coworking, localizados no Reino Unido.

Faremos a página de listagem de eventos classificável por local. Cada postagem será um evento com um título, descrição e um campo personalizado para a área em que o evento é baseado. (Alternativamente, em vez de usar o WordPress nativo Publicar tipo de postagem, você pode criar um tipo de postagem personalizado para eventos).

Este guia pressupõe que você tenha acesso fácil ao WordPress.

Se você quiser seguir passo a passo, recomendamos instalar o WordPress no seu computador em vez de trabalhar com uma instância ativa/de produção do WordPress.

Configurando o campo personalizado no WordPress Admin

A primeira coisa a fazer é configurar os metadados para cada evento. Há um forte argumento a ser feito aqui para usar o novo recurso de tipos de postagem personalizados que foi introduzido no WordPress 3.0, mas para mantê-lo simples, usaremos o nativo Publicar tipo de postagem no WordPress e, para indicar que são eventos em vez de postagens regulares, nós as colocaremos em uma categoria chamada “Encontre uma Jelly”.

Comece adicionando cada evento como um post. Dependendo do seu tema WordPress, você também pode adicionar miniaturas personalizadas e uma variedade de informações adicionais.

Depois de adicionar os dados padrão e selecionar a categoria correta, role para baixo até Adicionar novo campo personalizado seção perto do fundo do Adicionar nova postagem painel.

0034 02 campos personalizados addpost

Clique em Digite novo dê ao seu campo personalizado um nome relevante (por estar no Reino Unido, este exemplo usará locais como a chave do campo personalizado, embora pudesse facilmente usar estados ou regiões).

Isso formará a meta-chave no banco de dados, então certifique-se de que seja algo simples (de preferência uma palavra) para que a criação do código não seja trabalhosa.

Em seguida, adicione um valor de campo personalizado para o campo personalizado de condados (o nome do condado onde o Jelly está localizado). No meu caso, os valores poderiam ser Shropshire, Bedfordshire, Northamptonshiree assim por diante.

Clique no Adicionar campo personalizado botão para adicionar os metadados do condado e, em seguida, atualizar sua postagem.

A partir daqui, para cada evento adicional que você adicionar, você verá os campos personalizados dos locais aparecerem no menu suspenso de campos personalizados; você não precisa continuar adicionando-os.

0034 03 campos personalizados novos

Depois de configurar todas as suas listagens de eventos com os valores dos campos personalizados de cada país, é hora de começar a função de filtragem de pesquisa.

Criando o modelo de página de listagem de eventos

Abrir página.php na pasta do seu tema e salve-o como um novo arquivo. Neste caso, chamei o novo modelo de página de encontrar-geléia.php.

Dê ao arquivo um nome de modelo adicionando esta linha no topo da página:

Template Name: Find a Jelly

Agora, quando você criar uma nova página para seu diretório, esta página aparecerá na lista de modelos disponíveis.

0034 04 campos personalizados nova página

Criando o menu suspenso de filtragem de condado

Para criar o formulário web que permitirá aos usuários filtrar os resultados, adicione este código ao encontrar-geléia.php modelo de página que criamos anteriormente, onde você gostaria que o campo de entrada suspenso fosse exibido na página de listagem de eventos:

Deixe-me explicar o que está acontecendo no bloco de código acima.

A marcação

Primeiro, temos um formulário HTML básico com o atributo action deixado em branco, pois queremos que o formulário retorne à mesma página quando enviado. Definimos o método para get para que possamos ver os critérios de pesquisa na URL da mesma forma que a pesquisa padrão do WordPress. Usar get é um toque legal que permite ao usuário compartilhar o link dos resultados da pesquisa, além de nos permitir usar nosso software de análise (como o Google Analytics) para estudar pesquisas de eventos populares.

O elemento contém um menu suspenso (), com os elementos sendo os condados.

O botão submit () permite o envio do formulário; no entanto, com um pouco de JavaScript, você pode enviar o formulário quando o usuário escolher a opção, poupando-o da ação do usuário de ter que clicar em um botão submit.

Preenchendo o menu suspenso

A próxima parte do nosso código é a parte complicada; precisamos preencher o elemento com elementos de todos os valores de campo personalizados.

Para fazer isso, fazemos um loop por todos os valores no banco de dados para a chave de campo personalizado do condado; mas queremos exibir apenas valores exclusivos em vez de todas as instâncias em que eles estão anexados a uma postagem.

Para fazer tudo isso, usamos $wpdb->get_col(). $wpdb é uma classe PHP do WordPress que nos permite construir nossas próprias consultas SQL e fazer outras tarefas relacionadas ao banco de dados. O método get_col() em $wpdb é usado para selecionar uma coluna específica em nosso banco de dados WordPress.

Primeiro, criamos uma variável chamada variável de string chamada $metakey que recebe o nome do nosso campo personalizado (que é chamado de condado); isso é opcional e apenas torna nosso código um pouco mais legível.

Em seguida, usando $wpdb->get_col(), alimentamos nossa consulta SQL como uma instrução preparada usando o prático método $wpdb->prepare() do WordPress.

Esta é a consulta SQL acima (que foi reescrita e formatada ligeiramente para discussão):

SELECT DISTINCT meta_value
FROM $wpdb->postmeta
WHERE meta_key = $metakey
ORDER BY meta_value ASC

Esta consulta SQL seleciona todos os registros exclusivos no meta_value coluna do WordPress postmetaonde quer que meta_key é igual a "county"; ele retorna os resultados em ordem alfabética.

Cada resultado é então impresso como value atributo de cada elemento.

Depois de adicionar o formulário, você deverá ver algo parecido com a seguinte imagem na sua página; Eu estilizei esta página e adicionei um widget do Google Maps — não abordaremos isso aqui.

0034 05 nova página

Exibindo os resultados da pesquisa

OK, então esse é o filtro de pesquisa configurado; agora precisamos de alguns resultados.

Para fazer isso, vamos adicionar o seguinte código ao encontrar-geléia.php modelo após o código para o formulário web:

19,
 'meta_value' => $counties,
 'paged'=>$paged,
 );
 
 query_posts($args);
} else {
 query_posts('cat=19&posts_per_page=4');
}

if ($counties) { ?>

Sua busca por

Adionado recentemente

 ID, 'county', true); ?>

” title=””>  Read More

Desculpe, nenhum resultado foi encontrado

Parece que há muita coisa acontecendo aí, simplesmente por causa do volume de código versus o primeiro bloco de código, mas não há, realmente; se você já trabalhou com desenvolvimento de tema WordPress antes, o acima parecerá bem direto para você. Vamos dividir em seus principais componentes.

Para começar, configuramos uma variável para coletar quaisquer dados de formulário que foram adicionados ao URL da página, examinando o $_GET[] variedade.

$counties = $_GET['county'];

Em seguida, verificamos se algum dado foi passado; se tiver sido, executamos uma consulta simples do WordPress:

if ($counties) {
 $paged = (get_query_var('paged')) ? get_query_var('paged') : 1;
 
 $args=array(
 'cat'=>19,
 'meta_value' => $counties,
 'paged'=>$paged,
 );
 
 query_posts($args);
}

O $paged variável é incluída para que a paginação padrão do WordPress possa ser usada se houver muitos resultados. Eu incluí o 'cat' parâmetro (19 é o ID da categoria da minha categoria, mas o seu pode ser diferente) para garantir que apenas postagens de Encontre uma geléia categoria são exibidas; isso não é necessário, mas é uma medida extra para tolerância a falhas, caso seu cliente adicione erroneamente o campo personalizado a outras postagens fora do Encontre uma geléia categoria. A meta_value precisa corresponder à nossa consulta de pesquisa.

Se a função de pesquisa não tiver sido usada, precisamos que a página exiba algo, então a configurei para adicionar as quatro entradas mais recentes.

else {
 query_posts('cat=19&posts_per_page=4');
}

Em seguida, exibimos um título dependendo se uma pesquisa foi usada:

if ($counties) { ?>

Your Search For

Recently Added

E, finalmente, adicionamos o loop padrão do WordPress para percorrer todos os resultados, dependendo da consulta usada acima.

A única funcionalidade adicional é que adicionei o seguinte:

$event_county = get_post_meta($post->ID, 'county', true); ?>

A linha de código acima obtém as informações do campo personalizado dentro do loop e exibe o condado como parte de cada listagem.

Salve seu arquivo e carregue-o no seu servidor. Agora você poderá classificar todas as suas postagens na categoria correta pelo campo personalizado “condado”.

Para um exemplo vivo disso, confira o Encontre uma página Jelly no site UK Jelly. Você verá que levei os campos personalizados muito mais longe ao integrar o Google Maps com marcadores clicáveis ​​listando todos os locais, bem como muitas informações adicionais sobre cada Jelly.

Perguntas Frequentes sobre campos personalizados no WordPress

O que são campos personalizados no WordPress?

Campos personalizados são um recurso no WordPress que permitem armazenar informações extras (meta-dados) sobre uma postagem.

Como posso adicionar e configurar um campo personalizado no WordPress?

Para adicionar e configurar um campo personalizado no WordPress, você precisa adicionar cada evento como um post e, em seguida, adicionar um novo campo personalizado com um nome relevante e um valor correspondente. Isso formará a meta-chave no banco de dados.

Como criar um modelo de página de listagem de eventos no WordPress?

Para criar um modelo de página de listagem de eventos no WordPress, você deve abrir o arquivo de página do seu tema e salvá-lo como um novo arquivo com um nome de modelo específico. Você também precisa adicionar um código HTML para exibir um formulário web que permita aos usuários filtrar os resultados.

Como exibir os resultados da pesquisa dos campos personalizados no WordPress?

Para exibir os resultados da pesquisa dos campos personalizados no WordPress, você precisa adicionar um código ao modelo de página que processe os dados do formulário de pesquisa e exiba os resultados correspondentes. Você também pode usar a função de loop do WordPress para iterar sobre os resultados e exibi-los na página.

O que mais posso fazer com campos personalizados no WordPress?

Além de exibir e filtrar resultados com base em campos personalizados, você pode integrar outras funcionalidades, como Google Maps, para enriquecer a experiência do usuário. Você pode explorar diferentes possibilidades de personalização e melhorias para otimizar seu site no WordPress.

Leia mais sobre:

Como fazer SEO: um guia para iniciantes e novatos em SEO

Tutorial de otimização de mecanismos de pesquisa: como fazer SEO

Como mapear palavras-chave em seu site

Você pode fazer SEO sozinho? Sim! Faça você mesmo SEO com este guia completo.


Assine a nossa newsletter

Receba atualizações e aprenda com os melhores

explore mais conteúdo

aprenda mais com vídeos

você que impulsionar seu negócio?

entre em contato conosco e saiba como

contatos midiapro
small_c_popup.png

Saiba como ajudamos mais de 100 das principais marcas a obter sucesso

Vamos bater um papo sem compromisso!