SÓ HOJE 15% DE DESCONTO

USE O CUPOM: SABADO.FULL

00
Horas
00
Minutos
00
Segundos

Bem vindo ao
Blog da FULL.

Aprenda, crie e cresça seu negócio na internet.

Encontre conteúdos, dicas, tutoriais e novidades sobre as principais ferramentas Wordpress

Termos de layout do WordPress desmistificados (referência rápida)

Você está em:

Termos de layout do WordPress desmistificados (referência rápida)

Você está tentando entender o que significam os termos de layout do WordPress?

Muitos iniciantes se deparam com termos e vocabulário de layout do WordPress ao trabalhar em seu site. Estas são palavras usadas por designers e desenvolvedores e usuários médios podem achá-las confusas.

Neste guia, explicaremos alguns dos termos de layout do WordPress mais usados. Isso ajudará você a entender a linguagem usada para layouts de sites WordPress e trabalhar em seu site como um profissional total.

Explicando os termos comuns de layout do WordPress para iniciantes

Por que aprender os termos de layout do WordPress?

Os temas do WordPress controlam a aparência do seu site. Você pode personalizá-los visitando a página Aparência » Personalizador .

personalizador de temas WordPress

Todos os principais temas do WordPress vêm com opções para modificar o design do seu site usando as configurações do personalizador, mas suas opções são limitadas dependendo do tema.

Para ainda mais flexibilidade, você pode usar plugins do construtor de páginas do WordPress como o SeedProd .

A interface do construtor de páginas SeedProd

O SeedProd permite que você crie facilmente seus próprios layouts personalizados usando ferramentas simples de arrastar e soltar sem escrever nenhum código.

Ele também vem com dezenas de modelos que você pode usar como ponto de partida. Além disso, ele suporta WooCommerce, que ajuda você a criar layouts para sua loja online também.

No entanto, à medida que você trabalha na criação de um layout para seu site, pode encontrar termos de design da Web com os quais talvez não esteja familiarizado.

Aprender esses termos de layout do site ajudará você a entender os blocos de construção do design do site WordPress, para que você possa criar mais facilmente qualquer design que possa imaginar.

Dito isto, vamos desmistificar esses termos comuns de layout do WordPress para aprender o que eles significam e como usá-los.

Aqui está uma lista rápida dos conceitos e termos que explicaremos neste artigo.

Entendendo um layout típico do WordPress

Outros componentes comuns de um layout WordPress

Termos de layout nos construtores de páginas do WordPress

Entendendo um layout típico do WordPress

A maioria dos sites usa um layout muito familiar. Parece algo assim:

Layout comum do WordPress

A área superior de um site é chamada de Cabeçalho, seguida por uma área de Conteúdo e, em seguida, um Rodapé na parte inferior da página.

Dependendo de qual página um usuário está visualizando, o layout pode ser diferente. Por exemplo, em uma página de blog do WordPress , pode incluir uma barra lateral ao lado da área de conteúdo.

Layout da página do blog

Esse layout básico é então preenchido com outros elementos, sobre os quais falaremos mais adiante neste artigo.

Vamos primeiro falar sobre cada uma dessas seções principais com mais detalhes.

Cabeçalho no layout do WordPress

O cabeçalho em um layout do WordPress é a seção superior de qualquer página. Geralmente, ele contém o logotipo do seu site , o título, os menus de navegação, um formulário de pesquisa e outros elementos importantes que você deseja que os usuários vejam primeiro.

Aqui está a aparência da seção de cabeçalho no WPBeginner.

Layout de cabeçalho no site WPBeginner

Cabeçalho personalizado no WordPress Theme Customizer

Muitos temas populares do WordPress vêm com recursos adicionais para personalizar a área do cabeçalho do seu layout do WordPress. Esse recurso às vezes é chamado de cabeçalho personalizado.

Cabeçalho personalizado em um tema WordPress

Dependendo do seu tema do WordPress, você pode adicionar uma imagem de largura total ao cabeçalho com um slogan ou um botão de call-to-action . Alguns temas do WordPress podem permitir que você altere a posição do logotipo, menus de navegação e imagem do cabeçalho.

Plano de fundo personalizado no personalizador de temas do WordPress

Semelhante ao recurso de cabeçalho personalizado, alguns temas do WordPress podem permitir que você defina uma cor de fundo personalizada ou uma imagem em seu site WordPress.

Opção de imagem de fundo no personalizador de temas do WordPress

Normalmente, você pode encontrar essa opção no personalizador de temas. No entanto, às vezes é enterrado dentro de outras guias. Para mais detalhes, dê uma olhada em nosso guia sobre como adicionar uma imagem de plano de fundo no WordPress ou como alterar a cor de plano de fundo no WordPress .

Área de conteúdo no WordPress

A área de conteúdo vem logo após a parte do cabeçalho de um layout. É aqui que o conteúdo principal da página é exibido.

Para um layout de página inicial personalizado , a seção de conteúdo pode incluir uma chamada à ação, seguida de serviços ou produtos, depoimentos e outras informações importantes.

Exemplo de layout de página inicial

As lojas online normalmente usam essa área para promover vendas contínuas, produtos em destaque, itens mais vendidos e muito mais.

Um blog WordPress pode usar um layout de conteúdo pesado com trechos e imagens de artigos recentes, um formulário de inscrição em boletim informativo e muito mais.

Aqui está a aparência do layout da página inicial do WPBeginner. É um site rico em conteúdo, e é por isso que os artigos recentes ocupam toda a área de conteúdo.

Página inicial do WPBeginner

Por padrão, o WordPress usa um layout de blog mostrando suas postagens de blog mais recentes como a página inicial do seu site. No entanto, você pode alterar isso e usar qualquer página como sua primeira página.

Basta ir para Configurações » Página de leitura e escolher ‘Uma página estática’ na opção ‘Sua página inicial é exibida’.

Usando uma página inicial estática

Depois disso, você pode escolher uma página que deseja usar como sua página inicial e outra para a página do seu blog. Para obter mais detalhes, consulte nosso guia sobre como criar uma página separada para suas postagens de blog no WordPress .

Não se esqueça de clicar no botão ‘Salvar alterações’ para armazenar suas configurações.

Agora você pode editar a página escolhida para ser sua página inicial e criar um layout de página inicial personalizado .

Barras laterais em layouts do WordPress

Como o nome sugere, as barras laterais geralmente aparecem à direita ou à esquerda da área de conteúdo.

Exemplo de barra lateral

No WordPress, as barras laterais também são áreas prontas para widgets. Isso significa que você pode adicionar widgets a essa área e exibir elementos como arquivos, formulários de inscrição em boletins informativos, categorias, conteúdo popular e muito mais.

Área de rodapé em layouts do WordPress

A área Rodapé aparece na parte inferior de um layout de página abaixo da área de conteúdo. Geralmente inclui uma área de widget de rodapé onde você pode exibir links para páginas importantes, como política de privacidade , termos e condições, sobre a página e muito mais.

Exemplo de rodapé

Quer saber o que colocar no rodapé do seu site? Veja esta lista de itens para adicionar ao rodapé do seu site WordPress .

Outros componentes de um layout WordPress

Em seguida, veremos alguns dos componentes de um layout do WordPress que você pode adicionar às seções de cabeçalho, conteúdo, barra lateral ou rodapé. Esses são os blocos de construção que ajudam você a criar um layout funcional.

Menus de navegação no WordPress

Menus ou Menus de Navegação são listas horizontais ou verticais de links. A maioria dos sites tem pelo menos um menu de navegação principal exibido na parte superior da área do cabeçalho.

Menus de navegação

No entanto, alguns sites usam vários menus de navegação na área do cabeçalho.

O WordPress também permite exibir menus de navegação como um widget. Esses menus aparecem como uma lista vertical de links e você pode colocá-los nas barras laterais ou nas áreas do widget de rodapé.

Links verticais

Para obter mais detalhes, consulte nosso guia sobre como adicionar menus de navegação no WordPress .

Usando Widgets em um Layout do WordPress

Widgets são elementos que você pode adicionar às áreas prontas para widgets ou barras laterais do seu site WordPress. A maioria dos temas do WordPress vem com várias áreas prontas para widgets, onde você pode adicionar widgets.

O WordPress vem com vários widgets integrados que você pode usar. Muitos plugins populares do WordPress também vêm com seus próprios widgets. Por exemplo, você pode usar widgets para adicionar listas de postagens populares, formulários de contato , anúncios em banner, feeds de mídia social e muito mais.

Você pode ver todos esses widgets visitando a página Aparência » Widgets na área de administração do WordPress.

Adicionando widgets no WordPress

Para obter mais detalhes, consulte nosso guia sobre como adicionar e usar widgets no WordPress .

Usando blocos em layouts do WordPress

O WordPress vem com um poderoso editor de conteúdo chamado editor de blocos . Este editor foi projetado para ajudá-lo a criar belos layouts para suas postagens e páginas do WordPress usando blocos.

Usando blocos para criar layouts no WordPress

Existem diferentes tipos de blocos para os elementos mais comuns de qualquer conteúdo. Por exemplo, você pode adicionar parágrafos, títulos, imagens, galerias, incorporações de vídeo , colunas, tabelas e muito mais.

Isso permite que você crie layouts diferentes para cada postagem ou página em seu site WordPress sem instalar um plugin ou alterar seu tema.

Imagens em destaque em layouts do WordPress

Se você visitar a página inicial do WPBeginner, notará imagens em miniatura ao lado de cada título de artigo. Estas são chamadas de imagens em destaque.

Imagens em destaque no WordPress

O WordPress permite que você defina imagens em destaque para suas postagens e páginas. Seu tema WordPress usa essas imagens em diferentes áreas do seu site. Para saber mais, consulte nosso guia sobre como adicionar imagens em destaque no WordPress .

Imagens de capa no WordPress

Uma imagem de capa geralmente é uma imagem ampla usada como foto de capa para uma nova seção em uma postagem ou página de blog.

Você pode adicioná-lo ao seu post ou página usando o bloco ‘Capa’. O bloco de capa também permite que você use uma cor de fundo em vez de uma imagem.

Imagem da capa no editor de blocos do WordPress

Para saber mais, consulte nosso guia detalhado sobre a diferença entre imagem de capa e imagem em destaque .

Usando padrões no editor do WordPress

Os padrões foram introduzidos no editor de blocos do WordPress no WordPress 5.5 . Cada padrão é uma coleção de blocos organizados em uma ordem específica para layouts comumente usados.

Padrões de bloco no WordPress

Você pode escolher entre botões, estilos de cabeçalho, galerias, colunas e muito mais. Isso facilita para os iniciantes criar layouts rapidamente usando padrões comuns.

É um recurso relativamente novo, portanto, há um conjunto limitado de padrões disponíveis. No entanto, mais padrões ficarão disponíveis à medida que mais temas e plugins do WordPress adicionarem seus próprios padrões ao editor de blocos.

Adicionando botões no layout do WordPress

Os botões desempenham um papel importante no design e no layout de um site moderno. Eles fornecem aos usuários uma frase de chamariz clara, o que ajuda você a expandir seus negócios e conversões.

O editor de blocos padrão vem com seus próprios botões que você pode usar em qualquer postagem ou página do WordPress.

Adicionando botões no WordPress

Seu tema WordPress também pode vir com configurações de botão de chamada para ação no personalizador de temas. Os plugins mais populares do construtor de páginas do WordPress também vêm com botões em vários estilos que você pode usar.

