Widget de tabela de preços Elementor: Grátis, com 5 layouts prontos

Tabela de preços é um widget gratuito Master Addons para construir placas de plano em Elementor Escolha um dos 5 layouts, em seguida, preencha o cabeçalho, preço, lista de recursos, botão e fita Cada recurso pode ter seu próprio ícone e dica de ferramenta, o preço pode mostrar o preço original para uma venda, e o botão pode vincular em qualquer lugar ou agir como um botão de compra Easy Digital Downloads Coloque um widget em cada coluna e você tem uma página de preços.

Configurações de cabeçalho, preço e rodapé da tabela de preços no Elementor

Cabeçalho, preço, características, botão e fita

Cada parte do cartão tem suas próprias configurações O cabeçalho leva um ícone, um título, uma legenda e um dos três fundos gradiente, ou suas próprias cores O preço tem um símbolo de moeda de uma lista ou um personalizado, um interruptor de venda com um preço original, e um período de faturamento O rodapé segura o botão, seu link ou item Easy Digital Downloads, e uma linha curta de texto extra, como uma nota de devolução do dinheiro.

  • Ícone de cabeçalho, título, tag HTML, predefinições de legenda e gradiente.
  • Símbolo da moeda, preço de venda com o preço original e período de faturamento.
  • Botão com um link ou item Easy Digital Downloads, além de texto extra do rodapé.

Listas de recursos interativos com ícones e dicas de ferramentas

Cada linha de recursos leva texto, um ícone opcional e uma dica de ferramenta opcional que abre acima, abaixo, à esquerda ou à direita do recurso Use a dica de ferramenta para detalhes que iriam aglomerar a lista, como “Os assentos extra custam US $ 5 por mês”.

  • Os ícones tornam as listas de recursos mais rápidas de digitalizar.
  • As dicas de ferramentas explicam limites ou termos técnicos sem adicionar confusão.
  • Estile o texto do recurso, ícones, divisórias e alinhamento na guia Estilo.
Lista de recursos da tabela de preços com ícones e dicas de ferramentas
Plano de preços destacado com uma fita no Elementor

Formatação de preços, planos e fitas destacadas

Tamanho e alinhamento vertical do símbolo da moeda, a parte fracionária do preço e o preço original separadamenteLigar a Tabela de Destaque para o plano que você deseja que as pessoas escolham, em seguida, adicione uma Fita com texto como “Popular” e defina seu alinhamento, posição e rotação.

  • Tamanho e posição separados para a moeda, centavos e preço original.
  • Destaque Mesa para fazer um plano se destacar.
  • Uma fita com texto, alinhamento, posição e rotação próprios.

Tabela de preços Elementor Pro vs tabela de preços Master Addons

O widget Tabela de Preços do próprio Elementor está apenas no Elementor Pro. Veja como os dois se comparam.

Tabela de preços Elementor ProTabela de preços de complementos mestres
PreçoLicença Elementor ProGrátis
LayoutsUm5
Dicas de ferramentas de recursosNãoSim
Venda e preço originalSimSim
FitaSimSim
Botão Fácil Downloads DigitaisNãoSim
Predefinições de gradiente de cabeçalhoNão3

Comparando muitos recursos entre planos? O Tabela Comparação widget (Pro) lida melhor com longas listas de recursos do que cartões separados.

Dicas de design da mesa de preços

Alguns hábitos tornam uma tabela de preços mais fácil de ler e de comprar.

  • Mostrar três planos Mais opções retardam a decisão.
  • Coloque o plano que você quer vender no meio e destaque-o.
  • Faça do preço o maior texto do cartão.
  • Mantenha os rótulos dos recursos curtos e mova os detalhes para as dicas de ferramentas.
  • Use um botão por cartão e adicione uma nota de devolução do dinheiro no texto do rodapé, se oferecer uma.

Nosso dicas de tabela de preços entrar em mais detalhes.

Visualizador de modelos
Facebook
Twitter
WhatsApp
Copiar link
Compre Agora
Tabela de preços mínimos
Tabela de preços mínimos
Tabela de preços Tabela arredondada
Tabela de preços Tabela arredondada
Tabela de preços com imagem de fundo
Tabela de preços com imagem de fundo
Alternar preços de conteúdo
Alternar preços de conteúdo
Tabela de Preços Padrão
Tabela de Preços Padrão
BG distorcido
BG distorcido

Como adicionar uma tabela de preços no Elementor

