Condividi tramite


Come personalizzare il portale per sviluppatori di Gestione API di Azure usando i modelli

Esistono tre modi fondamentali per personalizzare il portale per sviluppatori in Gestione API di Azure:

I modelli vengono usati per personalizzare il contenuto delle pagine del portale per sviluppatori generate dal sistema (ad esempio, documentazione API, prodotti, autenticazione utente e così via). Usando la sintassi DotLiquid e un set fornito di risorse stringa localizzate, icone e controlli pagina, è possibile configurare il contenuto delle pagine in base alle esigenze.

Annotazioni

Il contenuto della documentazione seguente riguarda il portale per sviluppatori deprecato. È possibile continuare a usarlo come al solito fino al ritiro nell'ottobre 2023, quando verrà rimosso da tutti i servizi di Gestione API. Il portale deprecato riceverà solo gli aggiornamenti critici della sicurezza. Per altre informazioni, vedere gli articoli seguenti:

Disponibilità

Importante

Questa funzionalità è disponibile nei livelli Premium, Standard, Basic e Developer di Gestione API.

Per la disponibilità delle funzionalità nei livelli v2 (anteprima), vedere la panoramica dei livelli v2.

Panoramica dei modelli del portale per sviluppatori

La modifica dei modelli viene eseguita dal portale per sviluppatori durante l'accesso come amministratore. Per iniziare, aprire il portale di Azure e fare clic su Portale per sviluppatori dalla barra degli strumenti del servizio dell'istanza di Gestione API.

Per accedere ai modelli del portale per sviluppatori, fare clic sull'icona personalizza a sinistra per visualizzare il menu di personalizzazione e fare clic su Modelli.

Screenshot che evidenzia l'icona di personalizzazione per visualizzare il menu di personalizzazione.

L'elenco dei modelli visualizza diverse categorie di modelli che coprono le diverse pagine nel portale per sviluppatori. Ogni modello è diverso, ma i passaggi per modificarli e pubblicare le modifiche sono uguali. Per modificare un modello, fare clic sul nome del modello.

Modelli del portale per sviluppatori

Facendo clic su un modello si passa alla pagina del portale per sviluppatori personalizzabile da tale modello. In questo esempio viene visualizzato il modello Elenco prodotti . Il modello Elenco prodotti controlla l'area dello schermo indicata dal rettangolo rosso.

Modello elenco prodotti

Alcuni modelli, ad esempio i modelli di profilo utente , personalizzano parti diverse della stessa pagina.

Modelli di profilo utente

L'editor per ogni modello di portale per sviluppatori include due sezioni visualizzate nella parte inferiore della pagina. Il lato sinistro visualizza il riquadro di modifica per il modello e il lato destro visualizza il modello di dati per il modello.

Il riquadro di modifica del modello contiene il markup che controlla l'aspetto e il comportamento della pagina corrispondente nel portale per sviluppatori. Il markup nel modello usa la sintassi DotLiquid . Un editor popolare per DotLiquid è DotLiquid per designer. Tutte le modifiche apportate al modello durante la modifica vengono visualizzate in tempo reale nel browser, ma non sono visibili ai clienti finché non si salva e si pubblica il modello.

Marcatura del modello

Il riquadro Dati modello fornisce una guida al modello di dati per le entità disponibili per l'uso in un modello specifico. Fornisce questa guida visualizzando i dati in tempo reale attualmente visualizzati nel portale per sviluppatori. È possibile espandere i riquadri modello facendo clic sul rettangolo nell'angolo superiore destro del riquadro Dati modello .

Modello di dati del template

Nell'esempio precedente sono presenti due prodotti visualizzati nel portale per sviluppatori recuperati dai dati visualizzati nel riquadro Dati modello , come illustrato nell'esempio seguente:

{
    "Paging": {
        "Page": 1,
        "PageSize": 10,
        "TotalItemCount": 2,
        "ShowAll": false,
        "PageCount": 1
    },
    "Filtering": {
        "Pattern": null,
        "Placeholder": "Search products"
    },
    "Products": [
        {
            "Id": "56ec64c380ed850042060001",
            "Title": "Starter",
            "Description": "Subscribers will be able to run 5 calls/minute up to a maximum of 100 calls/week.",
            "Terms": "",
            "ProductState": 1,
            "AllowMultipleSubscriptions": false,
            "MultipleSubscriptionsCount": 1
        },
        {
            "Id": "56ec64c380ed850042060002",
            "Title": "Unlimited",
            "Description": "Subscribers have completely unlimited access to the API. Administrator approval is required.",
            "Terms": null,
            "ProductState": 1,
            "AllowMultipleSubscriptions": false,
            "MultipleSubscriptionsCount": 1
        }
    ]
}

