(0) exportieren Drucken
Alle erweitern
Erweitern Minimieren

Erstellen eines Entwurfs für SharePoint 2010-Suchfelder und -Felder für globale Navigation (Wrox)

SharePoint 2010

Veröffentlicht: Oktober 2011

Zusammenfassung: Informationen zum Entwerfen und Anpassen der globalen Navigation und des Suchfelds in Microsoft SharePoint Server 2010. Dieser Artikel enthält ein Beispiel für die Erstellung einer neuen Gestaltungsvorlage und CSS-Datei mithilfe von Microsoft SharePoint Designer.

Wrox-Logo

Bücher von Wrox zu SharePoint (in englischer Sprache)

Gilt für: Microsoft SharePoint Server 2010, Microsoft SharePoint Foundation 2010

Autor: Christian Stahl

Redakteure: Technische Redakteure von WROX für Artikel zu SharePoint 2010

Inhalt

Einführung in das Erstellen eines Entwurfs für die globale Navigation und das Suchfeld

Branding umfasst weitaus mehr als Produktbilder und Farbpaletten. Es soll auch gewährleisten, dass eine Website eine übersichtliche Benutzerumgebung bietet. Mithilfe von Gestaltungsvorlagen, Seitenlayouts und Cascading Stylesheets (CSS) können Sie für ein einheitliches Aussehen und Verhalten sorgen, das auf allen Seiten mühelos geändert werden kann.

Formatvorlagen spielen beim Branding einer SharePoint-Benutzeroberfläche eine besondere Rolle. Sie können das Aussehen und Verhalten einer Seite ändern, indem Sie die Schriftart, den Schriftgrad oder Farben eines bestimmten Elements ändern, was alles in einer einzelnen CSS-Datei erfolgen kann. Sie können diese Formatvorlagen direkt in der Gestaltungsvorlage, im Seitenlayout oder auf der Websiteseite ändern oder aber den Code in der CSS-Datei bearbeiten, der der Seite zugeordnet ist.

Der Schwerpunkt dieses Artikels liegt auf Aufgaben, die Sie in SharePoint Designer für das Branding der globalen Navigation in Microsoft SharePoint Server 2010 ausführen können.

Das Branding der globalen Navigation in SharePoint

Das globale Navigationsschema ist in einer SharePoint-Website besonders wichtig. Zu den globalen Navigationselementen gehören Links zu Websites und Seiten in der Websitesammlung sowie Links zu anderen wichtigen Abschnitten der Websitesammlung. Das globale Navigationsschema dient der Orientierung der Benutzer, damit sie sich problemlos auf der Website bewegen können, und ist von besonderer Bedeutung für das Branding und Anpassen einer SharePoint-Website.

Streben Sie beim Branding der globalen Navigation Einfachheit und Ästhetik an. Lassen Sie die Möglichkeit zu, dass Benutzer sich bei der Suche nach Informationen mehr der Websitenavigation als der Suchfunktion bedienen. Platzieren Sie die Navigationselemente auf der Seite an den Stellen, an denen die Benutzer sie erwarten, und gestalten Sie diese Elemente benutzerfreundlich und leicht verständlich. Erwarten Sie nicht, dass Ihre Benutzer Geduld für Ihren Entwurf aufbringen. Der Zweck eines jeden Navigationselements auf der SharePoint-Seite muss offenkundig sein.

In SharePoint Server 2010 zeichnet sich die globale Navigation durch ungeordnete Listen und Listenelemente aus und stellt eher ein Standardmodell dar, das angepasst werden muss. Wenn Sie die Funktionalität sowie das Aussehen und Verhalten der Navigation gleichzeitig bearbeiten möchten, bieten sich das SharePoint-Steuerelement AspMenu, dessen Datenquelle und CSS-Dateien an. Die Datei CoreV4.css definiert mehrere Klassen zum Gestalten der globalen Navigationselemente. Mit einer benutzerdefinierten CSS-Datei können Sie verschiedene globale Elemente außer Kraft setzen.

