디자인 보기에서 페이지의 텍스트를 선택하거나 다이내믹 텍스트를 추가할 위치를 클릭하세요.
마지막 업데이트 날짜
2024년 4월 25일
메모
Dreamweaver의 현재 버전 이후로 사용자 인터페이스가 간소화되었습니다. 따라서 이 문서에 설명된 옵션 중에 Dreamweaver의 현재 버전에 없는 옵션이 있을 수 있습니다. 자세한 내용은 이 문서를 참조하십시오.
동적 내용 추가하기 정보
하나 이상의 다이내믹 콘텐츠 소스를 정의한 후 페이지에 다이내믹 콘텐츠를 추가하기 위해 해당 소스를 사용할 수 있습니다.콘텐츠 소스에는 레코드세트의 열, HTML 양식으로 제출된 값, 서버 객체에 포함된 값 또는 기타 데이터가 포함될 수 있습니다.
Dreamweaver에서는 웹 페이지나 해당 HTML 소스 코드의 거의 모든 위치에 다이내믹 콘텐츠를 배치할 수 있습니다.삽입 지점에 다이내믹 콘텐츠를 배치하거나, 텍스트 문자열을 바꾸거나, HTML 속성으로 삽입할 수 있습니다.예를 들어, 다이내믹 콘텐츠는 이미지의 src 속성이나 양식 필드의 value 속성을 정의할 수 있습니다.
바인딩 패널에서 콘텐츠 소스를 선택하여 페이지에 다이내믹 콘텐츠를 추가할 수 있습니다.Dreamweaver는 브라우저가 페이지를 요청할 때 콘텐츠 소스에서 페이지의 HTML 코드로 데이터를 전송하도록 서버에 지시하는 서버측 스크립트를 페이지 코드에 삽입합니다.
특정 페이지 요소를 동적으로 만드는 방법은 여러 가지가 있는 경우가 많습니다.예를 들어, 이미지를 다이내믹으로 만들려면 바인딩 패널, 속성 관리자 또는 [삽입] 메뉴의 [이미지] 명령을 사용할 수 있습니다.
기본적으로 HTML 페이지에는 한 번에 레코드 하나만 표시할 수 있습니다. 레코드세트의 다른 레코드를 표시하려면 레코드를 한 번에 하나씩 탐색할 수 있는 링크를 추가하거나, 단일 페이지에 둘 이상의 레코드를 표시하는 반복 지역을 만들 수 있습니다.
동적 텍스트 정보
다이내믹 텍스트는 기존 텍스트나 삽입 지점에 적용된 모든 텍스트 서식을 따릅니다.예를 들어, CSS(Cascading Style Sheet) 스타일이 선택한 텍스트에 영향을 주는 경우, 이를 바꾸는 다이내믹 콘텐츠도 해당 스타일의 영향을 받습니다.Dreamweaver 텍스트 서식 도구를 사용하여 다이내믹 콘텐츠의 텍스트 서식을 추가하거나 변경할 수 있습니다.
동적 텍스트에 데이터 서식을 적용할 수도 있습니다. 예를 들어, 데이터가 일자로 구성된 경우 미국의 04/17/00과 같은 특정 일자 형식을 지정할 수 있습니다.또는 캐나다 방문자를 위한 17/04/00 형식으로 지정할 수 있습니다.
텍스트를 동적으로 만들기
기존 텍스트를 다이내믹 텍스트로 바꾸거나 페이지의 특정 삽입 지점에 다이내믹 텍스트를 배치하세요.
동적 텍스트 추가
바인딩 패널([창] > [바인딩])에서
목록에서 콘텐츠 소스를 선택합니다.레코드세트를 선택한 경우
레코드세트에서 원하는 열을 지정합니다.
내용 소스에는 일반 텍스트(ASCII 텍스트)가 들어 있어야 합니다. 일반 텍스트에는 HTML이 포함됩니다. 목록에 콘텐츠 소스가 나타나지 않거나 사용 가능한 콘텐츠 소스가 요구 사항을 충족하지 않는 경우, 더하기(+) 버튼을 클릭하여 새 콘텐츠 소스를 정의합니다.
(선택 사항) 텍스트의 데이터 서식을 선택합니다.
[삽입]을 클릭하거나 내용 소스를 페이지로 드래그합니다.
동적 내용 자리 표시자가 나타납니다. (페이지에서 텍스트를 선택한 경우 자리 표시자가 텍스트 선택을 바꿉니다.)레코드세트 콘텐츠의 자리 표시자는 {RecordsetName.ColumnName} 구문을 사용하며, 여기서 Recordset은 레코드세트의 이름이고 ColumnName은 레코드세트에서 선택한 열의 이름입니다.
경우에 따라 다이내믹 텍스트 자리 표시자의 길이로 인해 문서 창에서 페이지 레이아웃이 왜곡될 수 있습니다.다음 항목에서 설명하는 것과 같이 빈 중괄호를 자리 표시자로 사용하여 문제를 해결할 수 있습니다.
다이내믹 텍스트에 대한 자리 표시자 표시
[편집] > [환경 설정] > [보이지 않는 요소](Windows) 또는 [Dreamweaver] > [환경 설정] > [보이지 않는 요소](Macintosh)를 선택하세요.
[동적 텍스트 표시 방법] 팝업 메뉴에서 { }을
선택하고 [확인]을 클릭하세요.
이미지를 동적으로 만들기
페이지의 이미지를 동적으로 만들 수 있습니다. 예를 들어, 자선 경매에서 판매할 아이템을 표시하는 페이지를 디자인한다고 가정해 보세요. 각 페이지에는 설명 텍스트와 한 아이템의 사진이 포함됩니다. 페이지의 일반 레이아웃은 각 아이템마다 동일하게 유지되지만, 사진(및 설명 텍스트)은 변경될 수 있습니다.
디자인 보기([보기] >
[디자인])에서 페이지를 열고, 이미지를 표시할
페이지의 위치에 삽입점을 놓으세요.
[삽입] > [이미지]를 선택합니다.
[이미지 소스 선택] 대화 상자가 나타납니다.
[데이터 소스] 옵션(Windows) 또는 [데이터 소스]
버튼(Macintosh)을 클릭하세요.
내용 소스 목록이 나타납니다.
목록에서 내용 소스를 선택하고 [확인]을 클릭합니다.
콘텐츠 소스는 이미지 파일에 대한 경로를 포함하는 레코드 집합이어야 합니다. 사이트의 파일 구조에 따라 경로는 절대, 문서 상대 또는 루트 상대일 수 있습니다.
메모
Dreamweaver는 현재 데이터베이스에 저장된 바이너리 이미지를 지원하지 않습니다.
목록에 레코드 집합이 표시되지 않거나 사용 가능한 레코드 집합이 필요를 충족하지 않는 경우 새 레코드 집합을 정의하세요.
HTML 속성을 동적으로 만들기
HTML 속성을 데이터에 바인딩하여 페이지의 모양을 동적으로 변경할 수 있습니다. 예를 들어, 테이블의 배경 속성을 레코드 집합의 필드에 바인딩하여 테이블의 배경 이미지를 변경할 수 있습니다.
바인딩 패널 또는 속성 인스펙터를 사용하여 HTML 속성을 바인딩할 수 있습니다.
바인딩 패널로 HTML 속성을 동적으로 만들기
[창] > [바인딩]을 선택하여
바인딩 패널을 여세요.
바인딩 패널에 사용하려는
데이터 소스가 나열되어 있는지 확인하세요.
콘텐츠 소스에는 바인딩하려는 HTML 속성에 적합한 데이터가 포함되어야 합니다. 콘텐츠 소스가 목록에 나타나지 않거나 사용 가능한 콘텐츠 소스가 필요를 충족하지 않는 경우 더하기(+) 버튼을 클릭하여 새 데이터 소스를 정의하세요.
디자인 뷰에서 HTML 오브젝트를 선택합니다.
예를 들어, HTML 테이블을 선택하려면 테이블 안을 클릭하고 문서 창의 왼쪽 하단에 있는 태그 선택기에서 <table> 태그를 클릭하세요.
바인딩 패널에서
목록에서 콘텐츠 소스를 선택하세요.
[바인딩 대상] 상자에서
팝업 메뉴에서 HTML 속성을 선택하세요.
[바인딩]을 클릭합니다.
다음에 페이지가 애플리케이션 서버에서 실행될 때 데이터 소스의 값이 HTML 속성에 할당됩니다.
속성 인스펙터로 HTML 속성을 동적으로 만들기
디자인 보기에서
HTML 개체를 선택하고 속성 인스펙터([창] >
[속성])를 여세요.
예를 들어 HTML 테이블을 선택하려면 테이블 내부를 클릭한 다음 문서 창의 왼쪽 하단에 있는 태그 선택기에서 <table> 태그를 클릭합니다.
다이내믹 콘텐츠 소스를 HTML 속성에 바인딩하는 방법은 해당 소스의 위치에 따라 달라집니다.
바인딩할 속성이 속성 관리자에서 폴더 아이콘 옆에 있는 경우, 폴더 아이콘을 클릭하여 파일 선택 대화 상자를 엽니다. 그런 다음 데이터 소스 옵션을 클릭하여 데이터 소스 목록을 표시합니다.
바인딩할 속성에 폴더 아이콘이 없는 경우, 인스펙터 왼쪽의 목록 탭(두 탭 중 아래쪽)을 클릭하십시오.
속성 인스펙터의 목록 보기가 나타납니다.
바인딩할 속성이 목록 보기에 나열되지 않은 경우 더하기(+) 버튼을 클릭한 다음 속성 이름을 입력하거나 작은 화살표 버튼을 클릭하여 팝업 메뉴에서 속성을 선택하십시오.
속성의 값을 동적으로 만들려면 속성을 클릭한 다음 속성 행 끝에 있는 번개 아이콘 또는 폴더 아이콘을 클릭하십시오.
번개 아이콘을 클릭한 경우 데이터 소스 목록이 나타납니다.
폴더 아이콘을 클릭한 경우 파일 선택 대화 상자가 나타납니다.[데이터 소스] 옵션을 선택하여 내용 소스의 목록을 표시합니다.
콘텐츠 소스 목록에서 콘텐츠 소스를 선택하고 [확인]을 클릭하십시오.
콘텐츠 소스는 바인딩할 HTML 속성에 적합한 데이터를 포함해야 합니다.목록에 콘텐츠 소스가 나타나지 않거나 사용 가능한 콘텐츠 소스가 요구 사항에 맞지 않는 경우, 새 콘텐츠 소스를 정의하십시오.
다음에 페이지가 애플리케이션 서버에서 실행될 때 데이터 소스의 값이 HTML 속성에 할당됩니다.
ActiveX, Flash 및 기타 객체 매개변수를 다이내믹으로 만들기
Java 애플릿과 플러그인의 매개변수뿐만 아니라 ActiveX, Flash, Shockwave, Director 및 Generator 객체의 매개변수도 동적으로 만들 수 있습니다.
시작하기 전에 레코드세트의 필드에 바인딩할 객체 매개변수에 적합한 데이터가 있는지 확인하십시오.
디자인 보기에서 페이지의 객체를 선택하고 속성 관리자를 엽니다([창] > [속성]).
[매개 변수] 버튼을 클릭합니다.
매개변수가 목록에 나타나지 않는 경우, 더하기(+) 버튼을 클릭하고 매개변수 열에 매개변수 이름을 입력하십시오.
매개변수의 값 열을 클릭한 다음 번개 아이콘을 클릭하여 동적 값을 지정하십시오.
데이터 소스 목록이 나타납니다.
목록에서 데이터베이스를 선택하고 [확인]을 클릭합니다.
데이터 소스는 바인딩할 객체 매개변수에 적합한 데이터를 포함해야 합니다.목록에 데이터 소스가 나타나지 않거나 사용 가능한 데이터 소스가 요구 사항에 맞지 않는 경우, 새 데이터 소스를 정의하십시오.
