Leia este artigo para adicionar, configurar e testar a Tela inteira e widgets de Apresentação de slides em miniatura no Adobe Muse.

Observação:

O Adobe Muse não está mais adicionando novos recursos e suspenderá o suporte em quinta-feira, 26 de março de 2020. Para obter informações detalhadas e assistência, consulte a a página de fim de serviço do Adobe Muse.

Os widgets de apresentação de slides no Adobe Muse são widgets interativos que trabalham exclusivamente com imagens. De modo semelhante ao widget de Painel com guias, os visitantes clicam em um contêiner de miniaturas e a versão da imagem principal correspondente é exibida em outro contêiner de software maior na página.

O Adobe Muse é compatível com os seguintes tipos de widgets de apresentação de slides:

  • Básico: este widget é composto por um contêiner grande, onde você pode adicionar imagens, abaixo das quais é possível adicionar uma legenda. O botão voltar, o botão avançar e o número do slide atual também estão disponíveis na área de legenda.
  • Branco: é semelhante à apresentação de slides básica. No entanto, os contêineres estão vazios neste widget.
  • Tela inteira: este widget é exibido em tela inteira quando você o arrasta e solta na tela Design. Por padrão, há um botão voltar, um botão avançar e o número do slide atual em um pequeno contêiner no canto superior esquerdo da página.
  • Negatoscópio: este widget esmaece o restante da página, exceto a apresentação de slides ou o elemento de galeria que está sendo exibido ativamente na página. O negatoscópio é um dos widgets mais usados entre as apresentações de slides, onde o foco do usuário é imediatamente levado para a galeria ativa.
  • Miniaturas: este widget é semelhante a um widget de composição, onde há miniaturas à esquerda da área da galeria. Quando um usuário clica na miniatura, a imagem correspondente é exibida na área da galeria.

No artigo a seguir, vamos criar uma galeria de fotos que exibe várias imagens em miniatura ao longo da parte superior com uma única imagem maior exibida abaixo. Usando o painel Opções, você pode controlar o comportamento e a exibição da galeria de fotos. E você pode aplicar configurações no painel de controle para aplicar estilos à aparência da apresentação de slides.

Adicionar uma apresentação de slides com largura de 100%: Saiba como adicionar uma apresentação de slides com largura de 100% ao design do site no Adobe Muse. A apresentação de slide em tela inteira com largura de 100% está disponível na Biblioteca de widgets.
Danielle Beaumont

Adicionar um widget de Apresentação de slides em miniatura a uma página

As apresentações de slides também podem ser adicionadas diretamente às páginas, mas neste exemplo, você aninhará um widget de Apresentação de slides em miniatura dentro da área de conteúdo de um widget de Painel com guias. Para adicionar apresentações diretamente, siga estas etapas:

  1. Abra o Adobe Muse. Na tela de Boas-vindas, siga um destes procedimentos:

    • Clique em Criar novo para adicionar um widget Apresentação de slides em um novo site que você está criando.
    • Clique em Abrir e abra o arquivo .muse existente onde deseja adicionar o widget. Clique duas vezes e abra a página onde você deseja adicionar o widget de apresentação de slides.
  2. Abra o painel Biblioteca de widgets (Janela > Biblioteca de widgets). e expanda a seção Apresentação de slides. Selecione o widget necessário na lista. Por exemplo, selecione o widget de Apresentação de slides em miniatura a partir da lista e arraste o widget para a visualização Design.

    Apresentação de slides em miniatura no Adobe Muse, biblioteca de widgets
    Arraste o widget de Apresentação de slides em miniatura para a página.

    Observe que há um contêiner de miniatura do lado esquerdo, um contêiner para a imagem principal e o contêiner de legenda abaixo da imagem.

    Observação:

    Para remover o conteúdo padrão que está dentro de um widget, clique com o botão direito no widget e selecione Limpar conteúdo de widgets.

  3. Para remover as miniaturas, selecione o conteúdo de espaço reservado (o quadro de imagem e o quadro de texto dentro da área de conteúdo) e exclua-o.

Configurar o widget de Apresentação de slides em miniatura no painel Opções

