---
url: 'https://dxpr.com/pt-pt/hc/documentacao/aprender-dxpr-builder/tutoriais/pagina-sobre-nos'
title: 'Crie uma página Sobre nós | DXPR'
author:
  name: Jurriaan
  url: 'https://dxpr.com/users/jurriaan'
date: '2026-10-24T09:05:18+00:00'
updated: '2026-10-24T19:36:26+00:00'
copyright: 'Copyright DXPR. All rights reserved.'
type: article
summary: |-
  Aqui constrói-se uma página Sobre nós: um cabeçalho de missão, a sua história ao lado de uma foto, três números que contam, cartões de equipa e um apelo à ação final. Use-a quando uma página deve dizer aos visitantes quem é. Para uma página que lista todos os colegas, siga Crie um diretório da equipa.
  O vídeo constrói a página de um estúdio de design em Roterdão.
tags:
  - 'Follow a tutorial'
image: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
published: true
og:
  site_name: DXPR
  updated_time: '2026-10-24T19:36:26+0000'
  'image:alt': 'DXPR, powered by Drupal: AI-powered Drupal for marketers.'
schema:
  '@context': 'https://schema.org'
  '@graph':
    -
      mainEntity: {  }
    -
      '@type': TechArticle
      headline: 'Crie uma página Sobre nós'
      description: |-
        Aqui constrói-se uma página Sobre nós: um cabeçalho de missão, a sua história ao lado de uma foto, três números que contam, cartões de equipa e um apelo à ação final. Use-a quando uma página deve dizer aos visitantes quem é. Para uma página que lista todos os colegas, siga Crie um diretório da equipa.
        O vídeo constrói a página de um estúdio de design em Roterdão.
      image:
        '@type': ImageObject
        url: 'https://dxpr.com/themes/custom/dxpr_com/images/dxpr-share-card.jpg'
        width: '1200'
        height: '630'
      datePublished: '2026-10-24T09:05:18+0000'
      dateModified: '2026-10-24T19:36:26+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/tutoriais/pagina-sobre-nos'
      articleSection: 'Seguir um tutorial'
    -
      '@type': WebPage
      '@id': 'https://dxpr.com/pt-pt/hc/documentacao/aprender-dxpr-builder/tutoriais/pagina-sobre-nos'
      description: |-
        Aqui constrói-se uma página Sobre nós: um cabeçalho de missão, a sua história ao lado de uma foto, três números que contam, cartões de equipa e um apelo à ação final. Use-a quando uma página deve dizer aos visitantes quem é. Para uma página que lista todos os colegas, siga Crie um diretório da equipa.
        O vídeo constrói a página de um estúdio de design em Roterdão.
      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) /[Seguir um tutorial](/pt-pt/hc/documentation/learn-dxpr-builder/tutorials/overview) # Crie uma página Sobre nós.

 Aprender DXPR BuilderCriar páginasSeguir um tutorial

   ## Neste guia

 Guias relacionados

- [Crie um diretório de equipa](/pt-pt/hc/documentacao/aprender-dxpr-builder/tutoriais/diretorio-da-equipa)
- [Adicionar um cartão](/pt-pt/hc/documentacao/aprender-dxpr-builder/elementos/cartao)

Aqui constrói-se uma página Sobre nós: um cabeçalho de missão, a sua história ao lado de uma foto, três números que contam, cartões de equipa e um apelo à ação final. Use-a quando uma página deve dizer aos visitantes quem é. Para uma página que lista todos os colegas, siga [Crie um diretório da equipa](/pt-pt/hc/documentacao/aprender-dxpr-builder/tutoriais/diretorio-da-equipa).

O vídeo constrói a página de um estúdio de design em Roterdão.

  ## Antes de começar

