Criando páginas Web com o mLabs pages

Saiba como criar páginas web usando o mLabs Pages. Veja todos os recursos dessa funcionalidade.

Rafael Zindra avatar
Escrito por Rafael Zindra
Atualizado há mais de uma semana
<meta name="robots" content="noindex">

1) Para criar uma Landing Page, acesse a página inicial do mLabs Pages.

2) No menu lateral esquerdo, clique em “Páginas Web”.

3) Clique em “Nova Página Web”.

4) Você poderá optar por um modelo pronto e customizável ou começar uma Landing Page a partir do zero. Escolha uma das opções clicando sobre ela e clique em "Prosseguir”.

5) Defina um nome para a sua página. Essa definição funcionará apenas para controle no painel administrativo.

Como editar uma página pelo mLabs Pages?

No quadro de configurações exibido à direita do conteúdo, existem 4 abas: Conteúdo, Linhas, Corpo e Imagens.

Sugerimos que você comece a configurar a página clicando na aba “Corpo”.

Um menu aparecerá à esquerda do botão clicado. Nele, você poderá escolher uma nova imagem de fundo para a sua página ou editar a existente. Para escolher uma imagem a partir dos seus arquivos, clique no quadro, arraste o arquivo até ele ou cole a URL de uma imagem da internet.

No mesmo menu, você poderá alterar a largura e o alinhamento da imagem e escolher a fonte padrão para a página.

Você também poderá alterar as cores e as formas dos links, caso utilize-os na página.

Após escolher os elementos listados acima, recomendamos que você pense em como ficará à disposição do seu conteúdo em blocos horizontais. Para essa edição, clique na aba “Linhas”.

Escolha quantas colunas cada bloco da página terá. Marque uma opção, arraste até a área da página e solte onde desejar.

Para acrescentar mais linhas à página, repita o processo ou aperte o botão “+” abaixo ou acima de cada bloco.

A cada linha adicionada, dois botões serão exibidos abaixo da linha selecionada: um para remoção da linha e outro para a duplicação de seu conteúdo.

Assim que uma linha é adicionada, você já pode acrescentar elementos nela. Para isso, clique no botão “Adicionar Conteúdo”,

ou acesse a sessão “Conteúdo” no menu lateral, clicando no botão de fechar ao lado da sessão “Linha”.

Depois, clique em “Conteúdo”. Um menu com todos os elementos adicionáveis e personalizáveis aparecerá no editor.

Para adicionar os elementos desejados às linhas criadas, arraste as opções para os blocos.

Toda vez que um componente é acrescentado à página, ao clicar nele, um display com as opções de personalização aparecerá à direita da visualização.

No menu, temos:

Colunas

Com essa opção é possível quebrar um bloco já existente em mais ou menos colunas. Você também poderá alterar a cor de fundo, o espaçamento, a borda e adicionar ou excluir alguma coluna.

Além disso, você poderá alterar as propriedades da linha, como cor e imagem de fundo, além do alinhamento e espaçamento.

Botão

Para configurar um CTA (call to action – chamada para ação) à Landing Page, clique sobre o botão que você arrastou para o bloco. Próximo a ele, você verá também uma barra de formatação para alterar elementos do texto.

No display lateral direito você poderá definir a ação do botão.

Na opção “Abrir Link", você pode customizar a URL de destino e a página será aberta na mesma aba ou em uma nova.

Na opção “Enviar e-mail", você poderá customizar o endereço de destino, o assunto e inserir no corpo o texto do e-mail.

Na opção “Ligar para número de telefone”, é possível customizar o número para o qual você quer que o usuário ligue.

Em “SMS” você poderá indicar o número de telefone para o qual o usuário envirá a mensagem.

Na opção “Enviar WhatsApp”, é possível indicar o número para o qual o usuário enviará a mensagem e a mensagem padrão sugerida.

Ainda no display lateral, você poderá alterar as cores dos link exibidos, bem como a largura e o alinhamento.

No display lateral também é possível editar outros aspectos do botão, como a altura da linha, espaçamento e formato da borda.