É possível definir as configurações de um widget de apresentação de slides do painel de Opções que está associado com o widget. Leia mais para saber como ativar a reprodução automática, os efeitos de transição, deslizar para dispositivos de toque, e assim por diante.

  1. Selecione seu widget e clique no ícone de seta azul para acessar o painel de Opções. Neste exemplo, você não precisa de botões de seta Avançar e Voltar. Assim, desmarque as opções Anterior e Próximo para desativá-las. Observe que os botões desaparecem quando você desmarca as caixas de seleção.

    Desmarque as opções Legenda e Contador, para que apenas os botões disparadores de miniatura e o contêiner de destino maior permaneçam. Procure pelas opções e atualize-as para que elas correspondam às configurações listadas abaixo:

    • Nova imagem principal: preenche o quadro proporcionalmente
    • Nova miniatura: Preencher quadro proporcionalmente
    • Transição: Esmaecimento
    • Velocidade de transição: 0,5 segundos
    • Executar automaticamente: Não ativado
    • Reiniciar após: Ativado
    • Reproduzir uma vez: Não ativado
    • Ordem aleatória: não ativada
    • Ativar Arrastar o dedo: Ativado
    • Negatoscópio: Ativado
    • Tela cheia: Ativado
    • Negatoscópio automático: Não ativado
    • Miniaturas de forma livre: Ativado
    • Primeiro: Não ativado
    • Anterior: Ativado
    • Seguinte: Ativado
    • Último: Não ativado
    • Legendas: Ativadas
    • Contador: Ativado
    • Botão Fechar: Não ativado
    • Miniaturas: Ativadas
    • Mostrar partes da negatoscópio ao editar: Ativado
    • Edição conjunta: Ativada
    Painel de opções para Apresentação de slides
    Atualize as configurações do widget de Apresentação de slides em miniatura no painel Opções.

  2. Os widgets diferentes têm diferentes opções disponíveis e alguns são mais complexos do que outros. Pare alguns instantes para revisar as opções de menu e verificar as configurações disponíveis. Aqui está uma visão geral rápida:

    Adicionar imagens: clique no ícone de pasta para procurar e selecionar as imagens que você deseja exibir.

    Nova imagem principal: define o modo como o conteúdo de foto maior será exibido no contêiner de destino.

    • Ajustar conteúdo proporcionalmente: o arquivo de imagem fotográfica permanece em seu tamanho original, mesmo que esse tamanho não corresponda ao contêiner de destino; uma parte do contêiner talvez esteja vazia no local em que a imagem não se ajustar a ele.
    • Preencher quadro proporcionalmente: o arquivo de imagem fotográfica é redimensionado de acordo com as proporções do contêiner de destino; parte da imagem fotográfica pode ser.

    Nova miniatura: define o modo como o conteúdo fotográfico em miniatura menor é exibido no contêiner de disparo.

    • Ajustar conteúdo proporcionalmente: o arquivo de imagem fotográfica permanece em seu tamanho original, mesmo que esse tamanho não corresponda ao contêiner de destino; uma parte do contêiner talvez esteja vazia no local em que a imagem não se ajustar a ele.
    • Preencher quadro proporcionalmente: o arquivo de imagem fotográfica é redimensionado de acordo com as proporções do contêiner de destino; parte da imagem fotográfica pode ser.

    Transição: o método de animação usado quando o conteúdo de um contêiner de destino está no processo de ser substituído por outro contêiner de destino. Eles também estão ativados para telas sensíveis ao toque, portanto, se você criar sites para dispositivos móveis, os visitantes poderão deslizar o dedo sobre a tela para visualizar a transição enquanto o conteúdo seguinte é exibido.

    • Esmaecer: a opacidade do novo contêiner aumenta, enquanto a do contêiner existente diminui.
    • Horizontal: o novo contêiner desliza da lateral horizontalmente, passando sobre o contêiner existente.
    • Vertical: o novo contêiner desliza da lateral verticalmente, passando sobre o contêiner existente.

    Velocidade de transição: o tempo, em segundos, necessário para a reprodução da animação.

    Reprodução automática: quando ativada, essa configuração reproduz a apresentação de slides automaticamente, em vez de uma experiência interativa (que requer que o visitante clique em cada disparador para exibir o destino correspondente na sequência). Defina o número de segundos durante os quais cada imagem deverá ser exibida antes de transição para a próxima imagem.

    Ordem aleatória: quando ativada, as imagens são exibidas em uma ordem aleatória, em vez de em um ciclo pelas miniaturas sequencialmente.

    Negatoscópio: quando essa opção está ativada, a apresentação de slides fica esmaecida no restante da página com uma sobreposição quando o conteúdo do contêiner de destino é exibido.  Quando a janela da negatoscópio é fechada, a página inteira é exibida novamente.

    Ativar passar o dedo: quando essa opção está ativada e o site inclui um layout de Tablet ou Telefone para exibir conteúdo da Web em um dispositivo móvel, as partes interativas do widget terão suporte para gestos de tela sensível ao toque.

    Seção Partes:

    • Primeiro: quando essa opção está ativada, o botão de navegação Primeiro é exibido.
    • Voltar: quando essa opção está ativada, o botão de navegação Voltar é exibido.
    • Avançar: quando essa opção está ativada, o botão de navegação Avançar é exibido.
    • Último: quando essa opção está ativada, o botão de navegação Último exibido.
    • Legendas: quando essa opção está ativada, as legendas da galeria de fotos são exibidas.
    • Contador: quando essa opção está ativada, o contador da galeria de fotos é exibido.
    • Botão Fechar: quando essa opção está ativada, o botão Fechar é exibido.

    Miniaturas: quando essa opção está ativada, os botões de disparo de miniatura são exibidos.

    Edição da seção:

    • Mostrar partes da negatoscópio ao editar: quando a opção negatoscópio está ativada, cada área de destino somente é mostrada por padrão quando seu disparador correspondente está selecionado na página. Ao criar o layout, talvez você ache útil ativar esta opção para exibir os destinos enquanto trabalha. Essa configuração não afeta a exibição da apresentação de slides quando a página é visualizada ou exibida em um navegador. Se a opção negatoscópio não estiver ativada, essa opção estará acinzentada. 

    Observe que a opção Mostrar partes no negatoscópio ao editar fica ativada somente quando você escolhe o widget de Apresentação de slides no negatoscópio.

    • Edição em conjunto: essa opção está ativada por padrão, para facilitar a edição mais rápida de widgets. A menos que você precise definir a aparência de cada disparador de modo diferente, mantenha essa opção ativada para que qualquer alteração feita a um elemento seja aplicada automaticamente aos outros.

    Depois de analisar as configurações disponíveis, clique na área da página fora do menu Opções para fechá-lo.

    Observação:

    As opções Negatoscópio e Tel ainteira ficam desativadas em Apresentações de slides em tela inteira.

    Você não pode ativar a opção Tela inteira para qualquer widget de Apresentação de slides, exceto pela Tela inteira.

