Quando si vogliono supportare skin differenti per il nostro sito web, ad esempio per proporne una versione ottimizzata per dispositivi mobili, la soluzione più semplice è quella di realizzare una master page (o, per meglio dire, una layout view, nel caso di Razor) ad-hoc. Essa potrà così contenere i riferimenti ai CSS adeguati, link a eventuali file javascript ed eventualmente presentare un proprio layout.
In Razor, abbiamo la possibilità di dotare il nostro sito di quante layout page vogliamo, referenziando quella desiderata all'interno delle singole view, anteponendo il codice seguente al vero e proprio markup HTML.
@{ Layout = "~/Views/Shared/_Layout.cshtml"; }
Solitamente, invece che replicare questo codice per ogni view, si utilizza un file particolare, denominato _ViewStart.cshtml e contenuto all'interno del folder[] Shared, che viene eseguito automaticamente in fase di rendering.
Dato che Razor non pone alcun vincolo alla complessità del contenuto di _VieswStart.cshtml, possiamo sostituire il codice precedente con una versione che verifichi se la richiesta proviene da un dispositivo mobile, impostando poi una layout view specifica per questo contesto.
@{ if (this.Context.Request.Browser.IsMobileDevice) { Layout = "~/Views/Shared/_MobileLayout.cshtml"; } else { Layout = "~/Views/Shared/_Layout.cshtml"; } }
Tecniche simili possono essere utilizzate per soddisfare anche altre tipologie di requisiti: ad esempio potremmo fare in modo che la skin del sito dipenda dal particolare profilo utente collegato o da un'impostazione che recuperiamo, magari sfruttando la cache, da un database.
Commenti
Per inserire un commento, devi avere un account.
Fai il login e torna a questa pagina, oppure registrati alla nostra community.
Approfondimenti
Configurare il nome della run di un workflow di GitHub in base al contesto di esecuzione
Utilizzare l'espressione if inline in una pipeline di Azure DevOps
Escludere alcuni file da GitHub Secret Scanning
Effettuare il log delle chiamate a function di GPT in ASP.NET Web API
Eseguire operazioni sui blob con Azure Storage Actions
Creare una libreria CSS universale - Rotazione degli elementi
Ordine e importanza per @layer in CSS
Effettuare il binding di date in Blazor
Migliorare la scalabilità delle Azure Function con il Flex Consumption
.NET Conference Italia 2024
Evitare (o ridurre) il repo-jacking sulle GitHub Actions
Configurare lo startup di applicazioni server e client con .NET Aspire
I più letti di oggi
- ecco tutte le novità pubblicate sui nostri siti questa settimana: https://aspit.co/wkly buon week-end!
- Generare una User Delegation SAS in .NET per Azure Blob Storage
- Rendere le variabili read-only in una pipeline di Azure DevOps
- Utilizzare l'attributo accesskey in HTML
- .NET Conference Italia 2024 - Milano