중첩 템플릿의 기준으로 사용하려는 템플릿에서 문서를 제작할 수 있습니다. 이렇게 하려면 다음 중 하나를 수행하십시오.
마지막 업데이트 날짜
2024년 4월 25일
Dreamweaver에서 디자인 요소를 공유하는 페이지의 내용을 제어하기 위해 중첩 템플릿을 만드는 방법을 학습합니다.
중첩 템플릿은 다른 템플릿을 기반으로 디자인과 편집 가능한 영역이 만들어진 템플릿입니다.중첩 템플릿은 많은 디자인 요소를 공유하지만 페이지 간에 약간의 차이가 있는 사이트의 페이지에서 콘텐츠를 제어하는 데 유용합니다.예를 들어, 기본 템플릿은 더 넓은 디자인 영역을 포함하고 사이트의 많은 콘텐츠 참여자가 사용할 수 있는 반면, 중첩 템플릿은 사이트의 특정 섹션에 대한 페이지에서 편집 가능한 영역을 더 구체적으로 정의할 수 있습니다.
기본 템플릿의 편집 가능한 영역은 중첩 템플릿으로 전달되며, 이러한 영역에 새로운 템플릿 영역이 삽입되지 않는 한 중첩 템플릿에서 생성한 페이지에서 편집 가능한 상태로 유지됩니다.
기본 템플릿의 변경 사항은 해당 기본 템플릿을 기반으로 하는 템플릿과 기본 및 중첩 템플릿을 기반으로 하는 모든 템플릿 기반 문서에서 자동으로 업데이트됩니다.
다음 예제에서 trioHome 템플릿은 Body, NavBar, Footer라는 세 개의 편집 가능한 지역을 포함합니다:
중첩 템플릿을 만들기 위해 템플릿을 기반으로 새 문서를 만든 다음 템플릿으로 저장하고 TrioNested라고 이름을 지정했습니다. 중첩 템플릿에서는 Body라는 편집 가능한 지역에 두 개의 편집 가능한 지역이 추가되었습니다.
중첩 템플릿으로 패스스루된 편집 가능한 지역에 새 편집 가능한 지역을 추가하면 편집 가능한 지역의 강조 표시 색상이 주황색으로 변경됩니다. editableColumn의 그래픽과 같이 편집 가능한 지역 외부에 추가하는 콘텐츠는 중첩 템플릿을 기반으로 하는 문서에서 더 이상 편집할 수 없습니다. 중첩 템플릿에서 추가되거나 기본 템플릿에서 패스스루된 파란색으로 강조 표시된 편집 가능한 영역은 중첩 템플릿을 기반으로 하는 문서에서 편집 가능한 상태로 유지됩니다. 편집 가능한 지역을 포함하지 않는 템플릿 지역은 템플릿 기반 문서에 편집 가능한 지역으로 패스스루됩니다.
중첩 템플릿 만들기
중첩 템플릿을 사용하면 기본 템플릿의 변형을 만들 수 있습니다.여러 템플릿을 중첩하여 점점 더 구체적인 레이아웃을 정의할 수 있습니다.
기본적으로 기본 템플릿의 모든 편집 가능한 템플릿 지역은 중첩 템플릿을 통해 중첩 템플릿을 기반으로 하는 문서로 패스스루됩니다. 즉, 기본 템플릿에서 편집 가능한 지역을 만든 다음 중첩 템플릿을 만들면 중첩 템플릿을 기반으로 하는 문서에 편집 가능한 지역이 나타납니다(중첩 템플릿의 해당 지역에 새 템플릿 지역을 삽입하지 않은 경우).
메모
편집 가능한 지역 내부에 템플릿 마크업을 삽입하여 중첩 템플릿을 기반으로 하는 문서에서 편집 가능한 지역으로 패스스루되지 않도록 할 수 있습니다. 이러한 지역은 파란색 테두리 대신 주황색 테두리를 갖습니다.
에셋 패널의 왼쪽 창에서 [템플릿]을 클릭합니다. 창 아래쪽에서 [새 템플릿]을 선택합니다.
[파일] > [새로 만들기]를 선택합니다. 새 문서 대화 상자에서 템플릿에서 페이지 카테고리를 선택한 다음 사용할 템플릿이 포함된 위치를 선택합니다. 템플릿 목록에서 템플릿을 두 번 클릭하여 새 문서를 만듭니다.
[파일] > [다른 이름으로 저장]을 선택합니다. 다른 이름으로 저장 대화 상자에서 파일 형식 드롭다운 목록의 템플릿 파일을 선택합니다.
다른 이름으로 저장 대화 상자에 이름을 입력하고 [확인]을 클릭하여 새 문서를 중첩 템플릿으로 저장합니다.
편집 가능한 지역이 중첩 템플릿으로 패스스루되는 것 방지
중첩 템플릿에서 패스스루 편집 가능 영역은 파란색 테두리를 가집니다.편집 가능한 지역 내부에 템플릿 마크업을 삽입하여 중첩 템플릿을 기반으로 하는 문서에서 편집 가능한 지역으로 패스스루되지 않도록 할 수 있습니다. 이러한 지역은 파란색 테두리 대신 주황색 테두리를 갖습니다.
코드 보기에서 패스스루를 방지하려는
편집 가능한 지역을 찾습니다.
편집 가능 영역은 템플릿 주석 태그로 정의됩니다.
다음 코드를 편집 가능 영역 코드에 추가합니다.
@@(" ")@@
이 템플릿 코드는 편집 가능한 지역을 둘러싸고 있는 <!-- InstanceBeginEditable --><!-- InstanceEndEditable --> 태그 내 어디에든 배치할 수 있습니다. 예:
<!-- InstanceBeginEditable name="EditRegion1" -->
<p>@@("")@@ 편집 가능 1 </p>
<!-- InstanceEndEditable -->