Redimensionar e alinhar os elementos do widget de Apresentação de slides em miniatura

  1. Clique e selecione o widget de apresentação de slides. Use a ferramenta Seleção para arrastar suas alças para redimensionar o widget de Apresentação de slides em miniatura inteiro, até que tenha aproximadamente 790 pixels de largura por 490 pixels de altura. Você pode consultar o painel Transformação ou os campos Transformação no painel de controle para verificar as dimensões.

  2. Com a Apresentação de slides ainda selecionada, clique novamente no Contêiner de miniatura, para selecionar o contêiner que tem as três miniaturas. Use as alças de transformação laterais para torná-lo mais largo e use a ferramenta Seleção para arrastar as miniaturas até posicioná-lo acima e alinhado verticalmente ao centro do contêiner maior da imagem maior.

    Contêiner com cinco miniaturas
    Selecione o contêiner de disparo de miniatura e reposicione-o acima do contêiner maior de destino.

    Você pode observar quando o Contêiner de miniatura é alinhado ao centro do contêiner da imagem principal, pois uma guia inteligente azul é exibida temporariamente enquanto o elemento é arrastado.

    Siga estas etapas para adicionar os gráficos à galeria de fotos ao gerar automaticamente os contêineres correspondentes de miniatura e principal:

  3. Clique no botão de seta azul para abrir o menu Opções. Clique no ícone de pasta ao lado das palavras Adicionar imagens… e navegue até a pasta os arquivos foram salvos.

  4. Selecione os arquivos de imagem desejados. Clique em Abrir para fechar a caixa de diálogo Importar.

    Caixa de diálogo Importar
    Selecione o conjunto de cinco fotos da galeria localizadas na subpasta da galeria.

    Quando você seleciona vários arquivos de imagens, está carregando o widget de Apresentação de slides em miniatura. Essa estratégia permite selecionar vários arquivos de imagens e gerar um botão Contêiner de miniatura correspondente a cada novo arquivo de imagem maior no contêiner da imagem principal.

    As novas imagens são adicionadas aos botões de miniatura existentes.

  5. Clique duas vezes e selecione a imagem em miniatura que é exibida por padrão quando você adicionou pela primeira vez a apresentação de slides. Pressione a tecla Delete (Mac) ou a tecla Backspace (Windows) para remover cada uma ao selecioná-la, até que apenas as novas miniaturas permaneçam.

    Imagem e miniaturas da apresentação de slides
    Abra os detalhes para selecionar todas as miniaturas em preto e branco padrão e pressione a tecla Backspace ou Delete para removê-las uma por uma.

    Tome cuidado para não excluir todo o conjunto de miniaturas; se isso acontecer, desfaça a última operação escolhendo Editar > Desfazer e não se esqueça de clicar em cada miniatura (o Indicador de seleção exibirá a palavra Miniatura) antes de pressionar Backspace ou Delete.

  6. Selecione o contêiner que contém o conjunto de cinco imagens em miniatura. Use as alças de transformação para redimensioná-la, para que as miniaturas restantes sejam centralizadas no contêiner da imagem Hero.

    Imagem e miniaturas da apresentação de slides
    Redimensione o Contêiner de miniaturas para o centro da imagem principal.

