Você está interessado em criar Smart Tags personalizadas com base nos campos gerados com o ACF (Advanced Custom Fields)? Neste tutorial, nós o orientaremos no processo de criação dessas Smart Tags especializadas usando um trecho de código conciso.
Para ilustrar este tutorial, vamos considerar um site WordPress que utiliza publicações como itens do portfólio de vendas. Criaremos um único formulário para ser exibido em cada página de postagem, integrando-o perfeitamente ao modelo PHP.
No entanto, para que os autores listem efetivamente seus itens para venda, eles precisarão inserir os respectivos preços. Aproveitando o plug-in ACF, incorporamos um campo Price nas configurações da postagem.
Esse campo de preço será pré-preenchido no formulário e atualizado dinamicamente com base na postagem que está sendo visualizada. Como o formulário permanece constante entre as postagens, mas o preço varia, empregaremos uma Smart Tag para esse campo a fim de garantir sua adaptabilidade com a atualização das informações de cada postagem.
Criação do campo personalizado com ACF
Primeiro, começaremos criando nosso campo personalizado com o plug-in Advanced Custom Fields.
Seguindo a documentação do ACF, adicionamos um novo campo aos nossos posts chamado portfolio_price.
Este tutorial pressupõe que você já tenha adicionado seu(s) campo(s) à postagem. Se precisar de ajuda para adicionar campos às postagens do WordPress usando o plug-in Advanced Custom Fields, consulte a documentação dele.
Criação de uma Smart Tag a partir do campo ACF
Normalmente, criaríamos o formulário primeiro. No entanto, como sabemos que queremos usar essa nova Smart Tag em nosso construtor de formulários, adicionaremos o snippet antes de criar o formulário.
Se precisar de ajuda para adicionar snippets ao seu site, consulte este tutorial.
/**
* Register the Smart Tag so it will be available to select in the form builder.
*
* @link https://wpforms.com/developers/how-to-create-a-smart-tag-from-an-acf-field/
*/
function wpf_dev_register_smarttag( $tags ) {
// Key is the tag, item is the tag name.
$tags[ 'portfolio_price' ] = 'Portfolio Price';
return $tags;
}
add_filter( 'wpforms_smart_tags', 'wpf_dev_register_smarttag' );
/**
* Process the Smart Tag.
*
* @link https://wpforms.com/developers/how-to-create-a-smart-tag-from-an-acf-field/
*/
function wpf_dev_process_smarttag( $content, $tag ) {
// Only run if it is our desired tag.
if ( 'portfolio_price' === $tag ) {
//Get the field name from ACF
$my_acf_field = get_field( 'portfolio_price', get_the_ID() );
// Replace the tag with our link.
$content = str_replace( '{portfolio_price}', $my_acf_field, $content );
}
return $content;
}
add_filter( 'wpforms_smart_tag_process', 'wpf_dev_process_smarttag', 10, 2 );
Vamos detalhar essas duas funções.
A primeira função está criando uma Smart Tag vazia com o nome "Portfolio Price". Nada será atribuído a essa tag ainda, estamos apenas criando-a com essa função.
A próxima função é onde definiremos a Smart Tag e de onde ela deve extrair as informações.
Com a linha $my_acf_field = get_field( 'portfolio_price', get_the_ID() ); estamos informando ao código que ele precisa ir para Advance Custom Fields e obter esse valor de campo. Você precisará digitar o nome do campo aqui. Para o nosso tutorial, nomeamos o campo portfolio_price.
Se precisar de ajuda para encontrar o nome do campo, basta editar o campo que você criou no ACF e procurar o rótulo Nome do campo.
Criando o formulário
Criamos nosso formulário para ter os campos Name, Email, Product Title (Single Line Text), Product Price (Single Line Text) e Comments (Paragraph Text).
Se precisar de ajuda para criar um formulário, consulte este tutorial.
Adicionando as Smart Tags
Para o nosso formulário, vamos trazer o Product Title, que é o título da postagem. Podemos usar uma Smart Tag integrada que o WPForms já fornece para isso.
Depois de adicionar o campo Single Line Text para o título do produto, basta clicar na guia Advanced (Avançado ). No valor padrão do campo, clique no link Show Smart Tags e selecione Embedded Post/Page Title para que o título da postagem seja preenchido automaticamente nesse campo do formulário.
Em seguida, repetiremos essa etapa novamente para o campo Product Price.
Na guia Avançado do campo Preço do produto, selecione a Smart Tag {portfolio_price} Smart Tag dentre as Smart Tags disponíveis.
Adição do shortcode do WPForms a um modelo PHP
Se precisar de ajuda para adicionar um shortcode a um modelo PHP, consulte este tutorial.
Para este tutorial, adicionamos nosso shortcode à parte inferior do modelo de página de postagem única.
Agora você pode ver que, à medida que suas postagens mudam, o mesmo acontece com o Product Price e o Product Title do seu formulário.
Você gostaria de criar mais Smart Tags personalizadas? Dê uma olhada em nosso tutorial sobre Como criar uma Smart Tag personalizada.