Ligar peças Web no SharePoint Online

Nota: Queremos fornecer-lhe os conteúdos de ajuda mais recentes o mais rapidamente possível e no seu idioma. Esta página foi traduzida automaticamente e pode conter erros gramaticais ou imprecisões. O nosso objetivo é que estes conteúdos lhe sejam úteis. Pode informar-nos se as informações foram úteis no final desta página? Eis o artigo em inglês para referência.

Quando adiciona uma página moderna a um site, adiciona e personaliza peças Web, que são os blocos modulares da sua página. Pode ligar algumas peças Web entre si para criar uma experiência interativa e dinâmica para os seus visualizadores de página. Por exemplo, pode ligar uma peça Web biblioteca de documentos a uma peça Web Visualizador de ficheiros. Quando um utilizador clica num nome de ficheiro na lista de bibliotecas de documentos, o Visualizador de ficheiros mostra os conteúdos desse ficheiro específico. Em alternativa, ligue uma peça Web lista a uma peça Web incorporada e adicione código personalizado para uma variedade de experiências dinâmicas.

Notas: 

  • Algumas funcionalidades são introduzidas gradativamente para as organizações que optaram por participar no programa de lançamento direcionado. Tal significa que poderá não ver esta funcionalidade ou que a mesma poderá ter um aspeto diferente do descrito nos artigos de ajuda.

  • As peças Web neste artigo não estão disponíveis para utilização em páginas clássicas.

As peças Web às quais pode ligar incluem: a peça Web Propriedades da lista, peça Web Visualizador de ficheiros e peça Web incorporada. Seguem-se alguns exemplos de como pode utilizar estas peças Web ligadas.

Mostrar um ficheiro com base no que um utilizador seleciona numa biblioteca de documentos (ligar uma peça Web Visualizador de ficheiros a uma peça Web biblioteca de documentos)

Neste exemplo, os utilizadores podem navegar através de uma biblioteca de documentos de campanha e ver o conteúdo num ficheiro selecionado sem sair da página e sem ter de abrir cada ficheiro.

Exemplo de uma peça Web Visualizador de ficheiros ligada a uma biblioteca de documentos

Para fazê-lo:

  1. Na sua página, adicione uma peça Web biblioteca de documentos com a biblioteca que pretende utilizar e adicione uma peça Web Visualizador de ficheiros.

  2. Se estiver a adicionar a peça Web Visualizador de ficheiros pela primeira vez, será aberto o painel documentos recentes. Clique em Cancelar no canto inferior direito deste painel.

  3. Clique em Edit Web Part Botão de edição da peça Web no lado esquerdo da peça Web Visualizador de ficheiros.

  4. Clique nas reticências (...) no canto superior direito do painel de propriedades e, em seguida, clique em ligar à origem.

    Botão ligar ao código-fonte
  5. Em ligar à origem, selecione a biblioteca de documentos que pretende utilizar a partir da lista pendente.

    Painel de propriedades do Visualizador de ficheiros com o menu pendente ligar a origem
  6. Clique no X na parte superior do painel para fechá-lo.

  7. Clique em guardar como rascunho na parte superior da página.

  8. Teste a sua ligação ao selecionar um documento a partir da biblioteca de documentos que escolheu. Deverá ver o documento apresentado na peça Web Visualizador de ficheiros.

  9. Quando estiver pronto para a sua audiência ver a página, clique em publicar no canto superior direito da página.

Mostrar um item numa lista com base no que um utilizador seleciona numa peça Web de lista (ligar uma peça Web Propriedades da lista a uma peça Web de lista)

Quando tiver uma lista grande com muitas colunas, poderá ser difícil para os utilizadores encontrarem as informações específicas que estão à procura. Com a peça Web Propriedades da lista, um utilizador pode selecionar um item a partir de uma peça Web lista e ver apenas o (s) valor (s) que especificou. No exemplo seguinte, uma peça Web lista contém uma lista de escritórios regionais. Quando o utilizador seleciona um item da lista, a peça Web Propriedades da lista apresenta apenas o nome do escritório e os dados de vendas.

Exemplo de uma lista ligada a uma peça Web Propriedades da lista

