BlogEngine.Net: Widget Zone Multipli per i Razor Themes

Poco tempo fa sono stato contattato da un’azienda per far apparire una pubblicità solo nella sidebar della Home Page. Dovevo quindi creare un widget personalizzato da collocare soltanto nella Home Page.

Per cui ho cominciato a frugare nei meandri del forum di BlogEngine.Net per cercare di trovare qualcosa che mi permettese di creare dei Widget Zone multipli: widget differenti e diversi tra l’Home Page e i singoli posts.

Un’interessante articolo è quello di Ben’s Quarters che spiega molto bene i Widget Zone Multipli per i temi in BlogEngine.Net: Multiple Widgetzone in BE.

Il problema è che il mio tema è un razor theme, per cui la faccenda si complicava tremendamente, dato che parliamo di file con estensione chstml e non aspx o ascx (il Razor è stato creato dalla Microsoft con lo scopo di ottenere un layout compatto ed espressivo). Ho provato a chiedere aiuto al forum di BE.Net cercando di definire un singolo widget con la pubblicità richiesta nella Home Page per nasconderlo invece nelle pagine e nei posts.

Praticamente ogni widget ha un ID, impostando l’ID del widget in visible=true nella Home Page e in visible = false nelle altre sezioni avrei potuto risolvere il problema ma per il razor theme non esiste un widgetContainer così ho dovuto creare un widget zone multiplo personalizzato per la home e per le pagine e i posts.

In pratica ecco come ho fatto:

<!-- Begin #colRight -->
@if (Request.Url.ToString().ToLowerInvariant().Contains("/default.aspx"))  	
{                     	
if (Request.RawUrl.ToLowerInvariant().Contains("/category/") || Request.RawUrl.ToLowerInvariant().Contains("/author/") || Request.RawUrl.ToLowerInvariant().Contains("?tag=") || Request.QueryString["year"] != null || Request.QueryString["date"] != null || Request.QueryString["calendar"] != null)
	    {
	     <div id="sidebar-page">
@Html.Raw(Html.RenderWidgetZone("page-sidebar"))
</div>
}
else
{
	        @Html.Raw(Html.RenderWidgetZone("be_WIDGET_ZONE"))
	    }
}
else
{
	    <div id="sidebar-page">
@Html.Raw(Html.RenderWidgetZone("page-sidebar"))
</div>
}
 <!-- End #colRight -->

Ho creato nel file principale del mio tema, nel mio caso Site.Cshtml, una condizione in cui dico al sistema che se la pagina in cui mi trovo è diversa dalla Home Page, “page-sidebar” è la widget zone da utilizzare come sidebar, altrimenti può tranquillamente utilizzare “be_WIDGET_ZONE”.

Aiutandomi con i CSS non ho fatto altro utilizzare l’id “siderbar-page” per definire colori, forme e caratteri dei nuovi widget.

Oltre alla possibilità di creare due diversi sidebar con widget al seguito differenti per pagine, articoli, Home Page, ecc.. è possibile anche creare delle widget zone all’interno della sidebar. Ad esempio se vogliamo diverse widget zone all’interno della sidebar possiamo creare un midWidget e un bottomWidget, aiutandoci sempre con i CSS:

<!-- Begin #colRight -->
<div id="colRight">
<div id="topWidget">
@Html.Raw(Html.RenderWidgetZone("be_WIDGET_ZONE"))
</div>
@if (Request.Url.ToString().ToLowerInvariant().Contains("default.aspx") || Request.Url.ToString().ToLowerInvariant().Contains("blog.aspx"))
{
<div id="midWidget">
@Html.Raw(Html.RenderWidgetZone("be_WIDGET_MID"))
</div>
}
<div id="bottomWidget">
@Html.Raw(Html.RenderWidgetZone("be_WIDGET_BOTTOM"))
</div>
</div>
<!-- End #colRight -->