Il markup nel modello Elenco prodotti elabora i dati per fornire l'output desiderato eseguendo l'iterazione della raccolta di prodotti per visualizzare informazioni e un collegamento a ogni singolo prodotto. Prendere nota degli elementi <search-control> e <page-control> nel markup. Questi controllano la visualizzazione dei controlli di ricerca e paginazione nella pagina. ProductsStrings|PageTitleProducts è un riferimento di stringa localizzato che contiene il testo dell'intestazione h2 per la pagina. Per un elenco di risorse stringa, controlli pagina e icone disponibili per l'uso nei modelli del portale per sviluppatori, vedere Informazioni di riferimento per i modelli del portale per sviluppatori di Gestione API.

<search-control></search-control>
<div class="row">
    <div class="col-md-9">
        <h2>{% localized "ProductsStrings|PageTitleProducts" %}</h2>
    </div>
</div>
<div class="row">
    <div class="col-md-12">
    {% if products.size > 0 %}
    <ul class="list-unstyled">
    {% for product in products %}
        <li>
            <h3><a href="/products/{{product.id}}">{{product.title}}</a></h3>
            {{product.description}}
        </li>
    {% endfor %}
    </ul>
    <paging-control></paging-control>
    {% else %}
    {% localized "CommonResources|NoItemsToDisplay" %}
    {% endif %}
    </div>
</div>

Per salvare un modello

Per salvare un modello, fare clic su Salva nell'editor di modelli.

Salva modello

Le modifiche salvate non sono attive nel portale per sviluppatori fino a quando non vengono pubblicate.

Per pubblicare un modello

I modelli salvati possono essere pubblicati singolarmente o tutti insieme. Per pubblicare un singolo modello, fare clic su Pubblica nell'editor di modelli.

Pubblicare un modello

Fare clic su per confermare e rendere attivo il modello nel portale per sviluppatori.

Screenshot che mostra dove si seleziona Sì per rendere attivo il modello.

Per pubblicare tutte le versioni dei modelli attualmente non pubblicate, fare clic su Pubblica nell'elenco dei modelli. I modelli non pubblicati sono designati da un asterisco che segue il nome del modello. In questo esempio vengono pubblicati l'elenco Prodotti e i modelli prodotto .

Pubblicare modelli

Fare clic su Pubblica personalizzazioni per confermare.

Confermare la pubblicazione

I modelli appena pubblicati sono effettivi immediatamente nel portale per sviluppatori.

Per ripristinare una versione precedente di un modello

Per ripristinare la versione pubblicata precedente di un modello, fare clic su Ripristina nell'editor di modelli.

Screenshot che evidenzia l'icona che utilizzi per ripristinare un modello.

Fare clic su per confermare.

Screenshot che mostra dove si seleziona Sì per confermare le modifiche.

La versione pubblicata in precedenza di un modello è attiva nel portale per sviluppatori al termine dell'operazione di ripristino.

Per ripristinare una versione predefinita di un modello

Il ripristino dei modelli nella versione predefinita è un processo in due passaggi. Prima di tutto, è necessario ripristinare i modelli e quindi pubblicare le versioni ripristinate.

Per ripristinare un singolo modello nella versione predefinita, fare clic su Ripristina nell'editor dei modelli.

Ripristinare il modello

Fare clic su per confermare.

Confermare

Per ripristinare tutte le versioni predefinite di tutti i modelli, fare clic su Ripristina modelli predefiniti nell'elenco dei modelli.

Ripristinare i modelli

I modelli ripristinati devono quindi essere pubblicati singolarmente o tutti contemporaneamente seguendo la procedura descritta in Per pubblicare un modello.

Passaggi successivi

Per informazioni di riferimento sui modelli del portale per sviluppatori, sulle risorse stringa, sulle icone e sui controlli pagina, vedere Informazioni di riferimento sui modelli del portale per sviluppatori di Gestione API.