Design Manager in SharePoint 2013: eenvoudigere lay-outs en basispagina’ s
in alle vorige releases was het maken van basispagina ‘ s en-lay-outs zeker niet gemakkelijk voor een ontwerper gezien de technische aspecten ervan. De ontwerpers zouden moeten begrijpen SharePoint en welke componenten zijn verplicht op de master page en hoe ze maken om hun ontwerpen tot leven komen.
in SharePoint 2013 is er een nieuwe functie genaamd Design Manager die zal helpen om de ontwerpaspecten te scheiden van de technische vereisten om een basispagina te maken. Ontwerper hoeft niet te weten welke componenten nodig zijn op een basispagina. De Design Manager helpt bij het maken van de hoofdpagina van eenvoudige HTML, CSS-bestanden. De ontwerper hoeft zich nu alleen maar zorgen te maken over zijn ontwerp en dat om te zetten in HTML, CSS en afbeeldingen. Zodra deze artefacten klaar zijn, kan de design manager deze verwerken om een basispagina te genereren.
het proces om een basispagina aan te maken is heel eenvoudig:
1. Maak de lay-out die u wilt met behulp van de HTML-editor van uw keuze.
2. Maak het css-bestand dat uw ontwerp ondersteunt.
3. Voeg de afbeeldingen toe die deel uitmaken van uw ontwerp.
4. Upload alle bestanden naar de hoofdpagina galerij. (Er is een zeer handige manier om dit te doen en bewerkingen te maken tijdens het ontwikkelen en tweaken van uw HTML).
a. Open uw hoofdpagina-galerij in windows Verkenner.
b. Kopieer de map html, CSS en afbeeldingen naar de hoofdpagina galerij.
5. Wanneer u het HTML-bestand uploadt, wijst u de HTML-basispagina toe als het inhoudstype. (facultatief)
6. Alle andere bestanden kunnen worden toegewezen aan het ontwerp bestanden inhoudstype. (facultatief)
7. Ga naar de pagina Site-instellingen.
8. Klik op Design Manager onder de categorie” Look & Feel”.
9. Of u kunt klikken op de knop Nieuwe Site acties aan de rechterkant en klik op Design Manager.
10. Ga naar de hoofdpagina ‘ s importeren.
11. Klik op” Converteer een HTML-bestand naar SharePoint master page ” link.
a. Dit opent een dialoogvenster waarin u een html-bestand kunt selecteren uit de hoofdpagina-galerij.
B. Selecteer het html-bestand dat u zojuist hebt geüpload.
12. Zodra u een bestand selecteert, zal SharePoint een basispagina voor dat ontwerp genereren. Als er fouten worden aangetroffen tijdens het conversieproces, zal het u op de hoogte.
13. Op dit moment is de basispagina gegenereerd.
14. Om de hoofdpagina aan te passen, klikt u op de link “conversie succesvol”.
a. Dit brengt u naar een voorbeeldpagina. Zoals u kunt zien op de screenshot hieronder SharePoint heeft geconverteerd en gemaakt van de basispagina.
SharePoint-componenten toevoegen aan de basispagina met behulp van Knipselbeheer:
1. Voordat we de basispagina aanpassen, opent u het Html-bestand dat u hebt geüpload in de editor van uw keuze in het venster Windows Verkenner waarin u de basispagina galerij hebt geopend.
2. Om de SharePoint-componenten toe te voegen, zoals de navigatie bovenaan en andere besturingselementen, webonderdelen, klikt u op de koppeling fragmenten in de rechterbovenhoek van de voorbeeldpagina.
3. Dit zal het openen van de knipsels galerij pagina.
4. Laten we zeggen dat je de bovenste navigatie wilt toevoegen aan je basispagina.
a. klik op de bovenste navigatieknop in het lint.
b. Hiermee wordt het HTML-fragment aangemaakt dat u nodig hebt.
c. kopieer het fragment naar het klembord.
d. (U kunt de eigenschappen van de bovenste navigatiecontrole aanpassen en op “Bijwerken” klikken om het nieuwe fragment te genereren.
5. Schakel over naar het html-bestand dat u hebt geopend in een editor in Stap 1.
6. Plak het HTML-fragment waar u wilt dat de bovenste navigatie in uw ontwerp verschijnt.
7. Sla het html-bestand op.
8. Vernieuw de voorbeeldpagina in uw browser en u zult zien dat de basispagina opnieuw is gegenereerd en uw wijzigingen zichtbaar zijn.
9. Op deze manier kunt u snel maken en werken op uw master page.
10. Om de basispagina te publiceren, selecteert u het html-bestand in de hoofdpagina galerij en publiceert u het. Dit zal automatisch het basispaginabestand ook publiceren en u zult in staat zijn om de basispagina voor de site in te stellen.
schermafbeelding: de gegenereerde basispagina met de navigatie bovenaan.
Tips:
1. Het html-bestand en de basispagina zijn aan elkaar gekoppeld.
2. SharePoint laat je de basispagina niet verwijderen zolang de associatie er nog is.
3. Om de associatie te verwijderen, gaat u naar de hoofdpagina galerij.
a. Selecteer het Html-bestand
b. Eigenschappen bewerken
c.Schakel het selectievakje “geassocieerd bestand” uit.
d. Save
4. Nu kunt u direct aan de basispagina werken door deze te bewerken.
5. Ook, terwijl de html en de hoofdbestanden zijn gekoppeld, kunt u het hoofdpagina bestand niet direct publiceren. Je moet het html-bestand selecteren en publiceren. Hiermee wordt de basispagina gepubliceerd en kunt u de basispagina voor de site instellen.
6. Suggestie: Zodra u de basispagina naar uw tevredenheid te bouwen, distantiëren van het html-bestand, verpakken de basispagina in een wsp en vervolgens implementeren in uw test, productie-omgevingen.
over de auteur
meer van deze auteur