Navegando pelo editor do Cloudbeds Websites

Gabriela Garcia

Atualizado 30 de setembro de 2026 09:09

Objetivo	Entender as principais áreas e controles no Editor 2.0 do Cloudbeds Websites.
Indicado para	Clientes que gerenciam ou atualizam um site da Cloudbeds.
Use este guia quando	Você estiver trabalhando no editor do site e precisar identificar onde estão localizadas as ferramentas de navegação, design, conteúdo, publicação e colaboração.
Requisitos	Um site da Cloudbeds que você possa abrir no editor.
Resultado esperado	Você poderá identificar as principais áreas do Editor 2.0 e escolher os controles corretos para a tarefa do site que deseja realizar.

Introdução

O Editor do Cloudbeds Websites reúne ferramentas de navegação, conteúdo, design, publicação e colaboração em um único espaço de trabalho. Entender onde cada controle está localizado ajuda você a navegar pelo editor com mais confiança e escolher a ferramenta certa para a alteração que deseja fazer.

Este guia foca na orientação da interface. Fluxos de trabalho detalhados para personalizar o site, gerenciar mídias, trabalhar com widgets e usar o recurso de Comentários do Site em seus guias dedicados.

Conteúdo

Visão geral do Editor 2.0
Barra de navegação superior
Trabalhe nas visualizações para computador, tablet e celular
Painel lateral
Painel de design
Controles de widgets e elementos

Visão geral do Editor 2.0

O espaço de trabalho do Editor 2.0 é organizado em torno da Barra de Navegação Superior, do Painel Lateral, do Painel de Design e dos controles que aparecem quando você seleciona um elemento ou widget na página. Juntas, essas áreas permitem que você navegue pelo site, gerencie ferramentas em todo o site e edite elementos individuais da página.

Use a visualização completa do editor para se familiarizar com a localização dessas áreas antes de trabalhar com os controles individuais descritos abaixo.

A visualização completa do editor mostra a tela do site junto com os controles de navegação e edição que permanecem disponíveis enquanto você trabalha.

Use a Barra de Navegação Superior para alternar entre páginas e visualizações por dispositivo, revisar ou publicar o site, acessar ferramentas de colaboração e abrir recursos em nível de site.

Menu hambúrguer (≡): Abre opções como Painel de Controle do Projeto, idioma do editor e Ajuda.
Painel de Controle do Projeto: Abre informações em nível de site, como detalhes da visão geral do site, atividades, métricas e respostas de formulários.
Idioma: Altera o idioma da interface do editor. Isso não altera o idioma do conteúdo do seu site.
Ajuda: Abre os recursos disponíveis de ajuda e suporte.
Seletor de página: Alterna entre as páginas do seu site.
Visualizações por dispositivo: Alterna entre as visualizações para computador, tablet e celular para que você possa revisar e ajustar como a página é exibida em cada tipo de dispositivo. Consulte a seção Trabalhe nas visualizações para computador, tablet e celular para entender como as alterações são aplicadas entre os layouts dos dispositivos.
Desfazer e Refazer: Reverte ou reaplica alterações recentes.
Status de salvamento: Mostra se suas últimas alterações foram salvas.
Comentários do site: Abre o painel de comentários para que você possa adicionar ou revisar comentários diretamente no site.
Compartilhar: Abre as opções disponíveis para compartilhar o site.
Pré-visualização: Abre uma pré-visualização para que você possa revisar o site e testar sua funcionalidade antes de publicar as alterações.
Publicar ou Republicar: Publica o site ou aplica suas últimas alterações em um site já publicado.
Início: Retorna você à área principal do site ou painel.

A Barra de Navegação Superior mantém a navegação entre páginas, pré-visualizações por dispositivo, ferramentas de revisão e controles de publicação disponíveis enquanto você trabalha.

Trabalhe nas visualizações para computador, tablet e celular

O Cloudbeds Websites utiliza design responsivo para que seu site se adapte a diferentes tamanhos de tela. Use as visualizações Computador, Tablet e Celular na Barra de Navegação Superior para revisar como seu conteúdo e layout aparecem em cada tipo de dispositivo.

Quando você faz alterações nas colunas na visualização Computador, essas alterações também se aplicam aos layouts correspondentes de Tablet e Celular.

Se você fizer uma alteração específica para o dispositivo na visualização Tablet ou Celular, essa alteração não afetará o layout para Computador. Depois que essa visualização de dispositivo for personalizada, alterações futuras no layout para Computador não serão mais aplicadas automaticamente a esse layout personalizado.

