Como adicionar um contador ao widget Dynamic Repeater

Preparações de back-end

De antemão você precisa criar seu tipo de postagem personalizada e metacaixas , com a ajuda das quais você preencherá as informações nas postagens personalizadas.

No nosso caso, seja Team CPT, em que adicionamos os membros da equipe e os enriquecemos com as informações através de metacampos. Você pode construir qualquer estrutura e usar quantos metacampos precisar.

Adicionando um metacampo repetidor

Para aprender todo o processo de criação de um metacampo repetidor, confira este tutorial .
Para este tutorial usamos campos textuais e aqui está o que obtivemos:

Criação de modelo de listagem

Adicionando um novo item de listagem

Um guia detalhado sobre como criar um modelo de listagem do zero pode ser encontrado aqui .

Então, você precisa navegar até JetEngine > Listagens> Adicionar nova opção. Em seguida, preencha os campos apropriados e crie uma nova listagem.

Layout de listagem de edifícios

Depois que a listagem for criada e as condições definidas, você precisará criar seu layout usando widgets dinâmicos . Confira estes tutoriais para saber como fazer isso.

Configuração do widget de repetidor dinâmico

Veremos mais de perto como ajustar o widget Repetidor Dinâmico para ter uma visão geral da opção de contador de maneira adequada.

Adicionando widget repetidor dinâmico

Agora você precisa arrastar e soltar o widget Dynamic Repeater na página Elementor :

No bloco Conteúdo do widget , selecione o repetidor que você criou no campo Origem e preencha o bloco Formato do item com IDs de nome de repetidor apropriados:

Para ter certeza de que está fazendo tudo corretamente, siga este tutorial :

Habilitando opção de contador

Chegamos à essência do nosso tutorial.
Role um pouco para baixo e, no bloco Conteúdo, encontre o botão Adicionar contador aos itens do repetidor . Habilitá-lo:

Como você pode ver, aqui você pode ajustá-lo:

• adicione zero à esquerda antes dos itens do contador;
• adicione texto após o número do contador;
• alterar a posição do contador.

Veja como funciona:

Estilizando o balcão

Agora podemos mudar a aparência do Repetidor Dinâmico e do contador. Mude para a aba Estilo e no bloco de acordeão Geral mude a direção , por exemplo:

Em seguida, abra um bloco de acordeão do Contador e veja a variedade de configurações que você pode usar. Brinque com eles para obter o melhor resultado:

Isso é tudo! Bastante fácil, não é?