--- url: 'https://dxpr.com/pt-pt/hc/documentacao/aprender-dxpr-builder/elementos/botao' title: 'Adicionar um botão | DXPR' author: name: Jurriaan url: 'https://dxpr.com/users/jurriaan' date: '2026-10-24T14:10:45+00:00' updated: '2026-10-24T17:19:22+00:00' copyright: 'Copyright DXPR. All rights reserved.' type: article summary: 'Obtém um botão claro de chamada para ação que envia os visitantes para onde os quer levar. Utilize-o para levar pessoas a um formulário de registo, uma página de produto ou uma página de contacto.' tags: - Marketing image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' published: true og: site_name: DXPR updated_time: '2026-10-24T17:19:22+0000' 'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.' schema: '@context': 'https://schema.org' '@graph': - mainEntity: { } - '@type': TechArticle headline: 'Adicionar um botão' description: 'Obtém um botão claro de chamada para ação que envia os visitantes para onde os quer levar. Utilize-o para levar pessoas a um formulário de registo, uma página de produto ou uma página de contacto.' image: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg' width: '1200' height: '630' datePublished: '2026-10-24T14:10:45+0000' dateModified: '2026-10-24T17:19:22+0000' author: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR url: 'https://dxpr.com/' logo: '@type': ImageObject url: 'https://dxpr.com/themes/custom/dxpr_com/dxpr-logo-dark.svg' width: '1348' height: '501' mainEntityOfPage: 'https://dxpr.com/pt-pt/hc/documentacao/aprender-dxpr-builder/elementos/botao' articleSection: Marketing - '@type': WebPage '@id': 'https://dxpr.com/pt-pt/hc/documentacao/aprender-dxpr-builder/elementos/botao' description: 'Obtém um botão claro de chamada para ação que envia os visitantes para onde os quer levar. Utilize-o para levar pessoas a um formulário de registo, uma página de produto ou uma página de contacto.' breadcrumb: '@type': BreadcrumbList itemListElement: - '@type': ListItem position: 1 name: Início item: 'https://dxpr.com/pt-pt' publisher: '@type': Organization '@id': 'https://dxpr.com/#organization' name: DXPR inLanguage: pt-pt --- [Centro de ajuda](/pt-pt/node/75)/[Documentação](/pt-pt/hc/documentacao) /[Aprender DXPR Builder](/pt-pt/hc/documentation/learn-dxpr-builder) /[Criar páginas](/pt-pt/hc/documentation/learn-dxpr-builder/build) /[Adicionar conteúdos](/pt-pt/hc/documentation/learn-dxpr-builder/elements) /[Marketing](/pt-pt/hc/documentation/learn-dxpr-builder/elements/marketing) # Adicionar um botão. Aprender DXPR BuilderCriar páginasAdicionar conteúdosMarketing ## Neste guia Guias relacionados - [Altere o aspeto de um elemento no painel Style](/pt-pt/hc/documentacao/aprender-dxpr-builder/definicoes-de-elementos/separador-de-estilo) Obtém um botão claro de chamada para ação que envia os visitantes para onde os quer levar. Utilize-o para levar pessoas a um formulário de registo, uma página de produto ou uma página de contacto. ## Adicionar um botão Abra a sua página com sessão iniciada: os controlos do construtor aparecem quando paira o cursor sobre a área de conteúdo. [Crie a sua primeira página](/pt-pt/hc/documentacao/aprender-dxpr-builder/primeiros-passos/primeira-pagina) mostra o essencial. 1. Paire o cursor sobre a coluna e clique em **+** na barra de controlos, ou clique em **Add Elements** numa página vazia. Abra o separador **Content** e clique em **Button**. O elemento é colocado no topo da coluna e o diálogo de definições abre. 2. Substitua o texto predefinido em **Title** pelo rótulo do seu botão. 3. Introduza o destino em **Link**, como `/contact` ou `https://example.com`. 4. Escolha uma cor em **Type**. Aqui escolhemos **Success**. 5. Escolha o **Size**. Aqui escolhemos **Large**. 6. Clique em **Save** no diálogo. Depois clique em **Save** na barra de ferramentas no topo da área de conteúdo para guardar a página. ## O que vê Um botão com o rótulo que escreveu aparece no topo da coluna. No vídeo, é grande e verde e diz Register for Open Day. As ligações não abrem enquanto edita. Para testar o seu, guarde a página, escolha **Preview** no menu de vista da barra de ferramentas e clique no botão. Os visitantes veem-no depois de guardar a página e de esta ser publicada. ## Configurar o botão Paire o cursor sobre o elemento e abra **More > Settings** na barra de controlos. Opções: - **Title:** o texto no botão. - **Link:** para onde o botão vai: um caminho no seu site, como `/contact`, ou um URL completo. - **Link target:** abre a ligação na Same window ou numa New window. Aparece quando **Link** tem um valor. - **Type:** o estilo de cor: Primary, Secondary, Success, Info, Warning, Danger, Link, Light ou Dark. - **Block button:** estica o botão por toda a largura da coluna. - **Outline style:** mostra bordo e texto coloridos sem preenchimento. O tipo Link não tem contorno e parece sempre uma ligação de texto. - **Size:** Normal, Large ou Small. ## Se não o vir - **O Button não está no separador Content.** O seu perfil de utilizador oculta-o. Peça a um administrador para o ativar em [User Profiles](/pt-pt/hc/documentacao/aprender-dxpr-builder/administracao/administracao-de-perfis-de-utilizador). - **Desapareceu depois de recarregar.** A página não foi guardada. Adicione-o novamente e clique em **Save** na barra de ferramentas no topo da área de conteúdo. - **Um clique leva a "page not found".** O caminho de **Link** está errado. Caminhos no seu site começam por `/`, como `/contact`. Paire o cursor sobre o elemento e abra **More > Settings** para o corrigir. - **O botão parece diferente do vídeo.** O aspeto vem de **Type**, **Outline style**, **Block button** e **Size**. Paire o cursor sobre o elemento e abra **More > Settings** para os verificar. - **A ligação abre no mesmo separador.** **Link target** é Same window. Preencha primeiro **Link** e depois escolha New window. ## E a seguir? [Separador Style](/pt-pt/hc/documentacao/aprender-dxpr-builder/definicoes-de-elementos/separador-de-estilo) para alterar o espaçamento e o fundo do seu botão.