Revise as três visualizações de dispositivo antes de finalizar suas alterações para confirmar que o layout, as imagens e o conteúdo são exibidos corretamente em todos os tamanhos de tela.

Painel lateral

O Painel lateral é o centro de comando principal para construir, organizar e gerenciar seu site. Cada ícone abre um grupo diferente de ferramentas, desde adicionar elementos de página até gerenciar configurações gerais do site.

Adicionar: Adicione elementos e widgets à página.
Páginas: Construa e organize a estrutura do site e gerencie as configurações específicas de cada página.
Camadas: Revise a hierarquia visual da página, incluindo como os elementos estão organizados e aninhados.
Tema: Gerencie as configurações de design em todo o site, como cores globais, tipografia, botões, imagens e fundos. As alterações feitas em elementos ou páginas individuais podem substituir as configurações do Tema do Site. Para fluxos de trabalho detalhados de design, consulte Personalize seu site da Cloudbeds com o Tema do Site.
CMS / Gerenciamento de Conteúdo: Acesse ferramentas de gerenciamento de conteúdo, incluindo o Gerenciador de Mídia e Dados Comerciais.
Gerenciador de Mídia: Carregue e organize mídias reutilizáveis do site. Para orientações sobre imagens e mídias, consulte Gerencie imagens e mídias nos Cloudbeds Websites.
Dados Comerciais: Gerencie informações comerciais estruturadas que podem ser conectadas aos elementos do site.
SEO / AEO: Revise a visibilidade em buscas e IA, o tráfego, o status de otimização e recomendações para melhorar SEO e AEO.
Blog: Crie, lance e gerencie posts de blog.
Mais / Configurações: Acesse configurações e ferramentas adicionais em nível de site, incluindo favicon e imagens sociais, ferramentas do Google, redirecionamentos de URL, backups do site, configurações de privacidade, respostas de formulários, configurações da página 404, exportação do site e configurações de Progressive Web App.
Assistente de IA: Use ferramentas com inteligência artificial para ajudar a criar, refinar e otimizar o conteúdo do site. Consulte o artigo Assistente de IA do Editor do Cloudbeds Websites para orientações dedicadas.

Use o Painel Lateral quando precisar abrir uma ferramenta em nível de site, em vez de alterar o estilo de um item selecionado.

O Painel Lateral permanece fixo no lado esquerdo do editor para que você possa abrir ferramentas em nível de site sem sair da área de edição da página.

Painel de Design

Selecione um elemento, widget, coluna ou outra área editável na página para abrir as opções de design disponíveis para esse item no Painel de Design. Use este painel para ajustar a aparência e o estilo do item selecionado.

O Painel de Design se aplica ao item selecionado, enquanto o Tema no Painel Lateral gerencia configurações de design mais amplas para todo o site. Use essa distinção para determinar se uma alteração de design deve afetar um item específico ou o site como um todo.

O painel de design aparece ao lado da tela do editor quando você seleciona uma área editável e abre seus controles de design.

Neste exemplo, ao selecionar uma coluna e escolher Design, as configurações disponíveis para essa coluna são exibidas no painel à direita.

Quando você seleciona um elemento ou widget na página, uma barra de ferramentas flutuante oferece ações rápidas para esse item. As ações disponíveis variam conforme o que você seleciona.

Editar conteúdo: Altere o conteúdo exibido pelo elemento selecionado.
Editar design: Abra as opções de design para o elemento selecionado.
Reposicionar: Mova o elemento selecionado dentro da estrutura da página.
Adicionar: Adicione outro elemento ou widget próximo.
Duplicar: Crie uma cópia do elemento selecionado.
Alinhar: Ajuste o alinhamento do elemento quando o elemento selecionado suportar essa função.
Excluir: Remova o elemento selecionado.
Mais: Abra ações adicionais disponíveis para o elemento selecionado.

Para fluxos completos de trabalho com widgets, incluindo adicionar e gerenciar widgets, consulte Widgets para o Cloudbeds Websites.

A barra de ferramentas flutuante oferece acesso rápido às ações comuns sem sair do elemento selecionado.

Selecionar um elemento existente na página exibe sua barra de ferramentas flutuante, enquanto o painel à direita mostra as configurações de design disponíveis para esse item selecionado.

Agora que você pode identificar as principais áreas da interface do Editor 2.0, use estes recursos para uma orientação mais ampla sobre o Cloudbeds Websites e os fluxos de trabalho atuais de design: