Show Menu
TÓPICOS×

Tentando um layout responsivo no We.Retail

Todas as páginas We.Retail usam o componente Contêiner de layout para implementar um design responsivo. O contêiner de layout fornece um sistema de parágrafo que permite posicionar componentes em uma grade responsiva. Esta grade pode reorganizar o layout de acordo com o dispositivo/tamanho e formato da janela. The component is used in conjunction with the Layout mode in the page editor, which allows you to create and edit your responsive layout dependent on device.

Tentando sair

  1. Edite a página Navegação no Ártico na seção Experiências do ramo mestre de idiomas.
    http://localhost:4502/editor.html/content/we-retail/language-masters/en/experience/arctic-surfing-in-lofoten.html
  2. Alterne para Visualizar para ver a página como ela seria renderizada para um visitante do site. Role para baixo até o conteúdo do artigo Espírito da Aloha no norte da Noruega .
  3. Redimensione a janela do navegador e observe que o layout se adapta dinamicamente ao redimensionamento.
  4. Alternar para o modo Layout. A barra de ferramentas do emulador é exibida automaticamente, permitindo que você planeje seu layout por dispositivo de destino.
    Selecionar um componente exibe opções flutuantes e ocultas no menu de edição, juntamente com alças de redimensionamento do componente.
  5. Agarrar e arrastar a alça de redimensionamento do componente mostra automaticamente a grade de layout para ajudá-lo com o redimensionamento.

Informações adicionais

Para obter mais informações, consulte o documento de criação Layout Layout responsivo responsivo ou o documento do administrador Configurando o contêiner de layout e o modo de layout para obter detalhes técnicos completos.