Usar widgets de apresentação de slides responsiva

Por padrão, as apresentações de slides são responsivas e fluidas. Para usar um widget de Apresentação de slides responsivo no seu site do Adobe Muse, execute uma das seguintes ações:

  • Se você estiver criando um novo site, abra o novo site e arraste e posicione o widget de Apresentação de slides do painel Biblioteca de widgets. Observe que o widget é responsivo por padrão.
  • Se você já tiver um arquivo .muse, abra o arquivo usando a versão mais recente do Adobe Muse. Selecione o widget. Para tornar o widget responsivo, selecione os elementos nele e escolha a opção Largura e Altura responsiva, ou a opção Largura responsiva, na lista suspensa Redimensionar, no menu de contexto.
Selecione a opção Redimensionar para tornar o widget de Apresentação de slides responsivo
Selecione a opção Redimensionar para tornar o widget de Apresentação de slides responsivo

Se estiver adicionando o widget de apresentação de slides em um site responsivo, verifique a posição e o tamanho do widget por todos os pontos de quebra. Você pode modificar o conteúdo e o tamanho dos elementos individuais em um widget de Apresentação de slides. Você também pode ativar as configurações de Resposta para elementos individuais, como o botão Anterior, botão Avançar, Legendas, em diferentes pontos de quebra.

Testar como o widget de Apresentação de slides em miniatura aparece

Após reposicionar os elementos de apresentação de slides e remover o espaço reservado para as imagens em miniatura, você pode testar a apresentação de slides para visualizar como ela será exibida.

  1. Primeiro, teste a galeria de fotos no modo de exibição Design clicando nos botões de miniatura na parte superior e veja cada exibição de imagem principal correspondente no contêiner maior abaixo.

  2. Clique em Visualizar para ver como a galeria será exibida no navegador. Interaja com a apresentação de slides para ver como as imagens maiores são exibidas quando você clica na miniatura correspondente.

    Teste de miniatura e apresentação
    Posicione a galeria para centralizá-la no contêiner Área de conteúdo do widget de Painel com guias.

  3. Escolha Arquivo > Visualizar página no navegador para visualizar à página sobre exibida no navegador padrão.

    Redimensione o navegador e visualize o widget de apresentação de slides em diferentes tamanhos de tela. Você pode ver que os widgets de apresentação de slides são responsivos por padrão. Ou seja, eles são redimensionados e se adaptam ao tamanho da tela.

    Você também pode usar o controle deslizante na visualização Design para visualizar os widgets. Se você deseja modificar ou reposicionar o widget em qualquer ponto, adicione um ponto de quebra e alinhe novamente o widget.

  4. Teste a funcionalidade do widget de Painéis com guias. Clique nas guias para ver o conteúdo correspondente exibido nos contêineres de área de conteúdo. Em seguida, teste a apresentação de slides na guia Galeria, clicando nos botões de miniatura para ver as imagens principais maiores correspondentes exibidas.