Im folgenden Beispiel erstellen Sie eine benutzerdefinierte Gestaltungsvorlage und CSS-Datei zum Ändern der Standardfarben der Navigationsliste. Sie haben mehrere Möglichkeiten, das für die Navigation gewünschte Aussehen und Verhalten zu erhalten. Dieses Beispiel wirkt sich nur auf die Farbe der Navigationsliste, die Farbe beim Zeigen auf ein Element und die Farbe der ausgewählten Registerkarte aus (siehe Abbildung 1).



Abbildung 1. Auswählen der Registerkartenfarbe

Registerkarten-Farbauswahl

Erstellen einer neuen Gestaltungsvorlage und CSS-Datei für das Branding

In diesem Abschnitt wird beschrieben, wie das Aussehen und Verhalten der globalen Navigation entsprechend den Brandinganforderungen eines Unternehmens geändert werden. Befolgen Sie die folgenden Anweisungen zum Erstellen einer neuen Gestaltungsvorlage, die auf einer Datei vom Typ v4.master basiert, und ordnen Sie eine neue CSS-Datei zu, die Klassen enthält.

Hh528515.note(de-de,office.14).gifHinweis:

Gestaltungsvorlagen und Seitenlayouts sind standardmäßig nur für Websitesammlungs-Administratoren aktiviert.

So erstellen Sie eine neue Gestaltungsvorlage

  1. Öffnen Sie SharePoint Designer 2010, klicken Sie auf Websites und dann auf Website öffnen.

  2. Geben Sie die URL der Website ein, z. B. http://myserver, und klicken Sie dann auf Öffnen.

  3. Klicken Sie links im Navigationsbereich auf Websiteobjekte und dann auf Gestaltungsvorlagen. Klicken Sie links neben v4.master auf das Symbol, um die Gestaltungsvorlage auszuwählen.

  4. Klicken Sie im Menüband auf Kopieren und anschließend auf Einfügen. Der Dateiname lautet nun v4_copy(1).master.

  5. Klicken Sie auf die Datei und anschließend im Menüband auf Auschecken.

  6. Klicken Sie im Feld Dateiinformationen auf die Verknüpfung mit der Datei, und benennen Sie sie in CustomMaster.master um.

  7. Klicken Sie auf eine Stelle außerhalb des Felds und dann auf Speichern.

  8. Klicken Sie im Bereich Anpassung auf Datei bearbeiten, um die Datei zu öffnen.

So erstellen Sie eine neue CSS-Datei, die der neuen Gestaltungsvorlage zugeordnet wird

  1. Klicken Sie links im Navigationsbereich auf Alle Dateien und dann im Fenster auf der rechten Seite auf Formatbibliothek.

  2. Klicken Sie auf dem Menüband auf Datei, und wählen Sie im Menü CSS aus.

  3. Benennen Sie die Datei in CustomCss.css um.

So fügen Sie in der Gestaltungsvorlage einen Verweis auf "CustomCss.css" hinzu

  1. Klicken Sie auf die Registerkarte CustomMaster.master, und fügen Sie den Verweis in der Codeansicht hinzu. Geben Sie den folgenden Code in einer neuen Zeile unmittelbar unter der Zeile mit SharePoint:CssLink ein.

    <SharePoint:CssLink runat=”server” Version=”4”/>
    <!--Custom CSS-->
    <SharePoint:CssRegistration name=”/Style Library/CustomCss.css” runat=”server” After=”corev4.css”/>
    
  2. Speichern Sie die Gestaltungsvorlage, und klicken Sie anschließend im Dialogfeld auf Ja.



    Auf dem Front-End-Webserver mit SharePoint finden Sie in der Datei corev4.css die folgenden CSS-Standardklassen für die globale Navigation. Wenn Sie eine neue CSS-Datei für Ihre benutzerdefinierte Gestaltungsvorlage (z. B. CustomCss.css) angeben, überschreiben die von Ihnen definierten Klassen die Klassen in corev4.css. Sie können CSS-Dateien wie CustomCss.css nach Belieben in einem anderen Ordner der Stammwebsite speichern. Fügen Sie die folgenden CSS-Klassen in die Datei CustomCss.css ein, und speichern Sie die Datei anschließend.



    /* Navigation list */
    .s4-tn{
    background-color:#00557B;
    padding:0px; margin:0px;
    }
    /* Global navigation */
    .s4-tn li.static > .menu-item{
    color:#fff; 
    white-space:nowrap;
    border:1px solid transparent;
    padding:4px 10px;
    line-height:12px;
    height:15px;
    }
    /* Hover */
    .s4-tn li.static > a:hover{
    background:url("/_layouts/Images/selbg.png") repeat-x left top;
    background-color:#0087C1;
    color:#fff;
    text-decoration:none;
    }
    /* Selected */
    .s4-toplinks .s4-tn a.selected{
    background:url("/_layouts/images/selbg.png") repeat-x left top;
    background-color:#0087C1;
    color:#fff;
    text-decoration:none;
    border:1px transparent solid;
    padding-right:10px;
    padding-left:10px;
    margin:0px;
    }
    
  3. Vergewissern Sie sich, dass die Dateien veröffentlicht und genehmigt wurden, indem Sie in SharePoint Designer zu jeder Datei navigieren und sie auswählen. Nach Auswahl der Datei muss im Menüband die Eincheckoption angezeigt werden. Nach dem Einchecken der Datei können Sie sie veröffentlichen.

Sie haben soeben eine benutzerdefinierte Gestaltungsvorlage erstellt und eine benutzerdefinierte CSS-Datei (CustomCss.css) zugewiesen, deren Klassen die Standardeinstellungen in der SharePoint-CSS-Datei überschreiben. Nachdem Sie die globale Navigation zu einem bestimmten Grad angepasst haben, müssen Sie nun die Gestaltungsvorlage der obersten Website (und aller Websites, die von dieser erben) angeben. Nach dem Wechsel zur neuen Gestaltungsvorlage können Sie die Datei CustomCss.css weiter bearbeiten.

Wechseln Sie zum Übernehmen der Einstellungen Gestaltungsvorlage der Website und Systemgestaltungsvorlage zur obersten Website Ihres SharePoint-Projekts, und navigieren Sie zu Websiteeinstellungen. Wenn Sie möchten, dass alle Websites in der Websitesammlung die neue Gestaltungsvorlage übernehmen, die der neuen CSS-Datei zugeordnet ist, setzen Sie alle Unterwebsites zurück.

Das Branding des Suchfelds

Die CSS-Klassen im vorherigen Abschnitt ermöglichen nur einfache Änderungen, z. B. der Hintergrundfarben für die globale Navigation. Mithilfe eines Stellvertretungs-Steuerelements können Sie jedoch sämtliche Facetten einer Website anpassen, beispielsweise das Sucheingabefeld oder bereichsbezogene Suchfeld.

Auf der Benutzeroberfläche von SharePoint 2010 befindet sich zumeist ein Suchfeld. Es kann erforderlich sein, dieses Steuerelement zu ändern, insbesondere wenn es auf einer öffentlich zugänglichen Website angezeigt wird, auf der das Suchfeld eines der wichtigsten Entwurfselemente ist. Das Anpassen des SharePoint-Suchfelds kann eine schwierige Aufgabe sein, die eine hohe Aufmerksamkeit hinsichtlich Position und Verwalten sowie Funktionalität des Steuerelements verlangt.

Beachten Sie beim Gestalten des Suchfelds Folgendes:

  • Sorgen Sie dafür, dass es auf jeder Seite leicht zu finden und einfach zu bedienen ist.

  • Wählen Sie für das Eingabefeld und die Schaltflächen eine geeignete Größe.

  • Öffnen Sie Ihre Website in verschiedenen Browsern, um zu prüfen, wie die angepassten Suchsteuerelemente angezeigt werden.

Anpassen des Sucheingabefelds

Das Steuerelement des Suchfelds wird in der Gestaltungsvorlage als Platzhalter gerendert und kann durch ein benutzerdefiniertes Steuerelement ersetzt werden, das von der SharePoint-Klasse SearchBoxEx geerbt wird. Das Steuerelement ist ein überaus konfigurierbares Webpart, das auch als ASP.NET-Steuerelement verwendet werden kann. Sie können jede Eigenschaft des Suchfeld-Webparts als Attribut für das Suchfeld-Websteuerelement verwenden.