Construa um plano primeiro e depois copie-o para os outros para que as linhas de recursos se alinhem.

  1. Adicione um contêiner ou seção com uma coluna por plano Três planos são a configuração mais comum.
  2. Pesquise no painel de widgets por “Pricing Table” e arraste o widget Master Addons para a primeira coluna.
  3. Escolha um layout e preencha o cabeçalho, preço, recursos e botão de rodapé.
  4. Estile o cartão na guia Estilo, duplique o widget nas outras colunas e altere os detalhes do plano.
  5. Ligue a mesa de destaque e uma faixa para o plano que você deseja que os visitantes escolham.

Mantenha as linhas de recursos na mesma ordem em todas as colunas As pessoas leem tabelas de preços linha por linha, portanto, uma ordem mista torna os planos difíceis de comparar.

5 layouts de tabela de preços

O dropdown de Layout no Conteúdo de Preços altera a forma como o cartão é construído Todos os cinco são gratuitos, e seu texto e preços permanecem os mesmos quando você alterna entre eles.

  • Padrão
  • Conteúdo Alinhado Esquerdo
  • Mesa arredondada
  • Tabela com Imagem BG
  • Padrão de BG distorcido

Alterne entre eles enquanto edita para ver qual deles se encaixa na sua página.

Perguntas frequentes para tabela de preços

Saiba as dúvidas mais solicitadas que os usuários têm sobre a Tabela de Preços e encontre respostas em um só lugar.
Posso destacar meu plano de preços mais recomendado?

Sim. Ative a Tabela de Destaque no Precificação do Conteúdo desse plano, depois abra a seção Fita, ligue Mostrar e adicione texto como “Popular” Você pode alinhar, mover e girar a fita e estilizar suas cores.

Sim. ligue a integração Easy Digital Downloads na seção Rodapé e escolha seu item EDD para tornar o botão um botão de compra. Para WooCommerce ou qualquer outro checkout, aponte o link do botão na página do produto ou checkout.

Very. características obter sua própria cor de texto, tipografia, alinhamento, largura e linhas divisórias, e cada linha pode ter seu próprio ícone e dica de ferramenta.

Posso adicionar um padrão de fundo ou imagem ao cabeçalho da tabela de preços?

Sim. Escolha uma das três predefinições de gradiente na seção Cabeçalho ou escolha Personalizado e defina seu próprio plano de fundo de cabeçalho na guia Estilo. A tabela com imagens BG e layouts de padrão Skew BG adicionam uma imagem ou padrão atrás da tabela.

Sim. Cada plano é um widget, então coloque-os em colunas e Elementor empilhar as colunas em telefones Use o modo responsivo para reduzir o tamanho do preço ou preenchimento em telas pequenas.

Sim. Ligue a Venda na seção Preços e insira o Preço Original O widget mostra ao lado do seu preço atual para que os visitantes vejam o desconto.

Widgets e extensões de elementos de tendência

Construa sites sofisticados em menos tempo.

Extensão Master Addons Glassmorphism para Elementor: cartões de vidro fosco com o controle Blur Value definido como 20 px

Glassmorphismo

Extensão de Glassmorphism de Elementor Livre em Casa: Efeito de vidro fosco em uma alternância O Glassmorphism é o fosco...
Ver detalhes
Extensão Master Addons Container Extras para Elementor: contêiner tampado em uma largura máxima de 1400 px, com controles de largura máxima, altura máxima, largura mínima e altura mínima

Contêiner Extras

Home Elementor Container Max Width e Max Height Controls Container Extras é um Master gratuito...
Ver detalhes
Extensão Master Addons Patterns para Elementor: herói com o estilo Purple Gradient Grid Left, mais três estilos de padrões e o painel Habilitar Padrão

Padrões

Início 70+ Padrões de fundo de elementor gratuitos é uma extensão gratuita de complementos mestres que adiciona...
Ver detalhes
Extensão Master Addons Post/Page Duplicator para Elementor: MA Link de linha Duplicator na lista de páginas WordPress criando uma página de destino - rascunho [duplicado #128]

Duplicador de postagem/página

Home Páginas e postagens de elementos duplicados em um clique Post/Page Duplicator é um Master gratuito...
Ver detalhes
Extensão da barra de progresso de leitura de complementos mestres para Elementor: barra azul 42% preenchida na parte superior de uma página de política de privacidade, com configurações de habilitação, posição, altura e preenchimento de cores

Barra de progresso de leitura

Início Adicionar uma barra de progresso de leitura no WordPress (Elementor) A barra de progresso de leitura é gratuita...
Ver detalhes