Divisor

Com este recurso é possível acrescentar, dentro dos blocos, linhas que dividem o conteúdo para melhorar a leitura ou incrementar o layout.

As opções de personalização envolvem largura, altura, cor, peso, alinhamento.

Título

Você poderá criar títulos e subtítulos para as suas páginas. Para alterar o texto, clique sobre o título que foi adicionado à página. Para alterar a formatação, clique sobre os ícones que aparecem acima ou abaixo da caixa de título.

Eles poderão ser customizados em relação ao tipo de título (Heading Tags), fonte, tamanho da fonte, cor, alinhamento do texto e altura da linha.

HTML

O editor HTML permite você altere o conteúdo diretamente na propriedade HTML. Para isso, clique na caixa que aparecerá a direita da tela e digite ou cole o código desejado.

Imagem

Com este recurso, você poderá acrescentar à página imagens salvas de seu computador, da internet ou do buscador de imagens do próprio mLabs pages.

Para adicionar um arquivo, arraste-o até o campo selecionado ou clique sobre ele para escolher uma imagem.

Para colar uma URL de uma imagem já existente na internet, clique no campo “URL da imagem” e cole o endereço.

Você também poderá alterar a largura, o alinhamento e o texto alternativo da imagem.

Para utilizar uma imagem do buscador nativo, clique na sessão “Imagens” no menu lateral direito,

pesquise por uma palavra-chave no campo indicado, clique sobre a imagem escolhida e arraste-a para a página.

As configurações de customização de imagens permitidas são a largura, o alinhamento, o texto alternativo, a ação desejada e o link de destino da imagem.

Menu

Esta opção permite que você crie um menu de navegação dentro da Landing Page. Para preenchê-lo, clique em “Adicionar um novo item”.

Depois, acrescente o nome do item, a ação do link e o destino desta ação. Repita o processo de acordo com a quantidade de itens que deseja em seu Menu.

Abaixo de “Itens do Menu”, na sessão “Estilos” encontram-se as opções de customização do Menu (fonte, cor do texto, alinhamento, layout, separação, espaçamento).

Social

Aqui, você poderá incluir ícones clicáveis para acesso às redes sociais na página.

Você poderá alterar o layout dos botões no campo indicado.

Para adicionar uma conta específica, clique em seu respectivo ícone.

E, depois, adicione a URL para a qual o botão direcionará.

No display lateral também é possível alterar o alinhamento e o espaçamento dos ícones.

Texto

Nesta opção, você poderá acrescentar blocos de textos em diferentes localizações da página. Para alterar o texto, clique sobre o bloco.

É possível formatar todo o texto na caixa de edição que aprece ao clicar nele.

No display ao lado direito estão as opções de customização de cor, alinhamento do texto e altura da linha.

Formulário

Para acrescentar um formulário de captação de leads previamente criado, clique na caixa inclusa no display lateral e selecione o escolhido.

Como editar a URL de uma página?

1) Clique em Configurações no menu superior.

2) Caso você tenha um domínio, adicione-o à sessão indicada.

3) Preencha, também, o campo indicado com o nome da marca. Caso você não possua um domínio próprio, iremos compor a URL com usando o domínio padrão do mLabs Pages.

4) A próxima etapa da personalização é feita através do próprio editor de páginas, durante a criação da página. O nome escolhido durante criação da página irá compor automaticamente o SLUG (texto que aparece no diretório da URL), como no exemplo a seguir:

Como salvar uma página?

Selecione a opção indicada no menu superior e depois clique em “Salvar Rascunho e Fechar”.

Como publicar uma página?

Selecione a opção indicada no menu superior;
Clique na opção "Publicar Na Web";
Depois em “Salvar, Publicar e Fechar”.

Como excluir uma página?

1) Clique em “Páginas Web” no menu esquerdo.

2) Clique na caixa de lixo ao lado da página que você deseja excluir.

3) Um aviso aparecerá na tela. Caso tenha certeza de que deseja excluir a página, clique no botão “Sim, apague”.

Respondeu à sua pergunta?