Criar uma apresentação de slides com o widget de Apresentação de slides

O widget de Apresentação de slides é outro recurso do site que pode ser adicionado às suas páginas. Você pode configurar uma apresentação de slides que exige que os visitantes cliquem nas miniaturas para ver uma versão maior da foto ou pode criar apresentações de slides que são reproduzidas automaticamente conforme a página é carregada. As apresentações de slides com reprodução automática são uma ótima maneira de adicionar um conteúdo envolvente ao seu site, apresentando uma série de fotos. Você pode controlar a reprodução da apresentação de slides configurando o tipo de transição para ditar como os slides serão animados.

Na subseção a seguir, você adicionará uma apresentação de slides de reprodução automática à página inicial do site.

No modo de exibição Plano, clique duas vezes na miniatura da Página inicial para abri-la para edição no modo de exibição Design.

Configurar um widget de apresentação de slides para reproduzir automaticamente

Siga estas etapas para criar uma apresentação reproduzida por um conjunto de imagens:

  1. Na Biblioteca de widgets, clique em Apresentações de slides.

  2. Selecione o Widget básico e arraste-o para a página.

  3. Por padrão, o widget Apresentação de slides básica contém um retângulo cinza escuro (espaço para imagens), um espaço para legendas, o número da imagem (1-1) e dois botões de seta (avançar e anterior) nos quais os visitantes podem clicar para navegar pelo conjunto de imagens.

  4. Clique na seta azul para acessar o menu Opção. Verifique e defina as seguintes opções:

    • Transição: esmaecimento
    • Reproduzir automaticamente: lenta
    • Novo principal: preencher quadro proporcionalmente
    • Nova miniatura: preencher quadro proporcionalmente
    • Negatoscópio: desmarcado
    • Partes: Demarque a seleção de todas as opções para ocultar legendas, contagens e os botões avançar e anterior.

    Observação:

    Essa apresentação de slides será reproduzida automaticamente quando a página for carregada sem nenhuma interação do visitante. Se quiser criar uma apresentação de slides controlada por cliques de mouse de um visitante, defina a opção Reproduzir automaticamente para Nenhum e deixe as caixas de seleção Avançar e Anterior marcadas na seção Partes do menu Opções.

  5. Clique fora do menu Opções para fechá-lo. Observe que depois de fazer essas alterações, apenas o retângulo cinza escuro permanecerá visível. A qualquer momento, você pode alterar a configuração dos widgets mudando as definições no menu Opções.

  6. Clique duas vezes e selecione o Quadro da imagem (o retângulo cinza-escuro) e, em seguida, arraste as alças laterais para expandir a apresentação de slides para toda a largura da página.

    Quadro da imagem na apresentação de slides
    Arraste as alças laterais do quadro de imagem da apresentação de slides para ajustá-la ao tamanho da página.

  7. Use as setas inferiores e superiores para ampliar a altura do quadro de imagem e preencher todas as dimensões da página Início. Na parte inferior, estique o quadro de imagem até que ele pare acima da imagem em zigue-zague lado a lado que é exibida na parte superior do rodapé. Por enquanto, tudo bem que o espaço cinza escuro cubra a imagem de gotejamento marrom à direita da barra de navegação.

  8. Clique na seta azul para acessar novamente o menu Opções. Desta vez, clique no ícone de pasta na parte superior, perto do texto Adicionar imagens.

  9. Na caixa de diálogo Importar, navegue até a pasta de ativos e abra-os. Clique em Selecionar para adicionar as imagens às apresentações de slides.

  10. Clique em Visualizar para assistir à apresentação de slides. Ela está definida para a velocidade de reprodução automática lenta, mas você pode alterar essa configuração no menu Opções se preferir que as imagens sejam mostradas mais rapidamente. Observe que após a última foto ser exibida, a apresentação de slides é iniciada novamente com a primeira imagem do conjunto. A apresentação de slides é exibida em loop por um período indeterminado quando a reprodução automática estiver selecionada.