Verwenden Sie zum Angeben einer Formatvorlage für das Suchfeld, z. B. einer Hintergrundfarbe, eines Hintergrundbilds oder einer Schriftfarbe, nur die CSS-Datei (siehe Abbildung 2). Sie müssen dazu weder die Gestaltungsvorlage ändern noch ein benutzerdefiniertes Steuerelement schreiben.



Abbildung 2. Beispiel eines angepassten Suchfelds

Beispiel für ein angepasstes Suchfeld

Mit dem folgenden Code können Sie der Datei CustomCss.css das CSS hinzufügen. Erstellen Sie in diesem Beispiel eine Suchschaltfläche im Format 24 x 22 Pixel. Dieses Bild wird in den Klassen .s4-search und .ms-sbgo verwendet.

/* Navigation list */
.s4-tn{
background-color:#00557B;
padding:0px; margin:0px;
}
/* Global navigation */
.s4-tn li.static > .menu-item{
color:#fff; 
white-space:nowrap;
border:1px solid transparent;
padding:4px 10px;
line-height:21px;
height:24px;
}
/* Hover */
.s4-tn li.static > a:hover{
background:url("/_layouts/Images/selbg.png") repeat-x left top;
background-color:#0087C1;
color:#fff;
text-decoration:none;
}
/* Selected */
.s4-toplinks .s4-tn a.selected{
background:url("/_layouts/images/selbg.png") repeat-x left top;
background-color:#0087C1;
color:#fff;
text-decoration:none;
border:1px transparent solid;
padding-right:10px;
padding-left:10px;
margin:0px;
}
.s4-search input.ms-sbplain{
height:12px; 
padding:4px; padding-right:0px;
margin:4px; margin-right:0px;
background-color:#D8E5F3;
border:1px #8BA0BC solid!important; 
color:#333; 
font-size:11px; 
}
.s4-search .ms-sbgo{
padding-top:5px; padding:0;
margin:0; 
}
.s4-search .ms-sbgo a{
background-image:url('/Style Library/MSDN/Images/GoSearching.png'); 
background-repeat:no-repeat;
width:27px; height:22px; 
display:block; 
}
.ms-sbscopes, .s4-search .srch-gosearchimg{
display:none; 

Festlegen eines Felds für das Suchfeld mithilfe von jQuery

Wenn Sie einen Wert für das Suchfeld festlegen möchten, können Sie jQuery verwenden. Fügen Sie einen Verweis auf die neueste Version von jQuery in den Headerabschnitt Ihrer angepassten Gestaltungsvorlage und anschließend den folgenden Verweis unter Ihrem Verweis auf CustomCss.css ein.

<script type="text/javascript" src="/Style Library/Jquery/jquery-1.4.2.min.js"></script>

Fügen Sie das folgende Skript unmittelbar über dem letzten Headertag in die Gestaltungsvorlage ein.

<script type="text/javascript">
$(document).ready(function(){
 $('.ms-sbplain').val('Search..');
 $(".ms-sbplain").focus(function() {
   $(this).val('')
 });  
});
</script> 

Da das Suchfeld für das Auffinden von Informationen sehr wichtig sein kann, können Sie es auf der Seite auffälliger gestalten, indem Sie seine Höhe und Breite vergrößern und eine größere Schrift festlegen. Das folgende CSS erleichtert alle diese Aufgaben. In diesem Beispiel wird auch ein größeres Symbol für das Suchfeld verwendet (siehe Abbildung 3).



Abbildung 3. Suchfeld mit größerem Suchsymbol

Suchfeld mit größerem Suchsymbol

Fügen Sie die folgenden CSS-Klassen in die Datei CustomCss.css ein.

/* Navigation list */
.s4-tn{
background-color:#00557B;
padding:0px; margin:0px;
}
/* Global navigation */
.s4-tn li.static > .menu-item{
color:#fff; 
white-space:nowrap;
border:1px solid transparent;
padding:4px 10px;
line-height:23px;
height:26px;
}
/* Hover */
.s4-tn li.static > a:hover{
background:url("/_layouts/Images/selbg.png") repeat-x left top;
background-color:#0087C1;
color:#fff;
text-decoration:none;
}
/* Selected */
.s4-toplinks .s4-tn a.selected{
background:url("/_layouts/images/selbg.png") repeat-x left top;
background-color:#0087C1;
color:#fff;
text-decoration:none;
border:1px transparent solid;
padding-right:10px;
padding-left:10px;
margin:0px;
}
/* ---------------------- SEARCH BOX ------------------------ */
.s4-search input.ms-sbplain{
height:20px; 
width:250px!important;
padding-left:4px; 
padding-right:0px; padding-top:5px!important; padding-bottom:5px!important;
margin:4px; margin-right:0px; margin-top:0px!important; margin-bottom:5px!important;
line-height:18px!important;
background-color:#D8E5F3;
border:1px #8BA0BC solid!important; 
color:#333; 
font-size:14px; 
}
.s4-search .ms-sbgo{
padding-top:5px; padding:0px; margin:0; 
}
.s4-search .ms-sbgo a{
background-image:url('/Style Library/MSDN/Images/Go8.png'); 
background-repeat:no-repeat;
width:32px; height:32px; 
margin-right:5px; margin-bottom:5px;
display:block; 
}
.s4-search .ms-sbgo a:hover{
background-image:url('/Style Library/MSDN/Images/Go8Hover.png'); 
}
.ms-sbscopes, .s4-search .srch-gosearchimg{
display:none; 
} 

Erweitern des Suchfelds mit einer Popuptastatur

Eine virtuelle Tastatur kann für die Eingabe der gewünschten Zeichen hilfreich sein und weist nicht die Einschränkungen der sprachspezifischen Tasten auf der physischen Tastatur auf. Das gilt insbesondere, wenn Sie eine Sprache verwenden möchten, die nicht auf dem lateinischen Alphabet basiert. In anderen Fällen können Sie eine Popuptastatur nutzen, um auf der Anmeldeseite einer Bank sichere Informationen einzugeben, das Aufzeichnen von Tastatureingaben einschränken oder ein Steuerelement auf einem Formular erstellen.



Abbildung 4. Popuptastatur

Popuptastatur

Wenn Sie das Suchfeld mit einer Popuptastatur erweitern möchten, die Eingaben von der Maus annimmt, arbeiten Sie mit jQuery. Im Beispiel in diesem Abschnitt wird ein jQuery-Plug-In namens Keypad verwendet, das geringfügig angepasst wurde, damit es in das Suchfeld in SharePoint passt.

Fügen Sie einen Verweis auf die neueste Version von jQuery in den Headerabschnitt Ihrer angepassten Gestaltungsvorlage und unmittelbar darunter den folgenden Verweis auf das Plug-In Keypad ein.

<script type="text/javascript" src="/Style Library/MSDN/jquery.keypad.js"></script> 

Fügen Sie das folgende Skript unmittelbar über dem Ende-Tag des Headers in die Gestaltungsvorlage ein. In diesem Beispiel wird auch ein Symbol (32 x 32 Pixel) für die Tastatur verwendet.

<script type="text/javascript">
// jQuery keypad
$(document).ready(function(){
$('.ms-sbplain').keypad({showOn: 'button', 
  keypadOnly: false, layout: $.keypad.qwertyLayout, buttonImage: '/Style Library/MSDN/Images/keyboard.png', prompt: ''
  }); 
});
</script>

Fügen Sie die folgenden CSS-Klassen in CustomCss.css ein. Wenn Sie das vorherige Beispiel wiederverwenden möchten, müssen Sie zunächst die Klassen löschen.

/* Navigation list */
.s4-tn{
background-color:#00557B;
padding:0px; margin:0px;
}
/* Global navigation */
.s4-tn li.static > .menu-item{
color:#fff; 
white-space:nowrap;
border:1px solid transparent;
padding:4px 10px;
line-height:23px;
height:26px;
}
/* Hover */
.s4-tn li.static > a:hover{
background:url("/_layouts/Images/selbg.png") repeat-x left top;
background-color:#0087C1;
color:#fff;
text-decoration:none;
}
/* Selected */
.s4-toplinks .s4-tn a.selected{
background:url("/_layouts/images/selbg.png") repeat-x left top;
background-color:#0087C1;
color:#fff;
text-decoration:none;
border:1px transparent solid;
padding-right:10px;
padding-left:10px;
margin:0px;
}
.s4-search input.ms-sbplain{
height:20px; 
width:250px!important;
padding-left:40px; padding-right:0px; padding-top:5px!important; padding-bottom:5px!important;
margin:4px; margin-right:0px; margin-top:0px!important; margin-bottom:5px!important;
line-height:18px!important;
background-color:#D8E5F3;
border:1px #8BA0BC solid!important; 
color:#333; 
font-size:14px; 
}
.s4-search .ms-sbgo{
padding-top:5px; padding:0px; margin:0; 
}
.s4-search .ms-sbgo a{
background-image:url('/Style Library/MSDN/Images/Go8.png'); 
background-repeat:no-repeat;
width:32px; height:32px; 
margin-right:5px; margin-bottom:5px;
display:block; 
}
.s4-search .ms-sbgo a:hover{
background-image:url('/Style Library/MSDN/Images/Go8Hover.png'); 
}
.ms-sbscopes, .s4-search .srch-gosearchimg{
display:none; 
}
/* - Classes for the keyboard - */
.keypad-popup {
background-color:#D8E5F3;
margin-top:2px;
border:1px #888 solid
}
.keypad-trigger {
width:43px;height:39px;
padding: 0px; border:0px;
background-color:transparent; 
position:absolute; display:table-cell;
}
img.keypad-trigger {
margin: 2px; vertical-align: middle;
}
#keypad-div {
display: none; z-index: 10;
margin: 0; padding: 0;
background-color: #fff;
color: #000; border: 1px solid #888;
font-family: Verdana;
font-size: 12px;
}
.keypad-keyentry {
display: none;
}
.keypad-inline {
background-color: #ccc;
border: 1px solid #888;
}
.keypad-disabled {
position: absolute; z-index: 100;
background-color: #fff; 
filter: alpha(opacity=50);
}
.keypad-rtl {
direction: rtl;
}
.keypad-prompt {
clear: both; width: 100%; text-align: center;
}
.keypad-row {
clear: both;
}
.keypad-space {
float: left; margin: 2px; width: 24px;
}
* html .keypad-space { /* IE6 */
margin: 0px; width: 28px;
}
.keypad-half-space {
float: left; margin: 1px; width: 12px;
}
* html .keypad-half-space { /* IE6 */
margin: 0px; width: 14px;
}
.keypad-key {
font-family: Tahoma;
font-size:10px;
float: left; margin: 2px;
padding: 0px; width: 24px;
background-color: #f7f7f7;
text-align: center;
cursor: pointer;
}
.keypad-key[disabled] {
border: 2px outset;
}
.keypad-key-down {
}
.keypad-spacebar {
width: 164px;
}
.keypad-clear, .keypad-back, .keypad-close, .keypad-shift {
width: 52px; color: #333;
font-weight: normal;
background-color:#E9E9E9
}
.keypad-cover {
display: none;
display: block;
position: absolute;
z-index: -1; filter: mask();
top: -4px; left: -4px;
width: 125px; height: 200px ;}

