Criação da View

Etapa 1

1. Clique em Estrutura > View
2. Clique em Adicionar View
3. Defina o nome desejado para a View
4. Em Configurações da view
   1. Em exibir selecione a opção de Bloco de conteúdo
   2. Em "do tipo" selecione o tipo de bloco que criamos (Carrossel Home)
5. Em "Configurações do bloco" marque a caixa de seleção para criar um bloco de conteúdo
   1. Em Configurações de exibição de bloco, na opção "Formato de exibição" selecione a opção "Slick Carousel" (necessário instalar os módulos Slick e Slick View)
   2. Em "de:" selecione a opção de "Campos"
6. Na opção de Itens por bloco, defina a quantidade máxima de itens que quer exibir no seu carrossel (recomendado que seja no máximo 5 itens, se for pensado na experiência de usuários)

Etapa 2

1. Em campos
   1. Primeiramente, excluiremos a Descrição do bloco (clique na descrição do bloco e clique em remover)
   2. Agora clique em Adicionar
   3. Digite algo referente ao nome do tipo de bloco que acabamos de criar, para facilitar a nossa busca, ou simplesmente procure por Imagem e Link
   4. Adicione o campo de Imagem e Link
   5. No item de imagem, em "Formatador" selecione a opção Blazy Image (que é o modulo que vai fazer o trabalho com as dimensões da imagem no módulo slick)
   6. No Poupup que aparecer, em Aspect ratio, selecione "fluid" ou "16:9" (fluid exibe a imagem na largura total e 16:9 ajusta a imagem do carrossel no padrão YouTube)
   7. Em Estilo de imagem, selecione "1200webp" ou "Largo 1090" e seguida, clique em aplicar
   8. No item de link, apenas clique em aplicar
2. Em "Formato > Formato", clicamos em Configurações
   1. Na opção "Skin main", selecionamos obrigatoriamente a opção "Classic"
   2. Mais abaixo, nos Campos em Main stage, selecionamos a única opção disponível
   3. Agora em link, também selecionamos a única opção disponível
   4. Mais abaixo, marcamos a caixa de seleção da opção "Override main optionset"
   5. Nos itens abaixo que irão aparecer, selecionamos: Arrows, Tocar automaticamente, Dots, Draggable e Infinite e em seguida, clicamos em Aplicar
3. Agora em Critérios de Organização clicamos em Adicionar
4. Procure pelo Campo Personalizado "Ordem dos Slides" e em seguida clique em "Adicionar e configurar critérios de ordenação" e clique em Aplicar

Etapa 3

Um detalhe importante é que temos 2 modelos diferentes de carrosséis pré-configurados no padrão do site principal da Marinha, a qual seriam os preferenciais a serem usados.

Para selecionar este modelo, basta definirmos a sua classe, siga o passo a passo para definir estes modelos:

1. Em Avançado, clique na seta para baixo
2. Na opção de "Classe CSS" clique em "Nenhum"
3. Digite uma das duas classes: "sem-escrita" ou "home-carrossel"

Você poderá testar e definir a que melhor se adaptar a sua necessidade. Caso queira outro estilo, o mesmo pode ser criado apenas com CSS personalizado.