Neste momento, a apresentação de slides está concluída. Entretanto, se desejar corrigir o gotejamento no lado direito da barra de navegação, há mais uma coisa a ser feita.

  1. No modo de exibição Plano, clique duas vezes na miniatura da página-mestre A para abri-la no modo de exibição Design.

  2. Use a ferramenta Seleção para selecionar o gotejamento marrom na parte superior direita do gráfico de navegação.

  3. Clique com o botão direito na imagem de gotejamento e selecione Organizar > Trazer para a frente no menu contextual exibido.

  4. Clique no X da guia da página-mestre A para fechá-la. Abra a página onde você adicionou um Widget básico. Clique em Visualizar e observe que agora a imagem de gotejamento é exibida acima da apresentação de slides de reprodução automática. Após analisar a apresentação de slides, volte para a visualização Design.

    Observação:

    Já que a barra de navegação foi criada na página-mestre A, quaisquer alterações feitas para controlar a navegação (e outros elementos comuns) envolvem a abertura e edição da página-mestre A no modo de exibição Design. Embora possa ver os elementos de uma página-mestre nas páginas que estiver editando, você não pode editar o conteúdo do cabeçalho e do rodapé nas outras páginas do site.

Adicionar widgets de apresentação de slides em tela inteira

É possível configurar apresentações de slides exibidas em tela cheia com o widget de Apresentação de slides em tela inteira. Quando um visitante clica na Apresentação de slides em tela inteira, o conteúdo é dimensionado para preencher toda a janela do navegador na tela do computador ou dispositivo, ocultando temporariamente o restante do conteúdo do site. Se desejar, a apresentação de slides pode ser configurada para reproduzir automaticamente, para começar em ciclo através das imagens quando a página é carregada. Os visitantes podem sair da apresentação de slides pressionando Escape.

Siga estas etapas para adicionar um widget de Apresentação de slides em tela inteira a um site:

  1. Inicie o Adobe Muse. Clique duas vezes na página para abri-la no modo de exibição Design.

  2. Escolha Janela > Biblioteca de widgets para acessar a Biblioteca de widgets, ou clique na guia Biblioteca de widgets no conjunto de painéis para torná-la ativa.

  3. Expanda a seção Apresentações de slides na lista de widgets. Selecione o widget chamado Tela inteira na seção Apresentações de slides.

    Biblioteca de widgets
    Localize e selecione o widget de Apresentação de slides em tela inteira na Biblioteca de widgets.

Configurar widgets de apresentação de slides em tela inteira

O widget de Apresentação de slides em tela inteira se comporta de forma diferente de outros widgets do Adobe Muse. Reserve um tempo para ver como ele funciona.

  1. Arraste o widget de Apresentação de slides em tela inteira da Biblioteca de widgets para a página.

    Observe que o conteúdo padrão é dimensionado se ajustar na altura e largura da janela inteira do navegador.

    Widget de Apresentação de slides em tela cheia
    O widget de Apresentação de slides em tela inteira se expande para cobrir a área visível do site, preenchendo a janela do navegador.

    Por padrão, quando você adiciona o widget de Apresentação de slides em tela inteira, os botões voltar e avançar e um campo de contagem são exibidos no canto superior direito.

  2. Clique na seta azul para revisar as configurações no painel Opções.

    Painel de opções para Apresentação de slides
    O painel exibe as opções as configurações padrão aplicadas ao widget de Apresentação de slides em tela inteira.

    A opção de preencher o quadro proporcionalmente é aplicada de forma automática à nova imagem principal (imagens grandes) e às novas imagens em miniatura para facilitar a exibição de tela inteira.

  3. Escolha o tipo de transição que você deseja aplicar. Use o menu Transição para escolher entre Atenuar, Horizontal ou Vertical. Por padrão, a velocidade de transição está definida como 0,5 segundo, mas é possível ajustar a velocidade conforme desejado.

    Quando a opção Reprodução automática estiver ativada, a apresentação de slides começará a ser reproduzida assim que a página for carregada percorrendo em ciclo o conteúdo baseado no número de segundos definido. Por padrão, cada imagem é exibida em 3,5 segundos quando a opção Reprodução automática está ativada.

    Ao configurar widgets de Apresentação de slides em tela inteira, é uma prática comum habilitar os botões Avançar e Voltar da navegação, de forma que as miniaturas fiquem ocultas por padrão. Entretanto, você pode ativar a opção de Miniaturas se desejar que sejam exibidas na parte superior da imagem principal da apresentação de slides.

    Se as miniaturas estão ocultas, certifique-se de que as partes Avançar e Voltar habilitadas. O Contador é opcional e ajuda os visitantes a entender qual imagem do conjunto está exibida no momento.

  4. Para exibir Avançar, Voltar e a interface do contador em uma parte específica da página, use a ferramenta Seleção para movê-la ao local desejado e fixe os controles. Caso queira também que as miniaturas permaneçam na mesma posição na página, posicione a miniatura definida e fixe-a no local. Para exibir Avançar, Voltar e a interface do contador em uma parte específica da página, use a ferramenta Seleção para movê-la ao local desejado e fixe os controles. Caso queira também que as miniaturas permaneçam na mesma posição na página, posicione a miniatura definida e fixe-a no local.

    É possível modificar as configurações de fixação e redimensionamento em diferentes pontos de quebra ao adicionar o widget em um site responsivo.