Anpassen des bereichsbezogenen Suchfelds mit einem benutzerdefinierten Steuerelement

Mithilfe von CSS oder bei Bedarf jQuery können Sie das Aussehen und Verhalten des Suchfelds wesentlich ändern. Es kann jedoch auch Situationen geben, in denen Sie einige der Standardattribute des Steuerelements ändern müssen. Um beispielsweise die Dropdownliste des Steuerelements anzuzeigen, ersetzen Sie das Stellvertretungs-Steuerelement in der Gestaltungsvorlage durch ein benutzerdefiniertes Steuerelement.

Zum Verwenden eines benutzerdefinierten Steuerelements müssen Sie das SPSWC-Tag des Steuerelements in der Gestaltungsvorlage registrieren. Fügen Sie die entsprechende Registrierungsanweisung für das Präfix des SPSWC-Tag des Steuerelements oben in der Gestaltungsvorlage entsprechend den anderen Registrierungsanweisungen hinzu.

<%@ Register Tagprefix="SPSWC" Namespace="Microsoft.SharePoint.Portal.WebControls" 
        Assembly="Microsoft.SharePoint.Portal, Version=14.0.0.0, Culture=neutral, 
        PublicKeyToken=71e9bce111e9429c" %>

Ersetzen Sie den Inhaltsplatzhalter und dessen Stellvertretungs-Steuerelement durch das folgende Websteuerelement. Platzieren Sie es dort, wo es angezeigt werden soll.

