Como detalhar um WordPress usando Hooks

No WordPress geralmente é fácil editar ou acrescentar conteúdo, mas isto não é assim em todos os casos!

A Make It Digital preparou um exemplo em que é necessário escrever um pouco de código e “mastigar” o problema.

 

O problema hipotético:
Imaginemos que temos uma listagem produtos, alguns destes são vendidos em packs e queremos apresentar ao utilizador os seus preços unitários.

a caixa de custom fields do produto

 

1. Definir o número de unidades por pack

Isto podia ser declarado no código, mas e se tivéssemos packs com números diferentes de unidades?

Podíamos criar regras no código e tentar identificar quantos packs tem, mas esta solução poderia falhar.
Também podíamos escrever no título entre parentesís (3 unidades), mas na Make It Digital preferimos uma solução um pouco mais robusta.

A nossa solução para este passo é adicionar o campo ao post meta.

Nas “screen options” seleccionamos a opção dos “custom fields”.

as screen options do produto

Em baixo definimos a chave (nome) do novo campo, ou uma anteriormente definida, além do valor para este produto.

a caixa de custom fields do produto

Já temos o valor das unidades, agora vamos ver como usá-lo!

 

2. Identificar como introduzir o nosso código

Na Make It Digital utilizamos uma das funcionalidades do WordPress muito úteis, os hooks (filters e actions).
De forma simplificada, se toda a execução do código, para mostrar a página, for rede de linhas de comboio, os filters e as actions seriam estações de comboio. Nestas podemos escolher adicionar ou inspeccionar a “carga” do comboio ou fazer andar outros comboios, sincronizados com este.

 

3. Identificar o action/filter

Para tentar identificar uma action ou filter que possamos usar, primeiro vamos usar um plugin chamado Simply Show Hooks. Este é muito bom para ajudar a visualizar as “estações” na página, mas infelizmente não conseguiu “apanhar” um que corra dentro do loop de produtos.

exemplo de funcionamento do plugin simply show hooks

Neste ponto poderíamos tentar identificar de onde vem o código (de um plugin ou do tema) se não soubessemos a sua origem, no código ou directamente no HTML.
Como isto é um loop de produtos do WooCommerce, utilizamos um truque: usando a pesquisa do editor de texto, procuramos nos ficheiros pelas classes de HTML usadas no produto. Sucesso!

Descodificando o que vemos na imagem, temos um filter que devolve o HTML do produto e também como valores um array e um objecto da classe WC_Product.

 

4. Adicionar o código

Para manipular o HTML gerado pelo filter, corremos o add_filter() com o nome do filter (woocommerce_blocks_product_grid_item_html), o nome da nossa função (addUnitaryPrice), a prioridade (caso o filter seja manipulado noutros sítios, é 10 por defeito) e o número de argumentos que o filter vai passar para a nossa função (neste caso 3).

No fim da nossa função devolvemos o valor alterado do HTML.

 

5. Manipular o HTML

Primeiro precisamos de obter o valor das unidades do produto, que se encontra no “post meta”, com a função do get_post_meta. O ID do post obtemos da classe do produtro, “units” é a chave que escolhemos para este “post meta”. Obtemos o preço em vigor da mesma forma que o ID.

Já temos tudo o necessário, só sobra código comum! Calculamos o preço por unidade e adiciona-mo-lo no meio do HTML que recebemos.

 

Aqui fica a Dica MID de IT sobre como detalhar um WordPress usando Hooks. Nunca se esqueça que a Make It Digital está aqui para o ajudar. Contacte-nos sempre que precisar.

Contact Us

We're not around right now. But you can send us an email and we'll get back to you, asap.

Abrir Chat
Podemos ajudar? Estamos no WhatsApp
Olá! Podemos ajudar? :)
Powered by