Árvore de páginas

Versões comparadas

Chave

  • Esta linha foi adicionada.
  • Esta linha foi removida.
  • A formatação mudou.

Index

Índice
outlinetrue
exclude.*ndice
stylenone

Speaking of page designer...

The page designer allows users to configure elements to be displayed on screen, based on each element’s order and properties.

...

Nota

Changes made to the page are automatically saved every 15 seconds. These changes are saved as drafts until the user selects “Post” (upper right corner of the page), making the page available to the public through the defined URL.




Web components


Componentes web: To add a component, click the button to expand components, select the desired component and drag it to the area on the page where it will be displayed.

...

Remove component from page


Dica
titleTip!

If you created the page from a template, you can also use the Configure component option to access each component’s settings and customize the page.


The components that can be added to pages and their respective settings are detailed below.


Parágrafo

...

Veja a imagem. Veja a imagemSee the image

This component allows entering a title and a text paragraph to the page, optionally showing an image and buttons. The following settings are available for this component:

...

Painel

Adicionar item: add icons to the paragraph that redirect users to other web addresses. The following settings are available for each item:

  • Título: title of the link.
  • URL: web address opened after clicking the item.
  • Cor do texto: item text color.
  • Cor do fundo: item color.
  • Abrir em uma nova aba?: indicates whether the address should be opened in a new tab.


Seção

...

Veja a imagem. Veja a imagemSee the image

This component allows splitting the page into content portions, called sections. Each section has an image, which may have a title and a description. The following settings are available for this component:

...

Painel
  • Imagem de fundo: image displayed as the section’s background. The image must be a file from the gallery or the device.
  • Título: title of the section.
  • Tamanho do título: font size of the section title.
  • Subtítulo: description shown below the title.
  • Tamanho do subtítulo: font size of the section subtitle.
  • Cor do texto: section text color.
  • Altura: height of the page used for this section.
  • Alinhamento: alignment of the title and subtitle. Options: left, centered or right.
  • Parallax: indicates whether the parallax effect must be used to paralyze the image when the page is being scrolled.
  • Máscara: indicates whether the mask effect must be used to highlight the section’s text.
  • Habilitar container?: component width. If the container is disabled, the component will be resized based on the screen width, regardless of the device. If the container is enabled, the maximum width defined in this area will be followed.


Banner

...

Veja a imagem. Veja a imagemSee the image

Banners highlight image or video content, alternated manually or automatically. The following settings are available for this component:

...

Painel

 If more than one banner is used, they are automatically displayed alternately every 5 seconds. The following settings must be defined for each banner:

  • Conteúdo: image or video content. Images and videos shown in banners must be saved in the gallery or the device. Accepted image formats: JPG, JPEG, GIF or PNG. Accepted video formats: MP4 or OGG. If the video is more than 5 seconds long and there are more banners to be displayed, the video will be interrupted to display the next banner.
  • Título: banner title.
  • Subtítulo: description shown below the title.
  • Cor do texto: banner text color.
  • Alinhamento: alignment of the title and subtitle. Options: left, centered or right.
  • Adicionar item: add buttons to the banner that redirect users to other web addresses. The following settings are available for each item: 
    • URL: web address opened after clicking the button.
    • Abrir em uma nova aba?: indicates whether the address should be opened in a new tab.
    • Texto: button label.
    • Cor do texto: sets button label color.
    • Cor do botão: sets the button color.


Galeria de imagens

...

Veja a imagem. Veja a imagemSee the image

This component creates an image gallery, which may have a title and a description, as well as a color mask for each image. The following settings are available for this component:

...

Painel
  • Título: title of the gallery.
  • Subtítulo: description shown below the title.
  • Espaços: indicates whether there must be spaces around the images.
  • Máscara: indicates whether the mask effect must be used in the images.
  • Colunas: number of image columns to be displayed.Cor da máscara: the mask color can be selected in this component, unlike in others.

Imagens: insert, remove or configure gallery images.

Painel

Click the  button to insert new images. The following settings are available for each image:

  • Legenda: description shown when opening the image in the gallery.


Menu

...

Veja a imagem. Veja a imagemSee the image

This component creates a menu with options, in order to make the page content more organized and accessible. The following settings are available for this component:

...

Painel
  • Logotipo: image shown as the menu logo. The image must be a file from the gallery or the device.
  • URL Link do logotipo: address accessed by clicking the logo.
  • Cor do texto: menu text color.
  • Realce do texto: text color displayed when placing the mouse cursor over the menu item.
  • Cor do fundo: menu background color.
  • Realce do fundo: background color displayed when placing the mouse cursor over the menu.
  • Alinhar à direita?: indicates whether the menu items should be aligned to the right. Menu items are aligned to the left by default.
  • Habilitar container?: Component width. If the container is disabled, the component will be resized based on the screen width, regardless of the device. If the container is enabled, the maximum width defined in this area will be followed.
  • Tamanho do texto: font size of menu items.

...

Painel

Click the button to insert new items. The following settings are available for each item:

  • Abrir em uma nova aba?: indicates whether the address should be opened in a new tab.
  • URL: web address opened after clicking the item.
  • Título: item label.


Conteúdo do texto

...

Veja a imagem. Veja a imagem
See the image

Unlike the paragraph, this component allows adding multiple texts that are displayed side by side horizontally, with up to 4 contents per line. Each text content can also have an image and buttons. The following settings are available for this componentDiferentemente do parágrafo, esse componente possibilita incluir diversos textos, que são apresentados lado a lado horizontalmente, com o limite de 4 conteúdos por linha. Cada conteúdo de texto pode mostrar uma imagem e botões. Referente a esse componente são apresentadas as seguintes configurações:

Conteúdo de texto: configura as propriedades gerais do componente. general properties of the component.

Painel
  • Habilitar container?: Component width. If the container is disabled, the component will be resized based on the screen width, regardless of the device. If the container is enabled, the maximum width defined in this area will be followed.
  • Alinhamento: alignment of the text content. Options: left, centered or right.
  • Conteúdo:  indicates if the text content should have an image or icon. Images and icons must be saved in the gallery or the device.
  • Imagem de fundo como ícone: enables or disables the feature to adjust the image as an icon, in order to avoid cuts or distortions.
  • Título: title of the gallery.
  • Texto: text content shown below the title.
  • Adicionar item: add buttons to the text content that redirect users to other web addresses. The following settings are available for each item: 
    • URL: web address opened after clicking the button
Painel
  • Conteúdo: indica se o conteúdo do texto deve ter imagem ou ícone. Tanto a imagem quanto o ícone devem ser arquivos da galeria ou do próprio dispositivo.
  • Título: título da galeria.
  • Texto: conteúdo de texto que deve ser apresentado abaixo do título.
  • Adicionar item: essa opção permite adicionar botões ao conteúdo de texto, e esses botões direcionam para outros endereços web. Cada item tem a seguinte configuração:
    • URL: endereço web que será aberto ao acionar o botão.
    • Abrir em uma nova aba?: indica se o endereço deve ser aberto em uma nova aba ou na atualindicates whether the address should be opened in a new tab.
    • Texto: configura o button label do botão.
    • Cor do texto: configura a cor do label do botãosets button label color.
    • Cor do botão: configura a cor que deve ser apresentada para o botãosets the button color.


Rodapé

...

Veja a imagem. Veja a imagem

O rodapé é uma pequena área na parte inferior, que tem uma grande importância, tanto em termos de design como para fornecer informações complementares. Normalmente inclui informações como: direitos autorais, links para redes sociais, slogan, etc.  Referente a esse componente são apresentadas as seguintes configurações:

See the image

Footers are small areas on the bottom of the page, which are very important both for design purposes and to provide additional information. Footers typically contain information such as copyrights, social media links, slogans, etc. The following settings are available for this component:

Geral: general properties of the componentGeral: configura as propriedades gerais do componente.

Painel
  • Logotipo: imagem de logo que deve ser apresentada no rodapé. A imagem deve ser um arquivo da galeria ou do próprio dispositivologo image shown in the footer. The image must be a file from the gallery or the device.
  • Mensagem de Copyright: texto apresentado abaixo da logo e dos íconestext shown below the logo and icons.
  • Cor do texto: configura a cor da mensagem de Copyrightcolor of the copyright message.
  • Cor de fundo: configura a cor de fundo do rodapébackground color of the footer.

Itens: configura os itens que devem ser apresentados no rodapéitems displayed in the footer

Painel

Adicionar item: essa opção permite adicionar ícones ao rodapé, e esses ícones direcionam para outros endereços web. Cada item tem a seguinte configuração:add icons to the footer that redirect users to other web addresses. The following settings are available for each item:

  • Imagem: image shown in the footer link. The image must be a file from the gallery or the device.
  • Título: title of the
  • Imagem: imagem que deve ser apresentada no link do rodapé. A imagem deve ser um arquivo da galeria ou do próprio dispositivo.
  • Título: configura o título do link.
  • URL: endereço web que será aberto ao acionar o web address opened after clicking the item.
  • Abrir em uma nova aba?: indica se o endereço deve ser aberto em uma nova aba ou na atualindicates whether the address should be opened in a new tab.


Conteúdo externo

...

Veja a imagem. Veja a imagem

Esse componente foi elaborado, essencialmente, para fazer um link com o recurso de Forms, para possibilitar o uso de formulários na sua página. Isso permite que sejam incluídos formulários de contato, de avaliação ou sugestões, por exemplo.

Referente a esse componente são apresentadas as seguintes configurações:

See the image

This component was essentially designed as a link to the Forms tool, in order to use forms on the page. This allows adding contact, evaluation or suggestions forms, for example. The following settings are available for this component:


Conteúdo Externo: general properties of the componentConteúdo Externo: configura as propriedades gerais do componente.

Painel
  • URL: endereço web do conteúdo da ser adicionado. Algumas URL's podem não ser carregadas por motivos de permissão.web address of the content to be added. Some URLs cannot be loaded due to lack of permission.
  • Altura: height of the area reserved for external content. If the content is larger than the height value set in this field, the content shall be automatically resized to fit the defined heightAltura: configura a altura da área reservada ao conteúdo externo. Caso o conteúdo seja maior do que a altura configurada nesse campo, o conteúdo deve ser automaticamente redimensionado para se adequar à altura definida.
  • Habilitar container?: Configuração de largura do componente. Se estiver desabilitado o container, o componente será redimensionado conforme a largura da tela, independentemente do dispositivo. Se o container foi habilitado, a largura máxima irá obedecer às medidas apresentadas nesse quadroComponent width. If the container is disabled, the component will be resized based on the screen width, regardless of the device. If the container is enabled, the maximum width defined in this area will be followed.



Informações
titleFique atento!Please note!

This documentation is valid from the Liquid (Esta documentação é válida a partir da atualização 1.6.5 - Liquid. Se você utiliza uma atualização anterior, ela pode conter informações diferentes das quais você vê na sua plataforma.

...

) update. If you use a previous update, it may contain information different from what you see on your platform.