Como inserir e editar postagens CCT por meio de formulário
Adicionar novo formulário para envio de itens CCT
Primeiro de tudo, vamos começar com um formulário simples para criar um item CCT. Para isso, navegue até WordPress Dashboard > JetFormBuilder > Add New .
Adicione um título ao formulário e certifique-se de que ele inclua o campo oculto com o valor do campo “ID da postagem atual” .
Clique no botão “ Alternar inserção de bloco ” com um ícone em forma de sinal de adição no canto superior esquerdo da janela e adicione todos os tipos de campo que você possui atualmente em seu CCT.
Agora precisamos criar a ação de pós-envio “Inserir/atualizar tipo de conteúdo personalizado” na guia correspondente das configurações do formulário.
Ao clicar no ícone em forma de lápis, podemos conectar os campos do formulário aos metacampos existentes.
No pop-up exibido, selecione seu CCT como Content Type e escolha o Item Status necessário .
No seguinte conjunto de campos do Mapa de Campos, deixe Campo Oculto desmarcado e preencha outros campos com as opções correspondentes.
” alt=”ação pós-envio criar formulário” data-src=”https://crocoblock.com/knowledge-base/wp-content/uploads/2023/03/post-submit-action-create-form-2x.png” />Clique no botão “ Atualizar ” e publique o formulário.
Agora você tem um formulário pronto que pode ser adicionado a qualquer página que precisar.
Criar formulário para edição de itens CCT na página da conta
Se você também deseja fornecer aos usuários a capacidade de editar itens CCT da listagem, você precisa criar um formulário que permita obter dados de uma postagem específica que você pode editar.
Vamos começar criando um novo formulário. Para agilizar o processo, você pode duplicar o formulário anterior pressionando o botão correspondente.
Altere o valor do campo de um campo oculto para “Variável de consulta URL” e forneça a chave da variável de consulta – “_post_id”.
Agora, vá para a seção Ação de pós-envio das configurações do formulário e mapeie o campo oculto com “ID do item” na seção Mapa de campo .
E por último mas não menos importante, precisamos habilitar a predefinição nas configurações correspondentes para obter dados pré-preenchidos em nosso formulário.
A fonte em nosso caso será “Tipo de conteúdo personalizado”, Obtenha o ID do item de – o mesmo que no campo oculto – “Variável de consulta URL” e o nome da variável de consulta é “_post_id”.
Também precisamos adicionar todos os nossos metacampos CCT para mapear com os campos do formulário, como na imagem abaixo.
” alt=”editar predefinição de formulário” data-src=”https://crocoblock.com/knowledge-base/wp-content/uploads/2023/03/edit-form-preset-2x.png” />Concluímos o formulário; agora vamos criar um modelo Elementor para nosso formulário de edição.
Navegue até Modelos > SavedTemplates e clique em “Adicionar Novo” .
” alt=”adicionar novo modelo” data-src=”https://crocoblock.com/knowledge-base/wp-content/uploads/2023/02/add-new-template.png” />Dentro do modelo, adicione o widget JetForm , selecione o formulário recém-criado como fonte e publique o modelo.
Quando terminar esta etapa, vamos criar uma página de conta com este modelo. Vá para JetEngine > Profile Builder > Página da conta e crie uma nova subpágina.
Dê a ele um Title , Slug e selecione o Template , onde adicionamos um formulário para edição do CCT. É melhor ocultar este modelo do menu Conta ativando o botão de alternância correspondente, para que você possa acessar esta página apenas com um link de redirecionamento.
Agora, precisamos criar um modelo de Listagem com um link que nos levará à nossa página Editar Formulário.
Vá para Painel do WordPress> JetEngine> Listagens e selecione Fonte – “Tipo de conteúdo personalizado” como fonte da listagem , selecione o nome do seu CCT e dê um nome à sua listagem.
Adicione todos os dados necessários em sua listagem e coloque o widget Dynamic Link , onde você seleciona a página da sua conta com Editar formulário como fonte e habilita Query Argument :
_post_id=%actual_id%
A última etapa é criar um novo modelo Elementor com a listagem que acabamos de criar.
Navegue até Modelos > Modelos salvos , clique em “Adicionar novo” e adicione o widget Grade de listagem , onde você pode selecionar um modelo de listagem para CCT no campo Listagem .
Depois disso, precisamos voltar ao WordPress Dashboard > JetEngine > Profile Builder > Account Page e criar mais uma subpágina com um modelo que contém a listagem CCT.
É tudo por agora; vamos verificar nossos resultados. Navegue até a página da conta com nossa listagem e clique no botão “ Editar ”:
Após clicar no botão “ Editar ”, a página é redirecionada para aquela com o Formulário de Edição e dados predefinidos.
Criar formulário para edição de itens CCT em pop-up
Finalmente, vamos ver como podemos adicionar o formulário Editar CCT no pop-up.
Inicialmente, crie um novo formulário ou duplique o primeiro “Criar Formulário CCT”.
Neste caso, precisamos definir Hidden Field sem valor de Field . Em vez disso, vamos configurar Default Value .
Precisamos obter dados de Custom Content Type , Current Post e o valor CCT será Item ID .
Na janela de edição “ Inserir/atualizar tipo de conteúdo personalizado” da ação de pós-envio, conecte o campo oculto com “ID do item”.
Navegue até a seção Predefinição . Aqui você precisa escolher a fonte “Tipo de conteúdo personalizado” e definir a “Postagem atual” no campo Obter ID do item de . Como antes, precisamos mapear nossos campos de formulário com metacampos CCT.
Salve as alterações e crie um pop-up dinâmico para adicionar este formulário dentro.
Adicione o formulário com o widget JetForm, selecione o formulário que criamos para nosso Popup e certifique-se de ter as configurações de popup corretas. Ative o carregamento de conteúdo com as opções Ajax e carregamento forçado . Adicione a condição “Site inteiro” no campo Condições de exibição .
Vamos abrir a Listagem do CCT novamente e adicionar dentro de um widget Button .
Nas configurações avançadas, você pode ver a guia JetPopup, onde podemos selecionar o pop-up necessário, tipo de gatilho “Click On Button” e ativar a opção pop-up Jet Engine Listing .
Salve as alterações e adicione o widget Listing Grid com este modelo de listagem em qualquer página que você precisar. No exemplo descrito, será novamente a página Conta.
Clique no botão agora para ver o pop-up pré-preenchido com o Formulário de Edição.
É tudo por agora. Fique de olho em nossos novos tutoriais para descobrir casos mais interessantes.