Para fazê-lo:

  1. Na sua página, adicione uma peça Web lista à lista que pretende utilizar e, em seguida, adicione uma peça Web Propriedades da lista.

  2. Clique em Edit Web Part Botão de edição da peça Web no lado esquerdo da peça Web Propriedades da lista.

  3. Clique nas reticências (...) no canto superior direito do painel de propriedades e, em seguida, clique em ligar à origem.

    Botão ligar ao código-fonte
  4. Em ligar à origem, selecione a lista que pretende utilizar a partir da lista pendente.

  5. Em Mostrar, selecione o que pretende que o utilizador Veja na sua página. 

  6. Em campos a apresentar, selecione as caixas de verificação junto às colunas a partir das quais pretende mostrar os valores.

    Painel Web Part propriedades da lista
  7. Clique em guardar como rascunho na parte superior da página.

  8. Teste a sua ligação ao selecionar um item a partir da lista que escolheu. Deverá ver o valor que especificou na peça Web Propriedades da lista.

  9. Quando estiver pronto para a sua audiência ver a página, clique em publicar no canto superior direito da página.

Mostrar um vídeo, uma imagem ou uma localização com base no que um utilizador seleciona numa peça Web de lista (ligar uma peça Web incorporar a uma peça Web de lista)

Com a peça Web incorporar, pode introduzir ligações ou incorporar código que utilize variáveis, permitindo-lhe mostrar uma grande variedade de itens consoante o que o seu visualizador de páginas seleciona. Eis três exemplos de como pode mostrar imagens, vídeos e localizações selecionados.

Mostrar um vídeo do YouTube selecionado

Neste exemplo, a peça Web lista contém uma lista com títulos de vídeo e IDs para vários vídeos do YouTube. Quando um utilizador escolhe um vídeo a partir da lista, a peça Web de incorporação mostra esse vídeo. A ligação na peça Web incorporar utiliza uma variável para representar o ID de vídeo do vídeo escolhido por um utilizador a partir da lista.

Exemplo de uma peça Web de incorporação ligada a uma lista

Para fazê-lo:

  1. Crie uma lista com uma coluna de título e uma coluna para os seus IDs de vídeo (como no exemplo acima). O ID é a parte da ligação do YouTube que identifica o vídeo e é encontrado após a parte "v =" da ligação. Por exemplo, na seguinte ligação, a parte em itálico é o ID de vídeo:

    https://www.youtube.com/watch?v =0YEPy7HRf60

  2. Na sua página, adicione uma peça Web lista e selecione a lista com os IDs de vídeo.

  3. Adicionar uma peça Web incorporada.

  4. Clique em Edit Web Part Botão de edição da peça Web no lado esquerdo da peça Web incorporar.

  5. Clique nas reticências (...) no canto superior direito do painel de propriedades e, em seguida, clique em ligar à origem.

    Botão ligar ao código-fonte
  6. Em ligar à origem, selecione a lista a partir do menu pendente.

  7. Em endereço do Web site ou códigode incorporação, adicione a ligação do YouTube. No entanto, em vez de utilizar um ID de vídeo individual, utilize o nome da coluna de lista que contém os IDs como uma variável. Uma variável é representada por um parêntese de abertura, um $ e um parêntese de fecho após o nome. Eis um exemplo em que o ID de vídeo é o nome da coluna:

    Painel de propriedades incorporar peça Web a mostrar a lista ligada

  8. Clique em guardar como rascunho na parte superior da página.

  9. Teste a sua ligação ao selecionar um item a partir da lista que escolheu. Deverá ver o vídeo apresentado na peça Web incorporar.

  10. Quando estiver pronto para a sua audiência ver a página, clique em publicar no canto superior direito da página.

Mostrar uma imagem selecionada

Neste exemplo, a peça Web lista contém títulos de imagens e URLs para imagens armazenadas num site do SharePoint. Quando um utilizador escolhe uma imagem da lista, a peça Web de incorporação mostra essa imagem. Neste exemplo, o código IFrame é utilizado na peça Web incorporar e a variável representa a ligação da imagem.

Exemplo de uma peça Web de incorporação ligada a uma lista de imagens

