Ajustar a estrutura HTML e o layout de uma página

O layout padrão de uma nova página

Uma página recém-criada no CMS bluetronix utiliza automaticamente o Layout Padrão. Este layout forma a estrutura básica em HTML onde o conteúdo do seu site é exibido.

Por meio do Layout Padrão, por exemplo, um cabeçalho e um rodapé são automaticamente incluídos. Outros elementos, como o botão do chatbot, também podem fazer parte dessa estrutura básica.

Se você não quiser exibir certos elementos ou quiser integrar seus próprios elementos no layout de forma padrão, você pode ajustar a estrutura básica em HTML.

Abrir a estrutura HTML básica

Abra Layout ⯈ Layout-Html.

Lá você encontrará as estruturas básicas em HTML existentes ou as definições de layout.

A primeira entrada é o Layout Padrão. Este layout é utilizado por padrão para novas páginas HTML.

Estrutura do Layout Padrão

<!DOCTYPE html>
<html class="wide wow-animation" data-bs-theme="__DB_GB_HTMLDarkMode__" lang="__DB_WebSiteLang__">
<head>
   <meta name="apple-mobile-web-app-capable" content="yes">
   <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=0">
   __DB_HeadTitle__
   <link rel="icon" href="/img/favicon.ico" type="image/x-icon">
   <script src="__FV_/bx_script/BxHeadScript_own_min.js__"></script>
   <link rel="stylesheet" href="__FV_/bx_style/BxStyle_own_min.css__">
</head>
<body>

__DB_Layout_/bx_Header.html__

<main>
   __DB_Layout_Main__
</main>

__DB_Layout_/bx_Footer.html__

<script src="__FV_/bx_script/BxScript_own_min.js__"></script>
</body>
</html>

No Layout Padrão, entre outros, cabeçalhos e rodapés são automaticamente incluídos.

O conteúdo real da sua página HTML é inserido dentro da área Main ou na marca __DB_Layout_Main__.

Além disso, o CMS bluetronix automaticamente define vários valores e marcas. Isso inclui, por exemplo, o Modo Escuro do Bootstrap, o idioma e o título do site.

Além disso, os scripts necessários do bluetronix são executados automaticamente.

O Layout de Página Única

Além do Layout Padrão, também está disponível o layout Página Única.

Esse layout difere do Layout Padrão normal. Nele, por exemplo, o botão de chat e o aviso de cookies podem estar ocultos.

Assim, você pode usar uma estrutura básica diferente para páginas específicas, sem precisar alterar o Layout Padrão de todas as outras páginas.

Criar um layout próprio

Você também pode criar entradas de layout próprias e definir suas próprias estruturas básicas em HTML.

Neste exemplo, criaremos uma entrada de layout própria chamada Layout de Teste.

Dentro desse layout, você pode definir quais componentes devem ser incluídos em uma página por padrão.

Selecionar um layout para uma página

Os layouts definidos podem ser atribuídos diretamente a uma página HTML mais tarde.

Para isso, abra o Editor e vá para Configurações da Página.

Toque na seleção de layout. Ali as definições de layout existentes serão exibidas.

Layouts criados por você, como o Layout de Teste, também estarão disponíveis para seleção.

Mudar o layout de uma página

Escolha o layout desejado e depois toque em Salvar.

A página usará a estrutura de layout selecionada.

Dessa forma, você pode usar diferentes estruturas para diferentes páginas e, por exemplo, definir quais elementos gerais serão exibidos em cada página.

Resumo

O layout determina a estrutura HTML básica de uma página no bluetronix CMS. Novas páginas usam inicialmente o layout padrão.

Através de Layout ⯈ Layout-Html, você pode visualizar layouts existentes e criar suas próprias definições de layout. Em seguida, você pode selecionar o layout desejado através de Configurações da Página ⯈ Layout e aplicar com Salvar.