Você pode até adicionar botões clique para ligar no WordPress com um plugin.

Para obter mais detalhes, consulte nosso guia sobre como adicionar botões de chamada para ação no WordPress .

Usando CSS personalizado em layouts do WordPress

CSS é a linguagem de estilo usada para criar sites. Seu tema e plugins do WordPress vêm com suas próprias regras de CSS, mas de tempos em tempos você pode querer mudar pequenas coisas como cor do texto, tamanho da fonte ou cor de fundo.

É aqui que entra o CSS personalizado. O WordPress torna mais fácil para você salvar suas próprias regras de CSS personalizadas. Basta acessar a página Aparência » Personalizar e clicar na guia CSS Adicional.

Abrindo o personalizador de temas para adicionar CSS personalizado

A partir daqui, você pode adicionar suas regras CSS personalizadas e poderá vê-las aplicadas na visualização ao vivo. Para saber mais sobre este tópico, consulte nosso guia completo sobre como adicionar CSS personalizado no WordPress .

Termos de layout nos construtores de páginas do WordPress

A maneira mais fácil de criar layouts personalizados do WordPress para suas páginas de destino é usando um construtor de páginas do WordPress.

Recomendamos usar SeedProd . É o plugin construtor de páginas WordPress mais amigável para iniciantes no mercado.

Outros construtores de páginas usam termos semelhantes para ferramentas e recursos comuns.

Usando modelos nos construtores de páginas do WordPress

Os modelos são a maneira mais rápida de criar um layout de página da web. Todos os plugins populares do construtor de páginas vêm com vários modelos prontos para uso que você pode usar como ponto de partida.

Modelos de SeedProd

Por exemplo, o SeedProd tem modelos para diferentes tipos de páginas que você pode precisar, incluindo páginas de destino , páginas de vendas, páginas 404, páginas em breve e muito mais.

Módulos e blocos nos construtores de páginas do WordPress

Assim como os blocos no editor padrão do WordPress, os plugins do construtor de páginas também usam blocos. Alguns construtores de páginas podem chamá-los de módulos ou elementos, mas são essencialmente a mesma coisa.

No entanto, os plugins do construtor de páginas vêm com mais blocos do que o editor padrão. Por exemplo, o SeedProd inclui blocos para depoimentos, blocos WooCommerce , mapas do Google, formulários de contato, incorporações do Facebook e muito mais.

Blocos SeedProd

Você pode usar blocos para criar seus próprios layouts, movê-los e brincar para descobrir o que funciona melhor para o seu negócio.

Usando seções em seus layouts do WordPress

Semelhante ao recurso ‘Padrões’ no editor padrão, as seções são um conjunto de blocos agrupados para criar instantaneamente áreas comuns de um site. Por exemplo, seção de cabeçalho, imagem principal, tabelas de preços e muito mais.

Seções reutilizáveis ​​no SeedProd

Diferentes plugins do construtor de páginas do WordPress podem usar termos diferentes para eles. Por exemplo, no SeedProd eles são chamados de seções e o Beaver Builder os chama de linhas e colunas salvas.

Esperamos que este artigo tenha ajudado você a aprender sobre os termos usados nos layouts do WordPress. Você também pode conferir nosso guia sobre como aprender WordPress gratuitamente em uma semana , ou nossa comparação das melhores empresas de hospedagem WordPress .

Se você gostou deste artigo, assine nosso canal do YouTube para tutoriais em vídeo do WordPress. Você também pode nos encontrar no Twitter e no Facebook .

Aprenda com a FULL.

Junte-se a mais de 50 mil pessoas que recebem em primeira mão as principais ferramentas e tecnologia para desenvolvimento web

Meu carrinho
🎁 Faltam R$150,00 para liberar o Cupom Secreto
Seu carrinho está vazio.

Parece que você não adicionou nada ao seu carrinho =(