방법: SiteMapPath 웹 서버 컨트롤의 모양 사용자 지정
업데이트: 2007년 11월
컨트롤의 특성을 설정하거나 컨트롤에 사용할 수 있는 템플릿을 구성하여 사이트 탐색 컨트롤의 모양을 사용자 지정할 수 있습니다. 템플릿과 스타일은 SiteMapPath의 "설명" 부분에 있는 두 가지 우선 순위 규칙에 따라 링크에 적용됩니다.
또한 컨트롤에 테마나 컨트롤 스킨을 적용하거나 사용자의 렌더링 요구 사항에 맞는 사용자 지정 사이트 탐색 컨트롤을 개발할 수도 있습니다. 웹 컨트롤에 테마를 적용하는 방법은 방법: ASP.NET CreateUserWizard 컨트롤 사용자 지정을 참조하십시오.
SiteMapPath 컨트롤은 현재 페이지에서 웹 사이트 홈 페이지로의 경로를 링크로 나타낸 탐색 경로(breadcrumb 또는 eyebrow라고도 함)를 표시합니다. ASP.NET 페이지에서 SiteMapPath 컨트롤은 다음과 같이 표시합니다.
Home > Services > Training
TreeView 및 Menu 컨트롤은 또한 사이트 맵 데이터를 렌더링하고, SiteMapPath 컨트롤과 비슷하게 거의 대부분의 다른 웹 컨트롤과 같이 사용자 지정될 수 있습니다. 이 항목에서는 SiteMapPath 웹 서버 컨트롤의 다음과 같은 사용자 지정 기능을 사용하는 방법에 대해 설명합니다.
링크 사이에 표시되는 문자 또는 이미지를 지정합니다.
탐색 경로의 방향을 반대로 합니다.
표시되는 부모 링크의 수를 지정합니다.
이 항목의 절차에서는 SiteMapPath 컨트롤이 포함된 사이트 맵과 페이지를 이미 만든 것으로 가정합니다. ASP.NET 사이트 맵에 있는 Web.sitemap 예제 파일을 사용할 수 있습니다.
링크 스타일 속성을 사용자 지정하려면
SiteMapPath 컨트롤이 포함된 ASP.NET 웹 페이지에서 다음 속성을 컨트롤에 추가합니다.
RootNodeStyle-Font-Names="Verdana" RootNodeStyle-ForeColor="Orange" RootNodeStyle-BorderWidth=2
예를 들어 SiteMapPath 컨트롤의 코드는 다음과 같을 수 있습니다.
<asp:SiteMapPath ID="SiteMapPath1" Runat="server" SkipLinkText="Skip Menu" RootNodeStyle-Font-Names="Verdana" RootNodeStyle-ForeColor="Orange" RootNodeStyle-BorderWidth=2 > </asp:SiteMapPath>
CssClass 속성을 비롯하여 Style 및 FontInfo 클래스에 설명된 대부분의 속성을 사용할 수 있습니다.
각 링크의 스타일을 다르게 하려면 SiteMapPath 컨트롤의 ParentNodeStyle, CurrentNodeStyle 및 PathSeperatorStyle 속성에 대해 이전 단계를 반복합니다.
참고:
성능 향상을 위해 NodeTemplate을 사용하여 모든 링크의 스타일을 한 번에 사용자 지정할 수 있습니다. 자세한 내용은 ASP.NET 웹 서버 컨트롤 템플릿을 참조하십시오.
링크 사이에 표시되는 문자를 사용자 지정하려면
SiteMapPath 컨트롤이 포함된 ASP.NET 웹 페이지에서 PathSeparator 속성을 컨트롤에 추가합니다.
예를 들어 SiteMapPath 컨트롤의 코드는 다음과 같을 수 있습니다.
<asp:SiteMapPath ID="SiteMapPath1" Runat="server" PathSeparator=" :: "> </asp:SiteMapPath>
SiteMapPath 컨트롤은 다음과 같은 모양을 표시합니다.
Home :: Services :: Training
링크는 모든 문자열을 사용하여 구분할 수 있지만 여기에서는 이미지를 사용합니다. 다음 절차를 따르십시오.
링크 사이에 표시되는 이미지를 지정하려면
SiteMapPath 컨트롤이 포함된 ASP.NET 웹 페이지에서 컨트롤에 다음 코드 줄을 추가합니다.
<PathSeparatorTemplate> <asp:Image ID="Image1" Runat="Server" Width="20" ImageUrl="Images/PathSeparatorImage.jpg" /> </PathSeparatorTemplate> </PathSeparatorTemplate>
예를 들어 SiteMapPath 컨트롤의 코드는 다음과 같을 수 있습니다.
<asp:SiteMapPath ID="SiteMapPath1" Runat="server" > <PathSeparatorTemplate> <asp:Image ID="Image1" Runat="Server" Width="20" ImageUrl="Images/PathSeparatorImage.jpg" /> </PathSeparatorTemplate> </PathSeparatorTemplate> </asp:SiteMapPath>
SiteMapPath 컨트롤로 표시되는 경로의 방향을 반대로 하려면
SiteMapPath 컨트롤이 포함된 ASP.NET 웹 페이지에서 PathDirection 및 PathSeparator를 컨트롤에 추가합니다.
예를 들어 SiteMapPath 컨트롤의 코드는 다음과 같을 수 있습니다.
<asp:SiteMapPath ID="SiteMapPath1" Runat="server" PathDirection="CurrentToRoot" PathSeparator=" <-- " > </asp:SiteMapPath>
표시되는 부모 링크의 수를 제한하려면
SiteMapPath 컨트롤이 포함된 ASP.NET 웹 페이지에서 ParentLevelsDisplayed 속성을 컨트롤에 추가합니다.
예를 들어 최대 두 개의 부모 링크를 표시하는 SiteMapPath 컨트롤의 코드는 다음과 같습니다.
<asp:SiteMapPath ID="SiteMapPath1" Runat="server" ParentLevelsDisplayed="2" > </asp:SiteMapPath>
내게 필요한 옵션
사이트 탐색 컨트롤은 일반적으로 웹 사이트의 모든 페이지에서 사용됩니다. 화면 판독기 및 기타 보조 장치는 페이지를 방문할 때와 다시 게시를 수행할 때마다 탐색 컨트롤의 텍스트를 큰 소리로 읽어 줍니다.
SiteMapPath, TreeView 및 Menu 사이트 탐색 컨트롤에는 반복되는 정보가 다음 페이지나 같은 페이지의 뷰에서 건너뛰도록 허용하는 SkipLinkText라는 속성이 각각 포함됩니다.
내게 필요한 옵션 건너뛰기 기능을 사용하려면
탐색 컨트롤이 포함된 ASP.NET 웹 페이지에서 다음 속성을 컨트롤에 추가합니다.
SkipLinkText="Skipped Menu"
예를 들어 SiteMapPath 컨트롤의 코드는 다음과 같을 수 있습니다.
<asp:SiteMapPath ID="SiteMapPath1" Runat="server" SkipLinkText="Skip Breadcrumb"> </asp:SiteMapPath>
참고 항목
작업
방법: ASP.NET CreateUserWizard 컨트롤 사용자 지정
개념
TreeView 웹 서버 컨트롤의 모양과 느낌 사용자 지정