Questo articolo riguarda lo sviluppo di annunci per l'SDK Google Mobile Ads. Spiega quali informazioni sono necessarie allo sviluppatore e come vengono utilizzate per creare tag che specificano il comportamento dell'annuncio.
Sono disponibili diversi formati di annunci, tra cui banner in-app, banner espandibili e annunci a schermo intero. Ogni formato dell'annuncio ha proprie funzionalità e propri asset delle creatività. Ad esempio, i banner espandibili possono cambiare le dimensioni e il colore dello sfondo quando vengono selezionati. L'SDK Google Mobile Ads è compatibile con gli standard MRAID.
Per utilizzare l'SDK Google Mobile Ads, devi procurarti l'ID app, gli ID unità pubblicitaria e le dimensioni dell'annuncio per il tuo sviluppatore.
In questa pagina:
- Trovare gli ID applicazione di Google Mobile Ads
- Trovare le dimensioni e gli ID unità pubblicitarie
- Altre funzioni JavaScript
- Compatibilità con MRAID
Trovare gli ID applicazione di Google Mobile Ads
- Accedi a Google Ad Manager.
- Fai clic su Inventario, quindi su App.
- Trova l'app mobile per cui ti serve l'ID o richiedi una nuova app mobile.
- Fai clic su
per copiare "l'ID app" negli appunti. Ad esempio,
ca-app-pub-3940256099942544~3347511713 - Invia queste informazioni allo sviluppatore.
Trovare le dimensioni e gli ID unità pubblicitarie
- Fai clic su Inventario, quindi su Unità pubblicitarie.
- Fai clic sul nome dell'unità pubblicitaria per cui vuoi creare un tag annuncio oppure creane una nuova.
- Fai clic su Tag.
- Seleziona il tipo di tag "Tag applicazione mobile" e fai clic su Continua.
- Nella sezione "Risultati tag", copia "l'ID unità pubblicitaria" e le "dimensioni unità pubblicitaria". Invia queste informazioni allo sviluppatore.
Altre funzioni JavaScript
Per sfruttare le funzionalità dell'SDK Google Mobile Ads, consulta la documentazione per gli sviluppatori.
Di seguito sono riportate alcune funzioni importanti per modificare la sezione della creatività.
L'SDK mostra le funzionalità dei browser in-app disponibili su iOS e Android. Questo consente agli sviluppatori di accedere alle funzionalità del dispositivo quali accelerometro, giroscopio e bussola tramite HTML5, se supportate dalla piattaforma.
La funzione per gli eventi app ti consente di eseguire codice personalizzato nell'applicazione quando una creatività invia uno di questi eventi. Con questa funzione, puoi introdurre esecuzioni di annunci personalizzati che interagiscono con l'applicazione, ad esempio la modifica del colore di sfondo dell'app stessa.
Scopri come implementare gli eventi app.Se noti che l'annuncio a schermo intero occupa solo una parte dello schermo, inserisci il seguente codice nella sezione della creatività:
.
Questo modello è un annuncio banner che inizia come tale nella parte inferiore dello schermo. Se un utente fa clic sul banner, l'applicazione calendario predefinita crea un nuovo evento dietro suo consenso.
Comportamento ed elementi dell'interfaccia utente
La creatività è costituita dai seguenti elementi dell'interfaccia utente:
- L'immagine del banner e la rispettiva altezza e larghezza.
- Le informazioni sull'evento, come riepilogo, descrizioni, luogo, data di inizio e fine, sono obbligatorie.
| Nome | Tipo | Obbligatorio | Descrizione |
|---|---|---|---|
| File immagine del banner | File | Sì | Immagine dell'annuncio banner. |
| Larghezza immagine del banner | Numero | Sì | Larghezza dell'immagine del banner. |
| Altezza immagine del banner | Numero | Sì | Altezza dell'immagine del banner. |
| Riepilogo evento | Testo | Sì | Riepilogo dell'evento. |
| Descrizione evento | Testo | Sì | Descrizione dell'evento. |
| Luogo evento | Testo | No | Luogo dell'evento. |
| Data di inizio evento | Testo | Sì | Data di inizio dell'evento. La data di inizio deve avere il seguente formato: "2016-10-22T00:00-05:00", che, a titolo esemplificativo, corrisponde al 22 ottobre 2016 dalle 00:00 alle 05:00. |
| Data di fine evento | Testo | Sì | Data di fine dell'evento. La data di fine deve avere il seguente formato: "2016-10-22T00:00-05:00", che, a titolo esemplificativo, corrisponde al 22 ottobre 2016 dalle 00:00 alle 05:00. |
Nome dell'unità pubblicitaria di test: ali_Calendar
Questo modello è un'unità pubblicitaria a due componenti che inizia come annuncio banner nella parte inferiore dello schermo. Se un utente fa clic sul banner, l'annuncio si ridimensiona in base a dimensioni espanse specifiche. Se l'utente fa clic sull'annuncio con dimensioni espanse, viene reindirizzato all'URL di clickthrough definito.
La larghezza può corrispondere alle dimensioni del banner o alla larghezza dell'intero schermo (se il valore di FullWidthResize è "Yes").
Comportamento ed elementi dell'interfaccia utente
La creatività è costituita dai seguenti elementi dell'interfaccia utente:
- Asset della creatività (per ciascun asset è obbligatorio inserire file, altezza e larghezza)
- Componente Immagine del banner
- Componente Banner ridimensionato
- Icona del pulsante di chiusura
- È possibile cambiare la posizione del pulsante di chiusura in modo da mostrarlo nella parte superiore destra o sinistra dello schermo.
- Il colore dello sfondo dell'annuncio può essere modificato.
| Nome | Tipo | Obbligatorio | Descrizione |
|---|---|---|---|
| File immagine del banner | File | Sì | L'immagine mostrata nell'annuncio banner. |
| Altezza immagine del banner | Numero | Sì | L'altezza dell'immagine del banner. |
| Larghezza immagine del banner | Numero | Sì | La larghezza dell'immagine del banner. |
| Colore sfondo | Testo | Sì | Il colore dello sfondo dello spazio occupato dall'immagine ridimensionata e dal banner. |
| URL di clickthrough | URL | Sì | L'URL cui l'utente viene reindirizzato quando fa clic sull'annuncio ridimensionato. |
| File immagine ridimensionata | File | Sì | L'immagine mostrata quando viene fatto clic sul banner. |
| Altezza immagine ridimensionata | Numero | Sì | L'altezza dell'immagine ridimensionata. |
| Larghezza immagine ridimensionata | Numero | Sì | La larghezza dell'immagine ridimensionata. |
| Icona di chiusura | File | Sì | Il file immagine per il pulsante "Chiudi". |
| Larghezza icona di chiusura | Numero | Sì | La larghezza del pulsante "Chiudi" (30 è la larghezza media). |
| Altezza icona di chiusura | Numero | Sì | L'altezza del pulsante "Chiudi" (30 è l'altezza media). |
| Posizione del pulsante di chiusura | Elenco | No | È possibile posizionare il pulsante "Chiudi" in modo da mostrarlo nella parte superiore destra o sinistra dello schermo. I valori possibili sono "Right" o "Left". Se questo valore viene lasciato vuoto, il pulsante di chiusura verrà posizionato nella parte superiore destra dello schermo. |
| Ridimensionamento a larghezza massima | Elenco | No | Se il valore è "Yes", l'annuncio ridimensionato riempie l'intera larghezza dello schermo. Se il valore è "No", la larghezza sarà uguale a quella del banner originale. I valori possibili sono "Yes" e "No", mentre il valore predefinito è "No". |
Nome dell'unità pubblicitaria di test: ali_resizeBanner
Questo modello è un'unità pubblicitaria a due componenti che inizia come annuncio banner nella parte inferiore dello schermo. Se un utente fa clic sul banner, l'annuncio si ridimensiona fino a coprire l'intero schermo. Se l'utente fa clic sull'annuncio con dimensioni espanse, viene reindirizzato all'URL di clickthrough definito.
Questo modello utilizza il pulsante di chiusura MRAID predefinito.
Comportamento ed elementi dell'interfaccia utente
La creatività è costituita dai seguenti elementi dell'interfaccia utente:
- Asset della creatività:
- Componente Immagine del banner (altezza e larghezza sono obbligatorie)
- Componente Banner espanso
- Il colore dello sfondo dell'annuncio banner e dell'annuncio espanso può essere modificato
| Nome | Tipo | Obbligatorio | Descrizione |
|---|---|---|---|
| File immagine del banner | File | Sì | L'immagine mostrata nell'annuncio banner. |
| Altezza immagine del banner | Numero | Sì | L'altezza dell'immagine del banner. |
| Larghezza immagine del banner | Numero | Sì | La larghezza dell'immagine del banner. |
| Colore sfondo | Testo | Sì | Il colore assunto dallo sfondo dello spazio occupato dall'immagine del banner. |
| URL di clickthrough | URL | Sì | L'URL cui l'utente viene reindirizzato quando fa clic sull'annuncio ridimensionato. |
| File immagine espansa | File | Sì | L'immagine mostrata quando viene fatto clic sul banner. |
| Altezza immagine espansa | Numero | Sì | L'altezza dell'immagine espansa. |
| Larghezza immagine espansa | Numero | Sì | La larghezza dell'immagine espansa. |
Nome dell'unità pubblicitaria di test: ali_expandDefaultClose
Per chiudere un annuncio interstitial dopo un periodo di tempo prestabilito:
- Includi nella creatività il codice per chiudere l'annuncio interstitial una volta trascorso uno specifico periodo di tempo. Per questo approccio, puoi utilizzare come modello il codice riportato di seguito:
[Your_AdCode_Goes_Here]
Se utilizzi la funzione admob.opener.openOverlay(), puoi aprire una finestra del browser sovrapposta a schermo intero, con animazione dalla parte inferiore della schermata. Questo browser non include una barra di stato e mostra sempre un pulsante di chiusura nell'angolo in alto a sinistra. Questa opzione può essere adatta per un annuncio espandibile in cui la creatività a schermo intero può essere ospitata in una pagina separata.
Di seguito viene riportato un codice campione relativo a un banner in cui l'unità a schermo intero può essere caricata in una finestra overlay del browser. Devi sostituire i seguenti elementi segnaposto con i tuoi valori. Se disponibile per la tua rete, puoi utilizzare il codice di esempio per generare un modello di creatività.
[BANNER_UNIT]: URL di una creatività banner.[WIDTH]: larghezza di una creatività banner.[HEIGHT]: altezza di una creatività banner.[FULLSCREEN_UNIT]: URL di una creatività a schermo intero. Nota: l'unità a schermo intero deve includere il codice JavaScript per analizzare l'URL di destinazione e reindirizzare l'utente alla pagina di destinazione dopo aver ricevuto un'azione clic. Per ulteriori dettagli, consulta Gestire l'URL di destinazione da un'unità a schermo intero.[DESTINATION_URL]: URL di una pagina di destinazione.[FALLBACK_URL]: URL di destinazione di riserva da utilizzare nel caso in cui la funzione JavaScript non venisse eseguita.[ORIENTATION]: orientamento supportato per l'URL di destinazione. Utilizza "p" per verticale (portrait), "l" per orizzontale (landscape) oppure ometti questo valore per consentire qualsiasi orientamento.
Di seguito è riportato un codice creatività di esempio:
Gestire l'URL di destinazione da un'unità a schermo intero
La funzione admob.opener.openOverlay() non consente di specificare l'URL di destinazione dei contenuti HTML.
Supponendo che l'URL di destinazione sia stato trasmesso sotto forma di coppia chiave-valore quando è stata specificata l'unità a schermo intero (ad esempio, "https://link.to.fullscreen.unit?destination=https://my.destination.url"), puoi scrivere una funzione JavaScript e includere uno snippet di codice HTML per registrare il clic e reindirizzare l'utente alla pagina di destinazione.
Di seguito è riportato il codice sorgente di una pagina di esempio: