Stijlbibliotheekinhoud in SharePoint 2010

CSS-webbesturingselementen in SharePoint

Webserverbesturingselementen zijn verantwoordelijk voor het beheren en weergeven van CSS-bestandslinks en stijlbladen. Standaard bevinden de webserverbesturingselementen zich op de SharePoint-basispagina's. Als u stramienpagina's wilt vinden, kijkt u in de Galerij met stramienpagina's en pagina-indeling, of, in SharePoint Foundation, in de galerij met stramienpagina's. Het relatieve pad naar de galerij is /_catalogs/masterpage/Forms/AllItems.aspx.

De hoofdpagina zoeken

Als u de CSS-webserverbesturingselementen in SharePoint wilt onderzoeken, heeft u een kopie nodig van de hoofdpagina die op de site wordt gebruikt. Maar als u een kopie van de hoofdpagina voor uw site wilt downloaden, moet u weten welke hoofdpagina uw site gebruikt.

Gebruik een of meer van de volgende opties om te bepalen welke basispagina uw site gebruikt:

• Op een SharePoint Server 2010-site waar publicatiefuncties zijn ingeschakeld en geactiveerd, gaat u naar de pagina met instellingen voor de sitemasterpagina via Siteacties,  .Hoofdpagina op de link Uiterlijk. Klik vervolgens onder het gedeelte Instellingen, Site

• In plaats van het menu te gebruiken om de pagina Instellingen sitemasterpagina te vinden, voegt u het volgende URL-fragment toe aan het einde van het serveradres voor uw site: /_layouts/ChangeSiteMasterPage.aspx; bijvoorbeeld https://contoso.com/\_ layouts/ChangeSiteMasterPage.aspx

• Op een SharePoint Foundation-site kunt u Windows PowerShell gebruiken om te bepalen welke basispagina de site gebruikt, zoals weergegeven in Figuur 4. Het volgende is een voorbeeldscript.

  PowerShell

  $web = get-spweb("https://contoso.com");$web.masterurl

Figuur 4. v4.master op een SharePoint-teamsite

Tabel 4 geeft een overzicht van alle webserverbesturingselementen die verband houden met CSS en die beschikbaar zijn in SharePoint Server. U vindt deze besturingselementen in de naamruimte Microsoft.SharePoint.WebControls, die deel uitmaakt van de Microsoft.SharePoint.dll-assembly.

Tabel 4. CSS-webserverbesturingselementen in SharePoint 2010

Tabel uitvouwen

In de volgende secties wordt elke controle beschreven die in Tabel 4 wordt vermeld, en worden de voordelen van elk ervan samengevat.

CSSLink

Het CSSLink-webbesturingselement bevindt zich op SharePoint-basispagina's en is verantwoordelijk voor het weergeven van de HTML <LINK> element. Het CSSLink-besturingselement werkt met de CSSRegistration-besturingselementen. Als er CSSRegistration-besturingselementen op de pagina staan, registreert en geeft het CSSLink-besturingselement de aanvullende CSS-bestandsverwijzingen weer die het registratiebesturingselement maakt.

Het CSSLink-besturingselement heeft de volgende leden:

• UIVersion (optioneel) – Hiermee kunnen site-eigenaren het uiterlijk van een geüpgradede of gemigreerde SharePoint-site wijzigen. Schakelt sitevoorbeeld in de SharePoint-gebruikersinterface of de Microsoft Office SharePoint Server (MOSS) 2007-gebruikersinterface in. Stel de waarde in op 4 voor SharePoint en op 3 voor MOSS 2007-sites.

• Versie (optioneel) — Overschrijft de besturingsversie van de SPControl-klasse.

• Alternatief (optioneel) — Geeft aan of de kern-CSS (Core.css of Corev4.css) wordt weergegeven met andere CSS-bestandsreferenties, of dat er een alternatieve CSS wordt weergegeven. De standaardwaarde is False, wat aangeeft dat het core css-bestand (core.css of corev4.css) wordt weergegeven.

• DefaultUrl (optioneel) — Stelt de standaard URL in of haalt deze op die wordt gebruikt voor het CSS-bestand.

  In het volgende voorbeeld ziet u hoe dit besturingselement kan worden weergegeven.

  HTML

  <link rel="stylesheet" type="tekst/css" href="/_layouts/1033/styles/Themable/search.css?rev=Uoc0fsLIo87aYwT%2FGX5UPw%3D%3D"/> <link rel="stylesheet" type="tekst/css" href="/_layouts/1033/styles/Themable/wiki.css?rev=9pXM9jgtUVYAHk21JOAbIw%3D%3D"/> <link rel="stylesheet" type="tekst/css" href="/_layouts/1033/styles/Themable/corev4.css?rev=iIikGkMuXBs8CWzKDAyjsQ%3D%3D"/>

Het CSSLink-besturingselement voegt een ?rev= querystringparameter toe aan de bestandsreferentie om de browsercaching te controleren en de browser te dwingen een nieuwe kopie van het bestand op te halen.

Het CSSLink-besturingselement is ook verantwoordelijk voor het gedrag dat in de volgende sectie wordt beschreven.

CSS-registratie

Het webbesturingselement CSSRegistration wordt samen met het CSSLink-besturingselement gebruikt om CSS-bestanden te registreren, zodat deze op de pagina kunnen worden weergegeven. Registreer CSS-bestanden op relatieve of statische URL.

Het CSSRegistration-besturingselement heeft de volgende leden:

• Naam (vereist) — De bestandsnaam die moet worden geregistreerd. Als de naam niet wordt opgegeven, genereert SharePoint de fout die wordt weergegeven in Figuur 5. De waarde van de eigenschap Name moet een bestandsnaam of een URL zijn. Als er een bestandsnaam wordt gebruikt, moet het CSS-bestand aanwezig zijn in de map LAYOUTS Style.

  In het volgende voorbeeld ziet u hoe u het bestand custom.css gebruikt waarnaar hierboven wordt verwezen en dat is geïmplementeerd in de map Styles (C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14\TEMPLATE\LAYOUTS\{Locale- ID}\STIJLEN).

  XAML

  <SharePoint:CssRegistration runat="server" Naam="aangepast.css" />

  In het volgende voorbeeld ziet u hoe het CSSLink-besturingselement de custom.css-registratie weergeeft.

  HTML

  <link rel="stylesheet" type="tekst/css" href="/_layouts/1033/styles/custom.css?rev=pFayZ3XaoWhaMymtxOLHNA%3D%3D"/>

  Naast het verwijzen naar een bestand dat zich in de map LAYOUTS\{Locale ID}\Styles bevindt, kunt u een bestand registreren met behulp van een URL. Geef één URL op in de eigenschap Naam met behulp van tokens. Enkele bekende URL-tokens zijn: ~site, ~sitecollection en ~taal. Gebruik deze tokens samen met een expressiebouwer, zoals SPUrl. Het ~taal-token wordt toegewezen aan een taal-cultuurreeks, zoals en-us.

  Een item toevoegen dat lijkt op het volgende voorbeeld...

  XAML

  <SharePoint:CssRegistration Name="<%$ SPUrl:~sitecollection/Stijlbibliotheek/~taal/Aangepast/2ndcustom.css %>" runat="server" />

  …genereert de volgende HTML, zoals weergegeven in Figuur 5.

  HTML

  <link rel="stylesheet" type="tekst/css" href="/Style%20Library/en-US/Custom/2ndcustom.css"/>

Figuur 5. SharePoint-paginafout

• Na (optioneel) — Specificeert de weergavevolgorde van het CSS-bestand dat u registreert. Als u bijvoorbeeld een aangepast stijlblad wilt weergeven met de naam custom.css naar core4.css, gebruikt u de volgende code om het registratiebeheer te configureren.

  XAML

  <SharePoint:CssRegistration Name="<%$ SPUrl:~sitecollection/Stijlbibliotheek/~taal/Aangepast/2ndcustom.css %>" runat="server" Na="core4.css" />

  Als u dit doet, wordt het CSSLink-webbesturingselement gedwongen uw aangepaste bestand weer te geven na de bestandskoppeling core4.css.

  HTML

  <link rel="stylesheet" type="tekst/css" href="/_layouts/1033/styles/Themable/corev4.css?rev=iIikGkMuXBs8CWzKDAyjsQ%3D%3D"/> <link rel="stylesheet" type="tekst/css" href="/Style%20Library/en-US/Custom/2ndcustom.css"/>

   Opmerking

  U kunt de expressiebouwer SPUrl alleen gebruiken op SharePoint Server-sites; het is niet beschikbaar in SharePoint Foundation.

• EnableCSSTheming: geeft aan of u wilt dat uw stijlbladen thematisch zijn, wat betekent dat ze kunnen worden toegepast als onderdeel van aangepaste SharePoint-thema's.

  • Stel de eigenschap EnableCSSTheming van het CSSRegistration-besturingselement in op true.

  • Voeg themaopmerkingen toe aan uw CSS-stijlklassen. Om enkele voorbeelden te zien, bekijkt u de map Themable die is geïnstalleerd met SharePoint (C:\Program Files\Common Files\Microsoft Shared\Web Server Extensions\14 \TEMPLATE\LAYOUTS\{Locale-ID}\STYLES\Themable).

    Het volgende voorbeeld toont de CSS-klasse ms-toolbar in Themable Corev4.css. Als u een thema toepast, vervangt het thema elke keer dat de klasse ms-toolbar wordt gebruikt de kleur #0072BC door de Hyperlink-themakleur die in het thema zelf is gedefinieerd.

    .ms-toolbar{ lettertypefamilie:verdana; lettergrootte:8pt; tekstversiering:geen; /* [Kleur vervangen(themaKleur:"Hyperlink")] */ kleur:#0072BC; }

• ConditionalExpression — Wordt gebruikt om op te geven of dit stijlblad moet worden toegepast op een specifieke browserversie. Een waarde van IE 9.0 geeft bijvoorbeeld aan dat de registratie wordt toegepast voor Internet Explorer versie 9.0. Het CSSLink-besturingselement detecteert de waarde.

Thema

Het thema-webserverbesturingselement past een thema toe op een SharePoint-site. Er zijn verschillende tools beschikbaar die u kunt gebruiken om thema’s te maken; bijvoorbeeld Theme Builder op Microsoft Connect. Nadat u een thema (.thmx-bestanden) heeft gemaakt, uploadt u dit naar de galerij Thema's op de pagina Instellingen (/_catalogs/theme/ Formulieren/AllItems.aspx). Als u een thema wilt toepassen, gaat u naar de pagina Sitethema (/_layouts/themeweb.aspx).

Het volgende is een voorbeeld.

HTML

<link rel="stylesheet" type="tekst/css" href="/_catalogs/theme/Themed/54E2D43/search-7E1AFF02.css?ctag=1"/> <link rel="stylesheet" type="tekst/css" href="/_catalogs/theme/Themed/54E2D43/wiki-ECF524AA.css?ctag=1"/> <link rel="stylesheet" type="tekst/css" href="/_catalogs/theme/Themed/54E2D43/corev4-8A0ABD2F.css?ctag=1"/>

Wanneer u een thema toepast, maakt SharePoint een nieuwe themamap die alle CSS- en afbeeldingsbestanden bevat die nodig zijn om het thema weer te geven. De nieuwe themamap verschijnt niet in Site-instellingen of in Alle inhoud bekijken. Door SharePoint Designer te gebruiken, kunt u themabestanden bekijken, zoals weergegeven in Figuur 6.

Figuur 6. SharePoint-thema's