Usare la web part Hero

Porta lo stato attivo e l'interesse visivo alla tua pagina e al tuo video con la web part Hero. È possibile visualizzare fino a cinque elementi nella web part Hero e usare immagini, testo e collegamenti accattivanti per attirare l'attenzione su ognuno di essi. La web part Hero è inclusa per impostazione predefinita nei siti di comunicazione, ma è possibile aggiungerla anche in altre pagine. 

Se i video sono impostati nella web part Hero, verranno riprodotti in linea mentre tu puoi rimanere e sfogliare la stessa pagina invece di essere indirizzato a una nuova finestra. 

Alcune funzionalità vengono introdotte gradualmente nelle organizzazioni che hanno acconsentito esplicitamente a partecipare al programma Targeted Release. Ciò significa che questa caratteristica potrebbe non essere ancora disponibile o essere diversa da quella descritta negli articoli della Guida.

Sommario

• Web part Hero nei siti di comunicazione: Argomento e Presentazione
• Cambiare il layout della web part Hero
• Cambiare l'immagine, il testo e i collegamenti per ogni riquadro o livello
• Modificare il punto focale di un'immagine
• Riordinare i riquadri o livelli
• Posizionare la web part Hero in una colonna
• Aggiungere una web part Hero vuota a una pagina
• Ridimensionamento delle immagini nella web part Hero

Web part Hero nei siti di comunicazione: Argomento e Presentazione

Quando si crea un sito di comunicazione, è possibile iniziare con un sito vuoto o scegliere uno degli altri modelli di sito, ognuno dei quali include un set predefinito di web part. Alcuni di questi modelli di sito di comunicazione includono la web part Hero, ad esempio:

• Comunicazione Standard: condividi informazioni come notizie, eventi e altri contenuti.
• Mostra: utilizza foto o immagini per presentare un prodotto, un team o un evento.

In questi modelli, la web part Hero è inclusa nella pagina per impostazione predefinita. È prepopolato con immagini, testo e collegamenti predefiniti che puoi modificare per mostrare immagini, testo, pagine, collegamenti o documenti personalizzati.

Quando si seleziona il modello di comunicazione Standard, l'eroe predefinito è un layout affiancato con cinque riquadri (che è possibile modificare da uno a cinque):

Quando selezioni il modello Vetrina , l'hero predefinito è un layout verticale con tre livelli (che puoi modificare da uno a cinque livelli):

È possibile modificare il layout della web part Hero da una griglia a livelli verticali o caroselli, utilizzando il pulsante (1) Modifica proprietà ( ) ed è possibile modificare i collegamenti, le immagini e il testo per ogni riquadro o livello utilizzando il pulsante (2) Modifica dettagli ( ) per ogni riquadro o livello.

1. Pulsante Modifica web part

2. Pulsante Modifica dettagli

Cambiare il layout della web part Hero

Se non è già attiva la modalità di modifica nella pagina, selezionare Modifica nell'angolo in alto a destra della pagina.

1. Puoi selezionare uno dei tre layout disponibili per la web part Hero: Carosello, Riquadri e Livelli. Selezionare il layout selezionando Modifica proprietà ( ) nell'angolo in alto a sinistra della web part e quindi selezionare il layout dal menu a discesa layout:

   

   In alternativa, è possibile selezionare il tipo di layout desiderato nel riquadro delle proprietà della web part:

   

2. Nel riquadro delle proprietà della web part scegliere:

   • Aggiungere una diapositiva per il layout Carosello
      

     Suggerimento

     • Per il layout Carosello, per abilitare/disabilitare la transizione automatica delle diapositive, puoi attivare/disattivare l'interruttore Riproduzione automatica.
     • 

   • Aggiungere un riquadro per il layout Riquadri

   • Aggiungi un layer per il layout dei layer
     

• Nota

  puoi selezionare fino a 5 riquadri (come quello in un sito di comunicazione Standard), o fino a 5 livelli (come quello in un sito Vetrina), o fino a 5 immagini nel carosello. 

Cambiare l'immagine, il testo e i collegamenti per ogni riquadro o livello

Se non è già attiva la modalità di modifica nella pagina, selezionare Modifica nell'angolo in alto a destra della pagina.

1. Selezionare Modifica dettagli ( ) in basso a destra nel riquadro o nel livello che si desidera modificare.