<SPSWC:SearchBoxEx id="SearchBox" runat="server" 
    GoImageUrl="/_layouts/images/gosearch.gif" 
    GoImageUrlRTL="/_layouts/images/gosearch.gif" 
    DropdownModeEx=ShowDD 
    DropdownWidth="120"
    UseSiteDefaults="true" 
    QueryPromptString="Keyword(s)"
    FrameType="None" 
    WebPart="true" __WebPartId="{551E15C2-FF48-4670-BC26-FA1BDD992F74}"
/>

Platzieren Sie den nicht verwendeten Platzhalter dort, wo das Stellvertretungs-Steuerelement eingefügt wurde, z. B. am Ende der Gestaltungsvorlage. Setzen Sie den Platzhalter in DIV-Tags, die Sie als hidden festlegen, um sicherzustellen, dass kein Seitenlayout den Platzhalter überschreiben kann. Sie können auch ein ASP-Feld verwenden und auf false festlegen. Der von diesem Feld umgebene Inhaltsplatzhalter ist ausgeblendet.

<div style="visibility:hidden"> <asp:ContentPlaceHolder id="PlaceHolderSearchArea" runat="server"> </asp:ContentPlaceHolder></div>

Alternativ können Sie mit SharePoint Designer 2010 das Steuerelement vorbereiten und anschließend mit Microsoft Visual Studio das standardmäßige SharePoint-Suchsteuerelement anpassen und bereitstellen.