Adição de imagens a apresentações de slides em tela cheia

Em seguida, adicione as imagens ao widget de Apresentação de slides em tela inteira. Siga estas etapas:

  1. Selecione Arquivo > Local.

  2. Na janela Importar exibida, pressione a tecla Shift e clique para selecionar vários arquivos de imagem contíguos no computador. Ou, se preferir, mantenha pressionada a tecla Command (Mac) ou Control (Windows) enquanto seleciona vários arquivos de imagem não contíguos de uma pasta de ativos.

  3. Clique em Abrir para carregar os arquivos selecionados no local de inserção.

    Observação:

    Se as imagens selecionadas tiverem dimensões e proporções diferentes, a opção Preencher o quadro proporcionalmente as dimensionará para que se ajustem às dimensões da página.

  4. Clique na apresentação de slides uma vez para adicionar os arquivos de imagem selecionados. Observe que as imagens padrão da apresentação de slides são removidas automaticamente logo que você adiciona novas imagens.

  5. Escolha Arquivo > Visualizar página no navegador. Redimensione a janela do navegador e observe como o conteúdo da apresentação de slides é dimensionado para preencher toda a janela do navegador. Clique nos botões Avançar e Voltar para percorrer a série de imagens, ou simplesmente deixe que elas sejam reproduzidas, caso a reprodução automática esteja ativada.

  6. Feche a janela do navegador e volte para o Adobe Muse. 

Configurar miniaturas de forma livre em widgets de apresentação de slides

A opção de Miniatura de forma livre oferece controle total sobre como miniaturas de uma apresentação são exibidas. Em vez de alinhar as miniaturas em uma linha ou conjunto de linhas, você pode posicionar cada miniatura em qualquer local desejado.

  1. No modo de exibição Design, abra a Biblioteca de widgets e expanda a seção Apresentação de slides. Arraste os widgets de apresentação de slides para uma página.

  2. Enquanto a página inteira estiver selecionada, clique duas vezes e selecione a imagem em miniatura. Você pode ver qual elemento está selecionado verificando o Indicador de seleção no canto superior esquerdo do painel de controle.

    Contêiner miniatura
    Uma caixa delimitadora envolve o contêiner de miniaturas enquanto ele está selecionado.

    Por padrão, as miniaturas exibidas em widgets de Apresentação de slides são armazenadas em um contêiner chamado Contêiner de miniaturas. Esse contêiner externo garante que as miniaturas se alinhem em linhas retas, dependendo de como você redimensionar o contêiner externo. O conjunto de imagens em miniatura está aninhado em um contêiner de miniaturas para todas as apresentações com miniaturas ativadas, até você ativar a opção Miniaturas de forma livre.

Configuração de exibição de miniaturas de forma livre