2. Nel riquadro delle proprietà selezionare Cambia e quindi scegliere un percorso da cui ottenere il collegamento:

   • Recenti: qui sono elencate le immagini, le pagine o i documenti aperti di recente.

   • Immagini di archivio Le immagini di archivio sono fornite da Microsoft. Sono di alta qualità e di dimensioni perfette per il tuo utilizzo. Se si è un amministratore di SharePoint, è consigliabile abilitare una rete per la distribuzione di contenuti (CDN) per migliorare le prestazioni di acquisizione delle immagini.

   • Ricerca Web: puoi trovare immagini da Bing che usano la licenza Creative Common. L'utente è responsabile della revisione delle licenze di un'immagine prima di inserirla nella pagina. Solo SharePoint in Microsoft 365.

   • L'organizzazione: se l'organizzazione ha specificato un set di risorse approvate, sarà possibile scegliere tra tale set qui.  Se sei un Amministrazione di SharePoint e vuoi sapere come creare una libreria di risorse per la tua organizzazione, consulta Creare una raccolta di risorse dell'organizzazione.

   • OneDrive: è possibile ottenere un collegamento per un documento o un'immagine archiviata in OneDrive. Solo SharePoint in Microsoft 365.

   • Sito: è possibile ottenere un collegamento per un documento, un'immagine o una pagina da un sito specificato.

   • Carica: è possibile caricare un documento o un'immagine da un dispositivo personale.

   • Da un collegamento: immetti un collegamento per la pagina, il documento o l'immagine da OneDrive o SharePoint in Microsoft 365.

     Nota

     I collegamenti esterni al sito non mostreranno un'anteprima dell'immagine in U.S. Government GCC High e DoD e in Office 365 gestito da 21Vianet.

3. Selezionare l'immagine, la pagina o il documento e selezionare Apri.

4. Nel riquadro delle proprietà, in Immagine di sfondo, selezionare Immagine personalizzata o Solo colore (solo colore è disponibile solo per il layout Riquadri e il colore corrisponde al colore del tema del sito).
   L'opzione Immagine selezionata automaticamente seleziona automaticamente un'immagine dalla pagina o dal documento che si sta collegando, se disponibile.

5. Immettere l'intestazione per l'immagine.

   • Puoi mostrare un collegamento di invito all'azione impostando l'interruttore su Sì. Quindi aggiungere il Testo Invito all'azione, ad esempio "Fare clic per altre informazioni". Il collegamento Invito all'azione è disponibile per ogni livello in un layout a livelli, ma solo per il riquadro più grande in un layout a riquadri.

     Nota

     Il layout Carosello ha 3 nuovi stili. È possibile impostare stili diversi (Sovrimpressione immagine, Blocco di testo, Divisione diagonale) per ogni diapositiva per variare la presentazione del contenuto.

     

Modificare il punto focale di un'immagine

In SharePoint in Microsoft 365, è possibile cambiare il punto focale su un'immagine selezionata all'interno della web part Hero per ottenere la parte più importante dell'immagine nella cornice.

1. Se non è già attiva la modalità di modifica nella pagina, selezionare Modifica nell'angolo in alto a destra della pagina.

2. Seleziona Imposta punto focale nella barra degli strumenti nella parte inferiore dell'immagine Hero che desideri modificare.

3. Trascinare il punto focale nell'immagine nel punto desiderato.

   

Riordinare immagini, riquadri o livelli del carosello

Puoi riordinare le immagini del carosello, i riquadri o i livelli spostandoli dove vuoi.

1. Se non è già attiva la modalità di modifica nella pagina, selezionare Modifica nell'angolo in alto a destra della pagina.
2. Nel riquadro delle proprietà, seleziona i tre puntini di sospensione accanto all'immagine, al riquadro o al livello, quindi seleziona Sposta su o Sposta giù per riordinare. Per i riquadri e i livelli, puoi anche semplicemente selezionare l'immagine, quindi tenere premuto e trascinare il riquadro o il livello nel punto desiderato.

Inserire la web part Hero in una delle due o tre colonne

La web part Hero è progettata per occupare l'intera larghezza della pagina. Se si preferisce che la web part Hero non occupi l'intera larghezza, è possibile farlo modificando il layout della sezione.

1. Se non sei già in modalità di modifica, seleziona Modifica nella parte superiore destra della pagina.
2. Passare il puntatore del mouse appena sopra la web part Hero e selezionare il simbolo + cerchiato a sinistra della web part
3. In Layout sezione, selezionare Due colonne o Tre colonne.
4. La web part Hero ora si trova nella colonna sinistra delle due o tre colonne della sezione. 
5. Per spostare la web part Hero, selezionare l'immagine, quindi tenerla premuta e trascinarla nella colonna desiderata.

Aggiungere una web part Hero vuota a una pagina

È possibile aggiungere una web part Hero a una pagina in un sito del team o in un sito di comunicazione . Per eseguire questa operazione:

1. Se non è già attiva la modalità di modifica nella pagina, selezionare Modifica nell'angolo in alto a destra della pagina. Trovare la casella degli strumenti ( ) sulla destra.

2. Selezionare Vedi tutte le web part, quindi selezionare o trascinare Hero dall'elenco delle web part.

3. Selezionare Modifica proprietà ( ) e selezionare il tipo di layout desiderato: è possibile utilizzare una griglia da 1 a 5 riquadri o da 1 a 5 livelli verticali.

4. Selezionare Seleziona collegamento per ogni riquadro che si desidera modificare.

5. Per ogni riquadro, nella casella degli strumenti, selezionare Seleziona e quindi scegliere una posizione da cui ottenere il collegamento:
   Nella casella degli strumenti selezionare Cambia e quindi scegliere un percorso da cui ottenere il collegamento:

   • Recenti: qui sono elencate le immagini, le pagine o i documenti aperti di recente.
   • Ricerca Web: puoi trovare immagini da Bing che usano la licenza Creative Common. L'utente è responsabile della revisione delle licenze di un'immagine prima di inserirla nella pagina. Solo SharePoint in Microsoft 365.
   • L'organizzazione: se l'organizzazione ha specificato un set di risorse approvate, sarà possibile scegliere tra tale set qui.  Se sei un Amministrazione di SharePoint e vuoi sapere come creare una libreria di risorse per la tua organizzazione, consulta Creare una raccolta di risorse dell'organizzazione.
   • OneDrive: è possibile ottenere un collegamento per un documento o un'immagine archiviata in OneDrive. Solo SharePoint in Microsoft 365.
   • Sito: è possibile ottenere un collegamento per un documento, un'immagine o una pagina da un sito specificato.
   • Carica: è possibile caricare un documento o un'immagine da un dispositivo personale.
   • Da un collegamento: immettere un collegamento per la pagina, il documento o l'immagine da OneDrive per SharePoint in Microsoft 365.

6. Selezionare l'immagine, la pagina o il documento e fare clic su Apri.

7. Nella casella degli strumenti, in Immagine, selezionare Immagine personalizzata o Solo colore. L'opzione Immagine selezionata automaticamente seleziona automaticamente un'immagine dalla pagina o dal documento che si sta collegando, se disponibile. Solo colore è disponibile solo per il layout Riquadri e il colore corrisponde al colore del tema del sito.

8. Immetti un testo alternativo per l'immagine.

9. Puoi mostrare un collegamento di invito all'azione impostando l'interruttore su Sì. Quindi aggiungere il Testo Invito all'azione, ad esempio "Fare clic per altre informazioni". Il collegamento Invito all'azione è disponibile per ogni livello in un layout a più livelli, ma solo per il riquadro più grande in un layout affiancato

Ridimensionamento delle immagini nella web part Hero

Per scegliere immagini di dimensioni adeguate per la web part Hero, considerare quanto segue:

• La web part è progettata per adattare la larghezza dello schermo in un layout al vivo.
• Nel layout Riquadri , l'altezza della web part viene ridimensionata in base a proporzioni di 8:3 e le immagini all'interno della web part vengono ridimensionate in proporzioni di 4:3.
• Nel layout Livelli , un singolo livello viene ridimensionato in proporzioni di 8:3 e le immagini all'interno di ciascun livello vengono ridimensionate in un rapporto di aspetto vicino a 9:16.

Quando sarà disponibile il layout Carosello?

Disponibilità generale (in tutto il mondo, GCC, GCC High e DoD): l'implementazione inizia a metà gennaio 2025 e sarà completata entro la fine del mese.

Cosa succede ai layout esistenti dopo l'aggiunta del layout Carosello?

Come parte degli aggiornamenti alla web part Hero, sono state apportate le modifiche seguenti:

• Aggiornamenti di gestione degli elementi
  Il modo in cui si gestiscono gli elementi nella web part Hero è stato modificato. Invece di impostare il numero di elementi (1-5), è ora possibile aggiungere o eliminare direttamente gli elementi usando la nuova interfaccia intuitiva di Slide . Questo semplifica il processo di personalizzazione della web part Hero in base alle proprie esigenze.
• Rettifiche del riquadro delle proprietà
  Sebbene l'interfaccia utente nel riquadro delle proprietà per i layout Mosaici e Livelli sia stata aggiornata per un'esperienza più moderna, la funzionalità di questi layout rimane invariata.
•   Nessun impatto sui layout esistenti
  Se attualmente stai utilizzando i layout Riquadri o Livelli , stai certo che rimarranno così come sono. Non ci sarà alcuna conversione automatica al nuovo layout del carosello , assicurando che le pagine esistenti continuino ad apparire e funzionare come previsto.