Schlussbemerkung

Das Branding ermöglicht Unternehmen, harmonische Beziehungen zu ihren Kunden aufzubauen, indem es ihnen leicht gemacht wird, sich mit ihren bevorzugten Produkten und Dienstleistungen zu identifizieren. Das Branding dient zum Aufbauen von Erwartungen zu Produkten, die Kunden mit einem bestimmten Unternehmen assoziieren. Teil des Brandings einer Firmenwebsite ist das Anpassen der Navigation durch die Website, um eine positive Benutzererfahrung auf der Website sicherzustellen. Mithilfe von SharePoint können Sie für ein einheitliches Aussehen und Verhalten sorgen, das problemlos auf sämtlichen Seiten geändert werden kann. Sie können auch ein Suchfeld so anpassen, dass alle Kunden Ihre Website mühelos durchsuchen können.

Informationen zum Autor

Christian Stahl arbeitet seit 2003 als Berater, Trainer und Referent für Microsoft SharePoint-Technologien und hat sich auf das SharePoint-Branding und die Front-End-Entwicklung spezialisiert. Er ist nicht nur ein SharePoint Server MVP, sondern auch ein Microsoft Certified Trainer (MCT). Christian ist Mitverfasser von "Beginning SharePoint 2010 Administration" (herausgegeben durch Wrox), unterhält einen Blog und leitet die SharePoint Designers-Community. Auf Twitter finden Sie Christian unter dem Namen @cstahl.