- A sua função tem a permissão **Edit with DXPR Builder**.
- A biblioteca de média tem uma foto do seu escritório, equipa ou produto.
- A página existe: vá a **Content** &gt; **Add content** &gt; **Landing Page** (`/node/add/landing_page`), escreva "About Us" como **Title** e clique em **Save**. A página abre-se com o construtor.
- No DXPR CMS, esconda o título de página do tema nesta página: no seu formulário de edição, abra **DXPR Theme Settings** e marque **Page Title** em **DXPR Hide Regions**. O **Title** do Jumbotron é então o único Heading 1 da página, como explica [Crie páginas amigas de SEO](/pt-pt/hc/documentacao/aprender-dxpr-builder/tutoriais/seo#step-1-start-the-content-at-heading-2).
- Os elementos novos ficam no topo da sua secção ou coluna. Adicione as filas de uma secção, ou os elementos de uma coluna, por ordem inversa, ou arraste-os para o lugar depois.

## Passo 1: adicione um cabeçalho de missão

1. Clique em **Add Elements** na página vazia e escolha **Section** no separador **Layout**.
2. Paire o cursor sobre a secção e abra **More** &gt; **Settings**. Abra o painel **Style**, escolha uma amostra escura de **Background** e clique em **Save**.
3. Clique em **+** na secção e escolha **Jumbotron** no separador **Content**.
4. Escreva a sua declaração de missão como **Title**: "We build websites people enjoy using".
5. Escreva uma frase de apoio no campo **Lead**: "A 24-person studio in Rotterdam working with brands across Europe since 2012."
6. Defina **Type** como **Primary** para texto branco na sua cor primária e clique em **Save**.

## Passo 2: conte a história da sua empresa

1. Paire o cursor sobre a secção e clique em **Add Section Below**, o **+** por baixo dela.
2. Clique em **+** na secção nova e escolha **Row**; vem com duas colunas iguais. Clique no ícone de grelha (**Column layout**) na fila, escolha a predefinição **2/3 + 1/3** e clique em **Save**.
3. Clique em **+** na coluna mais larga e escolha **Text**. Escreva "Our story" como **Heading 2** e depois dois parágrafos curtos: como começou e como corre um projeto. Clique em **Save**.
4. Clique em **+** na coluna mais estreita e escolha **Image**.
5. Clique em **Select Image**, pesquise a biblioteca de média com **Apply filters**, marque uma foto do seu escritório ou equipa e clique em **Insert selected**.
6. Abra o painel **SEO**, preencha o **Alt attribute** e clique em **Save**.

**Dica**

Mantenha a história curta e parta-a com um subtítulo. Os visitantes passam os olhos antes de lerem.

## Passo 3: adicione números-chave com contadores

1. Adicione uma terceira secção com **Add Section Below**. Abra o seu **More** &gt; **Settings**, escolha um **Background** cinzento claro no painel **Style** e clique em **Save**.
2. Clique em **+** na secção e escolha **Row**. Clique no seu ícone de grelha (**Column layout**), escolha a predefinição **1/3 + 1/3 + 1/3** e clique em **Save**.
3. Em cada coluna, adicione um elemento **Text** com o rótulo da estatística: "Projects delivered", "Years in business", "Clients who return".
4. Em cada coluna, clique novamente em **+** e escolha **Number counter**; fica por cima do rótulo. Defina:
    - **End**: a estatística (140, 12, 98)
    - **Suffix**: "+" ou "%" onde se aplica
    - **Thousands separator**: **Comma**
    - **Speed**: 2500, os milissegundos que a contagem demora
5. Clique em **Save** em cada contador.

O contador não tem campo de rótulo próprio, por isso um elemento Text fica por baixo dele.

## Passo 4: construa uma secção de equipa

1. Adicione uma quarta secção com **Add Section Below**.
2. Clique em **+** na secção e escolha **Row**. Clique no seu ícone de grelha (**Column layout**), escolha a predefinição **1/3 + 1/3 + 1/3** e clique em **Save**.
3. Em cada coluna, clique em **+** e escolha **Card**. Abra o seu **More** &gt; **Settings**, defina **Header** como o nome da pessoa ("Sofia Andersen") e **Title** como a sua função ("Creative Director") e clique em **Save**.
4. Clique em **+** na própria secção e escolha **Text**; fica por cima da fila de cartões. Escreva "Meet the team" como **Heading 2**, centre-o e clique em **Save**.

## Passo 5: adicione uma secção final

1. Adicione uma secção final com **Add Section Below** e abra o seu **More** &gt; **Settings**. Em **HTML classes** escolha **Align text center**, para o texto e o botão ficarem centrados juntos. No painel **Style** escolha a cor da sua marca como **Background** e branco como **Font color** e clique em **Save**.
2. Clique em **+** na secção e escolha **Button**. Defina **Title** como "Get in touch", **Link** como `/contact`, **Type** como **Light** e **Size** como **Large**, e clique em **Save**.
3. Clique novamente em **+** na secção e escolha **Text**; fica por cima do botão. Escreva "Want to work with us?" como **Heading 2** e depois "We take on a handful of new clients each quarter." No painel **Style** defina **Font color** como branco e clique em **Save**.

## Passo 6: guarde e pré-visualize

1. Clique em **Save** na barra de ferramentas do construtor.
2. Abra o menu de vista (o **ícone de olho**) e escolha **Preview**.
3. Percorra a página para verificar todas as secções.

## Para ir mais longe

Não mostrado no vídeo, mas que vale a pena adicionar:

- Um **Text** de biografia e um **Image** de retrato dentro de cada cartão, e **Social links** por baixo
- **100% height** nas definições da primeira secção para um cabeçalho que enche o ecrã

## O que vê

A pré-visualização mostra cinco faixas. O cabeçalho escuro traz a sua declaração de missão e a sua abertura em branco. A sua história fica ao lado da foto. Na faixa cinzenta, os três números contam de zero quando entram na vista por deslocamento.

O cabeçalho da equipa fica centrado por cima de três cartões, cada um com um nome e uma função. A faixa final centra um cabeçalho branco sobre um botão **Get in touch** claro. Escolha **Edit** no menu de olho para continuar a trabalhar.

## Se não vir a página como mostrada

- **Não há botão Add Elements na página vazia.** O assistente de criação de páginas está desligado, por isso a página só oferece **Choose a template**. Clique antes na área vazia para abrir o seletor de elementos.
- **Um elemento novo fica por cima do que adicionou antes.** O construtor insere os elementos novos no topo da sua secção ou coluna. Arraste-o para o lugar pela pega de arrasto na sua barra de controlos.
- **Falta Number counter ou Card no seletor.** O seu perfil de utilizador do construtor esconde-o. Peça a um administrador para o marcar em **Elements** em **DXPR Studio** &gt; **DXPR Builder** &gt; **User Profiles** (`/admin/dxpr_studio/dxpr_builder/profile`).
- **As suas mudanças desapareceram depois de recarregar.** Saiu da página antes de clicar em **Save** na barra de ferramentas do construtor. Se Save mostra um erro, veja [As mudanças não guardam](/pt-pt/hc/documentacao/aprender-dxpr-builder/resolucao-de-problemas/falha-ao-guardar).

## E a seguir?

- [Crie um diretório da equipa](/pt-pt/hc/documentacao/aprender-dxpr-builder/tutoriais/diretorio-da-equipa) para uma página de equipa dedicada
- [Adicionar um cartão](/pt-pt/hc/documentacao/aprender-dxpr-builder/elementos/cartao) para tipos de cartões e elementos filhos
- [Elementos de conteúdo](/hc/documentation/learn-dxpr-builder/elements) para a referência completa de elementos