Se preferir exibir as miniaturas em posições aleatórias ou não alinhadas, remova o contêiner externo e insira cada imagem em miniatura no local desejado da página. Siga estas etapas:

  1. Com o widget de Apresentação de slides selecionado, clique na seta azul para acessar o menu Opções.

  2. Ative a caixa de seleção ao lado da opção: Miniaturas de forma livre. A caixa delimitadora em torno do contêiner de miniaturas no modo de exibição Design desaparece imediatamente e o Indicador de seleção exibe a palavra: Apresentação de slides.

    Painel de opções do Contêiner de miniatura
    A ativação da opção Miniaturas de forma livre remove o contêiner que contém as miniaturas.

  3. Clique em qualquer outro lugar da página para fechar o menu Opções.

    Agora que você removeu o contêiner externo das miniaturas, pode reposicionar cada imagem em miniatura de acordo com o projeto da página.

  4. Use a ferramenta Seleção para selecionar uma miniatura. Quando ela for selecionada, o Indicador de seleção exibirá a palavra: Miniatura. Mova a miniatura selecionada para o local desejado. Repita essa etapa para reposicionar todas as miniaturas. Se desejar que cada miniatura permaneça no local em caso de rolagem ou redimensionamento do navegador, fixe cada uma delas.

    Observação:

    Se quiser redimensionar os contêineres das miniaturas com tamanhos diferentes, desative a opção Editar juntos no menu Opções e use a ferramenta Seleção para arrastar individualmente os cantos de cada miniatura a fim de dimensioná-las conforme desejado.

    Em um site responsivo, também é possível realinhar, redimensionar e configurar as opções de fixação para as miniaturas.

  5. Escolha Arquivo > Visualizar página no navegador. As miniaturas da apresentação de slides são distribuídas na página. Clique nas miniaturas para visualizar a imagem correspondente exibida na apresentação de slides.

  6. Feche o navegador e volte para o Adobe Muse.

Configurar opção de exibição de Negatoscópio para widgets de apresentação de slides

Quando o conteúdo é exibido em um negatoscópio, significa que uma janela modal fica em foco e realça seu conteúdo, esmaecendo o restante da página. Os visitantes interagem com o negatoscópio, clicando em uma miniatura e botão Avançar ou Próximo. Para sair do negatoscópio e retornar à exibição normal do site, os visitantes devem clicar no botão Fechar ou pressionar a tecla Escape.

Todos os widgets de Apresentação de slides do Adobe Muse oferecem uma opção de negatoscópio. Além disso, um widget na seção Apresentação de slides está pré-configurado para usar o comportamento do negatoscópio. O widget de Apresentação de slides do negatoscópio tem a opção Negatoscópio ativada por padrão.

Para criar uma apresentação de slides que exibe imagens em um negatoscópio, siga estas etapas:

  1. No modo de exibição Design, expanda a seção Apresentação de slides na Biblioteca de widgets. Arraste os widgets de apresentação de slides para uma página.

  2. No menu Opções, localize a opção Negatoscópio na seção Layout e verifique se ele está selecionado.

    Opção Negatoscópio
    Marque a caixa de seleção ao lado da opção Negatoscópio, caso ainda não esteja selecionada.

  3. Com o menu Opções ainda aberto, faça outras alterações para configurar o widget conforme desejado. Por exemplo, você pode mostrar ou ocultar o botão Voltar, Avançar, Legendas e Contador. Na exibição de negatoscópio, é útil ativar o botão Fechar. Marque a caixa de seleção ao lado da opção do botão Fechar.

    Botão Fechar
    Um botão Fechar (com um X) é exibido no canto superior direito da apresentação de slides.

    Se desejar, use a ferramenta Seleção para mover o botão Fechar para um local diferente. Quando os visitantes querem sair da exibição de negatoscópio e fechar a janela modal, podem clicar no botão Fechar ou pressionar a tecla Escape.

    Observação:

    Para alterar a largura da borda que envolve a janela do negatoscópio, selecione o widget de Apresentação de slides do Negatoscópio e atualize as configurações de Preenchimento no painel Espaçamento.

  4. Escolha Arquivo > Visualizar página no navegador para testar o widget de Apresentação de slides. Clique em qualquer uma das imagens em miniatura para invocar o efeito de negatoscópio e ver a imagem principal correspondente exibida em uma janela modal enquanto o resto da página é esmaecido.

  5. Clique nos botões Avançar e Voltar para percorrer as imagens da apresentação de slides.

  6. Após testar a apresentação de slides, saia da exibição de negatoscópio clicando no botão Fechar. O negatoscópio é fechado e o restante do conteúdo da página é exibido.

  7. Feche o navegador e volte para o Adobe Muse.

Esta obra está licenciada sob uma licença não adaptada da Creative Commons Attribution-Noncommercial-Share Alike 3.0  As publicações do Twitter™ e do Facebook não são cobertas pelos termos do Creative Commons.

Avisos legais   |   Política de privacidade online