Para fazê-lo:

  1. Crie uma lista com uma coluna de título e uma coluna para os URLs da sua imagem.

    Sugestão: Para obter um URL para a sua imagem, aceda à biblioteca onde a imagem está armazenada, clique com o botão direito do rato na imagem e clique em copiar ligação. Em seguida, clique em copiar. Agora pode colar a ligação na sua lista.

  2. Na sua página, adicione uma peça Web lista e selecione a lista com os URLs da sua imagem.

  3. Adicionar uma peça Web incorporada.

  4. Clique em Edit Web Part Botão de edição da peça Web no lado esquerdo da peça Web incorporar.

  5. Clique nas reticências (...) no canto superior direito do painel de propriedades e, em seguida, clique em ligar à origem.

    Botão ligar ao código-fonte
  6. Em ligar à origem, selecione a lista a partir do menu pendente.

  7. Em endereço do Web site ou códigode incorporação, adicione o seu código de incorporação. Neste exemplo, o código de incorporação é:

    <iframe width = "693" Height = "390" src = "[$Image URL]" frameBorder = "0" allowFullScreen = "" Allow = "acelerômetro; CDs encriptado – multimédia; Gyroscope; Picture-in-Picture "></iframe>

    em que [$Image URL] é a variável que representa o nome da coluna para os URLs da imagem.

    Exemplo de código de incorporação para uma imagem selecionada
  8. Clique em guardar como rascunho na parte superior da página.

  9. Teste a sua ligação ao selecionar um item a partir da lista que escolheu. Deverá ver a imagem apresentada na peça Web incorporar.

  10. Quando estiver pronto para a sua audiência ver a página, clique em publicar no canto superior direito da página.

Mostrar uma localização selecionada

Neste exemplo, a peça Web lista contém localizações e as suas coordenadas. Quando um utilizador escolhe uma localização a partir da lista, a peça Web de incorporação mostra essa localização num mapa do Bing. Neste exemplo, o código IFrame é utilizado na peça Web incorporar e as variáveis representam as coordenadas.

Exemplo de uma peça Web incorporada ligada que mostra uma localização a partir de uma lista

Para fazê-lo:

  1. Crie uma lista com uma coluna de título e colunas para longitude e latitude.

  2. Na sua página, adicione uma peça Web lista e selecione a lista com as informações de localização.

  3. Adicionar uma peça Web incorporada.

  4. Clique em Edit Web Part Botão de edição da peça Web no lado esquerdo da peça Web incorporar.

  5. Clique nas reticências (...) no canto superior direito do painel de propriedades e, em seguida, clique em ligar à origem.

    Botão ligar ao código-fonte
  6. Em ligar à origem, selecione a lista a partir do menu pendente.

  7. Em endereço do Web site ou códigode incorporação, adicione o seu código de incorporação. Neste exemplo, o código de incorporação é:

    <iframe width = "500" Height = "400" src = "https://www.Bing.com/maps/embed? h = 400&amp; w = 500&amp; CP = [$Latitude] ~ [$Longitude] &amp; lvl = 13&amp; Typ = d&amp; sty = r&amp; src = SHELL&amp; FORMULÁRIO = MBEDV8 "frameBorder =" 0 "deslocamento =" não "> </iframe>

    em que [$Latitude] e [$Longitude] são as variáveis que representam os nomes das colunas para cada um desses pontos.

    Exemplo de código de incorporação para mostrar localizações
  8. Clique em guardar como rascunho na parte superior da página.

  9. Teste a sua ligação ao selecionar um item a partir da lista que escolheu. Deverá ver um mapa do Bing que mostra a localização apresentada na peça Web incorporar.

  10. Quando estiver pronto para a sua audiência ver a página, clique em publicar no canto superior direito da página.

Notas: 

  • O código de incorporação tem de ser baseado em iframe (ou seja, iniciar e terminar com <iframe>s etiquetas). O código de incorporação que utiliza etiquetas de <script> não é suportado.

  • Apenas sites seguros podem ser incorporados. Certifique-se de que o URL do Web site começa com HTTPS.

Aumente os seus conhecimentos do Office
Explore as formações
Seja o primeiro a obter novas funcionalidades
Adira ao Office Insider

As informações foram úteis?

Obrigado pelos seus comentários!

Obrigado pelo seu feedback! Parece que poderá ser benéfico reencaminhá-lo para um dos nossos agentes de suporte do Office.

×