{"id":3487,"date":"2025-02-17T03:05:58","date_gmt":"2025-02-17T03:05:58","guid":{"rendered":"https:\/\/tableberg.com\/?p=3487"},"modified":"2025-04-23T09:37:44","modified_gmt":"2025-04-23T09:37:44","slug":"como-adicionar-uma-tabela-de-precos-com-faixa-de-opcoes-no-wordpress","status":"publish","type":"post","link":"https:\/\/tableberg.com\/pt\/how-to-add-a-pricing-table-with-ribbon-in-wordpress\/","title":{"rendered":"Como adicionar uma tabela de pre\u00e7os com faixa de op\u00e7\u00f5es no WordPress"},"content":{"rendered":"<p>A apresenta\u00e7\u00e3o de suas tabelas de pre\u00e7os \u00e9 importante para influenciar os clientes. Uma maneira eficiente de aprimorar as tabelas de pre\u00e7os \u00e9 incorporar uma faixa de op\u00e7\u00f5es. Visualmente, \u00e9 uma faixa impressionante de etiquetas exibidas diagonalmente em uma tabela para destacar ofertas, descontos e recursos espec\u00edficos.<\/p>\n\n\n\n<p>Quer voc\u00ea esteja promovendo um desconto por tempo limitado, um recurso especial ou pacotes de grande venda, uma fita bem posicionada pode influenciar instantaneamente os clientes em potencial a tomar decis\u00f5es. <a href=\"https:\/\/wordpress.org\/plugins\/tableberg\/\" target=\"_blank\" rel=\"noreferrer noopener nofollow\">Tableberg<\/a> \u00e9 um plug-in intuitivo e avan\u00e7ado para fazer isso.<\/p>\n\n\n\n<p>Nesta postagem, mostraremos a voc\u00ea como adicionar uma tabela de pre\u00e7os com faixa de op\u00e7\u00f5es no WordPress com o Tableberg.<\/p>\n\n\n\n<figure class=\"wp-block-embed is-type-video is-provider-youtube wp-block-embed-youtube wp-embed-aspect-16-9 wp-has-aspect-ratio\"><div class=\"wp-block-embed__wrapper\">\n<iframe loading=\"lazy\" title=\"Como adicionar uma tabela de pre\u00e7os com faixa de op\u00e7\u00f5es no WordPress\" width=\"500\" height=\"281\" src=\"https:\/\/www.youtube.com\/embed\/SSv8XHstwLQ?feature=oembed\" frameborder=\"0\" allow=\"accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share\" referrerpolicy=\"strict-origin-when-cross-origin\" allowfullscreen><\/iframe>\n<\/div><\/figure>\n\n\n\n<p>Depois de instalar o plug-in em seu site, comece a seguir o tutorial.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 1: Adicionar o bloco Tableberg ao Editor<\/h2>\n\n\n\n<p>O plug-in adiciona um bloco chamado <strong>Tableberg<\/strong> \u00e0 biblioteca de blocos do Gutenberg. Para adicionar o bloco ao editor, basta pressionar <strong>o \u00edcone de mais (+)<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor.webp\" alt=\"Adicione o bloco TableBerg ao seu editor do Gutenberg\" class=\"wp-image-481\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/01\/Find-and-add-the-TableBerg-block-to-your-Gutenberg-editor-768x392.webp 768w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Defina o n\u00famero de colunas e linhas necess\u00e1rias para sua tabela. Para este tutorial, definiremos <strong>3*1<\/strong> para colunas e linhas.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"653\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns.webp\" alt=\"Definir o n\u00famero de linhas e colunas\" class=\"wp-image-3014\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-1024x522.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Select-the-number-of-rows-and-columns-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Voc\u00ea pode ver que o layout b\u00e1sico da tabela de pre\u00e7os foi criado com colunas e uma linha.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes.webp\" alt=\"Colunas e linhas s\u00e3o adicionadas ao editor\" class=\"wp-image-3113\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/08\/Rows-and-columns-selected-for-designing-Icon-Boxes-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 2: Adicionar conte\u00fado \u00e0 tabela<\/h2>\n\n\n\n<p>Uma tabela de pre\u00e7os geralmente inclui nomes de produtos, imagens, pre\u00e7os, pre\u00e7os com desconto e bot\u00f5es de CTA. Vamos ver como adicion\u00e1-los \u00e0 tabela.<\/p>\n\n\n\n<h3 class=\"wp-block-heading\">Adicionar o nome do produto<\/h3>\n\n\n\n<p>O Tableberg permite que voc\u00ea adicione diferentes tipos de blocos \u00e0s suas c\u00e9lulas, como o editor de blocos do Gutenberg. Adicione o bloco <strong>Bloco de par\u00e1grafos<\/strong> para escrever o nome do produto. (Por padr\u00e3o, o bloco de par\u00e1grafos \u00e9 adicionado \u00e0s c\u00e9lulas da tabela).<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table.webp\" alt=\"Adicione o bloco de par\u00e1grafos \u00e0 tabela de pre\u00e7os\" class=\"wp-image-3488\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-paragraph-block-to-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Escreva o nome de seu produto na c\u00e9lula. Alinhe o texto centralmente, deixe-o em negrito, altere sua cor e redimensione-o usando as op\u00e7\u00f5es mostradas na imagem abaixo.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it.webp\" alt=\"Escreva o nome do produto e personalize-o\" class=\"wp-image-3490\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Write-the-products-name-and-customize-it-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Adicionar a imagem do produto<\/h3>\n\n\n\n<p>Adicione o bloco Image \u00e0 tabela de pre\u00e7os.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table.webp\" alt=\"Adicionar o bloco Image \u00e0 tabela de pre\u00e7os\" class=\"wp-image-3491\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Image-block-to-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>O bloco de imagem permitir\u00e1 que voc\u00ea carregue a imagem do produto. Redimensione a imagem conforme necess\u00e1rio e alinhe-a adequadamente.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-large has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1024\" height=\"523\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-1024x523.webp\" alt=\"Carregar a imagem do produto\" class=\"wp-image-3493\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image-18x9.webp 18w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Upload-the-product-image.webp 1280w\" sizes=\"auto, (max-width: 1024px) 100vw, 1024px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Adicionar um pre\u00e7o anterior<\/h3>\n\n\n\n<p>Mostrar a diferen\u00e7a entre o pre\u00e7o anterior e o atual \u00e9 uma \u00f3tima maneira de destacar o desconto. Portanto, vamos adicionar um pre\u00e7o anterior sob a imagem do produto.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price.webp\" alt=\"Escreva o pre\u00e7o anterior\" class=\"wp-image-3494\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-a-Previous-Price-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Adicionar um efeito de tachado ao pre\u00e7o anterior pode chamar a aten\u00e7\u00e3o das pessoas. Para fazer isso, <strong>selecione o pre\u00e7o<\/strong> usando o cursor. <strong>Clique em<\/strong> o <strong>Mais op\u00e7\u00f5es<\/strong> na barra de ferramentas.<\/p>\n\n\n\n<p><strong>Ir para<\/strong> o <strong>Destaque<\/strong> e <strong>Op\u00e7\u00f5es de tachado<\/strong>. Voc\u00ea poder\u00e1 alterar a cor do pre\u00e7o e adicionar um tachado.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price.webp\" alt=\"Adicionar o efeito de tachado ao pre\u00e7o\" class=\"wp-image-3495\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-strikethrough-effect-to-the-price-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Adicionar o pre\u00e7o atual do produto<\/h3>\n\n\n\n<p>Agora, adicione o pre\u00e7o atual do produto em uma fonte comparativamente maior para chamar a aten\u00e7\u00e3o das pessoas.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product.webp\" alt=\"Adicionar o pre\u00e7o atual do produto\" class=\"wp-image-3496\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-Current-Price-of-the-Product-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h3 class=\"wp-block-heading\">Adicionar um bot\u00e3o de CTA<\/h3>\n\n\n\n<p>No final de todo o conte\u00fado, adicione a tag <strong>Bloco de bot\u00f5es<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table.webp\" alt=\"Adicione o bloco de bot\u00f5es \u00e0 tabela de pre\u00e7os\" class=\"wp-image-3497\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-the-button-block-to-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Altere a cor de fundo, a cor do texto, o tamanho da tipografia e o preenchimento do bot\u00e3o. Fa\u00e7a essas altera\u00e7\u00f5es como desejar.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table.webp\" alt=\"Personalize o bot\u00e3o de CTA da tabela de pre\u00e7os\" class=\"wp-image-3498\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-CTA-button-of-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 3: Adicionar espa\u00e7os entre os blocos<\/h2>\n\n\n\n<p>Portanto, o conte\u00fado da coluna est\u00e1 pronto. Mas, como voc\u00ea pode ver, todos os blocos est\u00e3o muito congestionados. Precisamos adicionar espa\u00e7amento entre eles para criar um visual mais fresco.<\/p>\n\n\n\n<p>Para fazer isso, <strong>selecionar a coluna espec\u00edfica<\/strong>. Em seguida, v\u00e1 para a se\u00e7\u00e3o <strong>Guia Estilos<\/strong>. Venha para o <strong>Espa\u00e7amento entre blocos<\/strong> op\u00e7\u00e3o rolando a guia. Aumente o espa\u00e7o adicionando um valor \u00e0 caixa.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks.webp\" alt=\"Adicionar espa\u00e7os entre os blocos\" class=\"wp-image-3499\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Spaces-Between-the-Blocks-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Da mesma forma, adicione conte\u00fado \u00e0s outras colunas. Mas, para economizar tempo, voc\u00ea pode duplicar a coluna e depois atualizar o conte\u00fado. Aqui est\u00e1 um guia sobre <a href=\"https:\/\/tableberg.com\/pt\/documentos\/como-duplicar-uma-coluna-de-linha\/\" target=\"_blank\" rel=\"noreferrer noopener\">como duplicar uma coluna e uma linha do Tableberg<\/a>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table.webp\" alt=\"Preencha as outras colunas da tabela de pre\u00e7os\" class=\"wp-image-3500\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Fill-the-other-columns-of-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 4: Adicionar raio \u00e0s colunas da tabela<\/h2>\n\n\n\n<p>Voc\u00ea pode aprimorar a est\u00e9tica adicionando um raio de borda \u00e0s colunas da tabela. <strong>Selecione<\/strong> o <strong>\u00cdcone de Tabelberg<\/strong> na barra de ferramentas. <strong>Ir para<\/strong> o <strong>Guia Estilos<\/strong>. <\/p>\n\n\n\n<p>Rolagem e <strong>vir para<\/strong> <strong>Espa\u00e7amento entre c\u00e9lulas<\/strong>. Ao arrastar a respectiva op\u00e7\u00e3o, voc\u00ea pode adicionar espa\u00e7os entre as colunas da tabela.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns.webp\" alt=\"Adicionar raio \u00e0s colunas da tabela\" class=\"wp-image-3501\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-Radius-to-the-Table-Columns-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p><span style=\"box-sizing: border-box; margin: 0px; padding: 0px;\">Voc\u00ea ver\u00e1 o&nbsp;<strong>Borda da mesa<\/strong>&nbsp;logo abaixo. <strong>Conjunto<\/strong> seu desejo <strong>Valor do raio<\/strong> fo<\/span>r tanto a borda interna quanto a externa. <\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns.webp\" alt=\"Adicionar redius \u00e0s colunas da tabela\" class=\"wp-image-3502\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Add-redius-to-the-table-columns-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Assim, voc\u00ea pode preparar sua tabela de pre\u00e7os.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Etapa 5: Adicionar uma faixa de op\u00e7\u00f5es \u00e0 tabela de pre\u00e7os<\/h2>\n\n\n\n<p>Selecione a coluna \u00e0 qual voc\u00ea deseja adicionar uma faixa de op\u00e7\u00f5es. Pressione o \u00edcone de mais (+) e localize a op\u00e7\u00e3o <strong>Bloco de fitas<\/strong>. Em seguida, clique e o bloco na coluna.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon.webp\" alt=\"Selecione uma coluna para adicionar uma faixa de op\u00e7\u00f5es\" class=\"wp-image-3503\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Select-a-column-to-add-a-ribbon-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>A faixa de op\u00e7\u00f5es ser\u00e1 adicionada \u00e0 tabela. Em seguida, na se\u00e7\u00e3o <strong>Guia Configura\u00e7\u00f5es<\/strong>Selecione o tipo de fita, o texto da fita, o lado e a dist\u00e2ncia. <\/p>\n\n\n\n<p>Depois disso, personalize o texto e a cor de fundo na se\u00e7\u00e3o <strong>Guia Estilos<\/strong>.<\/p>\n\n\n\n<figure class=\"wp-block-image aligncenter size-full has-custom-border\"><img loading=\"lazy\" decoding=\"async\" width=\"1280\" height=\"654\" src=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table.webp\" alt=\"Personalize a faixa de op\u00e7\u00f5es na tabela de pre\u00e7os\" class=\"wp-image-3504\" style=\"border-width:1px;border-radius:3px\" srcset=\"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table.webp 1280w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table-300x153.webp 300w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table-1024x523.webp 1024w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table-768x392.webp 768w, https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/Customize-the-ribbon-on-the-pricing-table-18x9.webp 18w\" sizes=\"auto, (max-width: 1280px) 100vw, 1280px\" \/><\/figure>\n\n\n\n<p>Portanto, sua tabela de pre\u00e7os est\u00e1 pronta com uma fita.<\/p>\n\n\n\n<h2 class=\"wp-block-heading\">Fechando!<\/h2>\n\n\n\n<p>Espero que voc\u00ea tenha gostado deste tutorial. Mas h\u00e1 v\u00e1rios pontos que voc\u00ea deve lembrar. Certifique-se de que sua tabela esteja limpa e organizada. Os designs minimalistas de tabelas de pre\u00e7os sempre causam impacto nos clientes em potencial.<\/p>\n\n\n\n<p>Em segundo lugar, use um texto claro e conciso que conecte instantaneamente os visitantes da Web. Se poss\u00edvel, adicione alguns benef\u00edcios\/caracter\u00edsticas dos produtos na tabela. Se quiser abranger v\u00e1rios planos em suas tabelas de pre\u00e7os, \u00e9 melhor exibi-los com um bot\u00e3o de altern\u00e2ncia.<\/p>\n\n\n\n<p>Aqui est\u00e1 um guia sobre <a href=\"https:\/\/ultimateblocks.com\/how-to-create-a-pricing-table-with-toggle-switch-in-wordpress\/\" target=\"_blank\" rel=\"noreferrer noopener\">Como criar uma tabela de pre\u00e7os com o bot\u00e3o de altern\u00e2ncia no WordPress<\/a>.<\/p>","protected":false},"excerpt":{"rendered":"<p>The presentation of your pricing tables is important in influencing customers. One powerful way to enhance pricing tables is by incorporating a ribbon. It&#8217;s visually a striking banner of labels displayed diagonally across a table to highlight specific offers, discounts, and features. Whether you are promotion a limited-time discount, special feature, or hot-selling packages, a [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":3508,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_eb_attr":"","footnotes":""},"categories":[7],"tags":[86,113],"class_list":["post-3487","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-how-to","tag-pricing-tables","tag-ribbon-block"],"featured_image_src":"https:\/\/tableberg.com\/wp-content\/uploads\/2024\/09\/How-to-Add-a-Pricing-Table-with-Ribbon-in-WordPress.webp","author_info":{"display_name":"Istiak Rayhan","author_link":"https:\/\/tableberg.com\/pt\/author\/wpx_irayhan\/"},"_links":{"self":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/posts\/3487","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/comments?post=3487"}],"version-history":[{"count":5,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/posts\/3487\/revisions"}],"predecessor-version":[{"id":8451,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/posts\/3487\/revisions\/8451"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/media\/3508"}],"wp:attachment":[{"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/media?parent=3487"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/categories?post=3487"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/tableberg.com\/pt\/wp-json\/wp\/v2\/tags?post=3487"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}