Die folgenden technischen Redakteure haben an Microsoft SharePoint 2010-Artikeln von Wrox mitgearbeitet:

  • Matt Ranlett ist ein SQL Server MVP und war über viele Jahre eine feste Institution der .NET-Entwicklercommunity in Atlanta. Als Gründungsmitglied von Atlanta Dot Net Regular Guys hat Matt mehrere regionale Benutzergruppen gegründet und leitet diese. Nach der Arbeit verbringt er viele Stunden mit lokalen und nationalen Communityaktivitäten, wie beispielsweise der SharePoint 1, 2, 3!-Reihe, der Organisation von drei Codecamps in Atlanta, der Tätigkeit als Vice President of Technology im Vorstand von INETA sowie Auftritten bei mehreren Podcasts wie z. B. .Net Rocks und dem ASP.NET-Podcast. Dennoch fand Matt kürzlich Zeit, sich mit einer wunderbaren Frau namens Kim zu verheiraten, die er bei der Aufzucht von drei riesigen Hunden unterstützt. Matt arbeitet derzeit als Seniorberater für Intellinet und gehört dem Team an, das mithilfe von innovativen Lösungen für den Erfolg von Unternehmen sorgt.

  • Jake Dan Attis. Was Muster, Praxis und Steuerung im Hinblick auf die SharePoint-Entwicklung betrifft, sind Sie bei Jake Dan Attis goldrichtig. Er ist von Moncton, Kanada, in die Region Atlanta gezogen und hat einen Abschluss in angewandter Mathematik, ist aber ein hundertprozentiger SharePoint-Hardcoreentwickler. Normalerweise nimmt Dan an Community-Events in der Region Atlanta teil, hält dort Vorträge oder organisiert derartige Events, wie beispielsweise Codecamps, SharePoint-Samstage und die SharePoint-Benutzergruppe in Atlanta. Wenn Dan einmal nicht in Visual Studio arbeitet, verbringt er gerne Zeit mit seiner Tochter Lily, schaut sich Hockey und Football an und kostet weltweite Biersorten.

  • Kevin Dostalek kann über 15 Jahre Erfahrung in der IT-Branche sowie über 10 Jahre Erfahrung in der Verwaltung großer IT-Projekte und der Führung von IT-Personal aufweisen. Er hat Projekte für Unternehmen ganz unterschiedlicher Größe geleitet und hatte verschiedene Funktionen inne, wie beispielsweise Entwickler, Architekt, Business Analyst, technischer Leiter, Manager Entwicklung, Projektmanager, Programm-Manager und Mentor/Coach. Darüber hinaus hat Kevin zwischen 2005 und 2008 auch als Vice President eine Lösungsbereitstellungsabteilung für einen MS Gold Partner mittlerer Größe geleitet und war später auch als Vice President of Innovation and Education tätig. Anfang 2010 gründete Kevin das Unternehmen Kick Studios, das Beratungs-, Entwicklungs- und Schulungsservices für die Spezialbereiche SharePoint und Social Computing anbietet. Seitdem ist er auch bei zahlreichen Benutzergruppenversammlungen, Treffen und Konferenzen im ganzen Land als Referent aufgetreten. Weitere Informationen zu Kevin finden Sie in seinem Blog "The Kickboard".

  • Larry Riemann verfügt über mehr als 17 Jahre Erfahrung im Entwurf und der Entwicklung von Geschäftsanwendungen für einige der weltweit größten Unternehmen. Larry ist ein unabhängiger Berater, Eigentümer von Indigo Integrations und bietet SharePoint-Beratung ausschließlich über SharePoint911 an. Er ist Autor, veröffentlicht Artikel und hält gelegentlich Vorträge auf Konferenzen. In den letzten Jahren befasste er sich in erster Linie mit SharePoint, dem Entwickeln und Erweitern von über SharePoint hinausgehender Funktionalität. Neben seiner Arbeit an SharePoint ist Larry ein ausgebildeter .NET-Architekt und verfügt über umfangreiches Know-how in Sachen Systemintegration, Unternehmensarchitektur und Hochverfügbarkeitslösungen. Weitere Informationen zu Larry finden Sie in seinem Blog.

  • Sundararajan Narasiman ist ein technischer Architekt bei der Content Management & Portals Group von Cognizant Technology Solutions, Chennai, und verfügt über mehr als 10 Jahre Branchenerfahrung. Sundararajan ist in erster Linie als Architektur- und Technologieberater für die SharePoint Server 2010-Stapel- und Mainstream .NET 3.5-Entwicklung tätig. Er ist ein begeisterter Programmierer und interessiert sich auch für Extremprogrammierung und EDT.

Weitere Ressourcen

Änderungsverlauf

Datum Beschreibung Grund

Oktober 2011

Erstveröffentlichung

Community-Beiträge

HINZUFÜGEN
Microsoft führt eine Onlineumfrage durch, um Ihre Meinung zur MSDN-Website zu erfahren. Wenn Sie sich zur Teilnahme entscheiden, wird Ihnen die Onlineumfrage angezeigt, sobald Sie die MSDN-Website verlassen.

Möchten Sie an der Umfrage teilnehmen?
Anzeigen:
© 2014 Microsoft