문서 창에서 디자인 뷰로 전환하고 라이브러리 항목으로 저장할 문서의 부분을 선택합니다.
- Dreamweaver 사용 안내서
- 소개
- Dreamweaver 및 Creative Cloud
- Dreamweaver 작업 영역 및 보기 옵션
- 사이트 설정
- 파일 관리
- 레이아웃 및 디자인
- CSS
- 페이지 내용 및 에셋
- 페이지 속성 설정
- CSS 머리글 속성 및 CSS 링크 속성 설정
- 텍스트 작업
- 텍스트, 태그, 속성 찾기 및 바꾸기
- DOM 패널
- 라이브 뷰에서 편집
- Dreamweaver에서 문서 인코딩
- 문서 창에서 요소 선택 및 보기
- 속성 관리자에서 텍스트 속성 설정
- 웹 페이지 맞춤법 검사
- Dreamweaver에서 가로줄 사용
- Dreamweaver에서 글꼴 조합 추가 및 수정
- 에셋을 사용하여 작업
- Dreamweaver에서 날짜 삽입 및 업데이트
- Dreamweaver에서 즐겨찾기 에셋 만들기 및 관리
- Dreamweaver에서 이미지 삽입 및 편집
- 미디어 오브젝트 추가
- Dreamweaver에서 비디오 추가
- HTML5 비디오 삽입
- SWF 파일 삽입
- 오디오 효과 추가
- Dreamweaver에서 HTML5 오디오 삽입
- 라이브러리 항목을 사용하여 작업
- Dreamweaver에서 아랍어 및 히브리어 텍스트 사용
- 링크 및 내비게이션
- jQuery 위젯 및 효과
- 웹 사이트 코딩
- Dreamweaver에서의 코딩 정보
- Dreamweaver의 코딩 환경
- 코딩 환경 설정
- 코드 색상 표시 맞춤 설정
- 코드 작성 및 편집
- 코드 힌트 및 코드 완성
- 코드 축소 및 확장
- 스니펫으로 코드 재사용
- 코드 린트
- 코드 최적화
- 디자인 뷰에서 코드 편집
- 페이지의 헤드 내용 작업
- Dreamweaver에 서버측 포함 삽입
- Dreamweaver에서 태그 라이브러리 사용
- Dreamweaver에 사용자 정의 태그 가져오기
- JavaScript 비헤이비어 사용(일반 지침)
- 빌트인 JavaScript 비헤이비어 적용
- XML 및 XSLT 정보
- Dreamweaver에서 서버측 XSL 변환 수행
- Dreamweaver에서 클라이언트측 XSL 변환 수행
- Dreamweaver에서 XSLT의 문자 엔티티 추가
- 코드 서식 지정
- 제품 간 워크플로
- 템플릿
- Dreamweaver 템플릿 정보
- 템플릿 및 템플릿 기반 문서 인식
- Dreamweaver 템플릿 만들기
- 템플릿에서 편집 가능 영역 만들기
- Dreamweaver에서 반복 영역 및 표 만들기
- 템플릿의 옵션 영역 사용
- Dreamweaver에서 편집 가능 태그 속성 정의
- Dreamweaver에서 중첩 템플릿을 만드는 방법
- 템플릿 편집, 업데이트 및 삭제
- Dreamweaver에서 xml 내용 내보내기 및 가져오기
- 기존 문서에서 템플릿 적용 또는 제거
- Dreamweaver 템플릿의 내용 편집
- Dreamweaver에서 템플릿 태그에 대한 구문 규칙
- 템플릿 영역의 강조 표시 환경 설정
- Dreamweaver에서 템플릿 사용 시 이점
- 모바일 및 멀티스크린
- 다이내믹 사이트, 페이지 및 웹 양식
- 웹 애플리케이션 이해
- 애플리케이션 개발용 컴퓨터 설정
- 데이터베이스 연결 문제 해결
- Dreamweaver에서 연결 스크립트 제거
- 다이내믹 페이지 디자인
- 다이내믹 콘텐츠 소스 개요
- 다이내믹 콘텐츠의 소스 정의
- 페이지에 다이내믹 콘텐츠 추가
- Dreamweaver에서 다이내믹 콘텐츠 변경
- 데이터베이스 레코드 표시
- Dreamweaver에서 라이브 데이터 제공 및 문제 해결
- Dreamweaver에서 사용자 정의 서버 비헤이비어 추가
- Dreamweaver를 사용하여 양식 구성
- 양식을 사용하여 사용자 정보 수집
- Dreamweaver에서 ColdFusion 양식 작성 및 활성화
- 웹 양식 제작
- 양식 요소를 위한 HTML5 지원 개선
- Dreamweaver를 사용하여 양식 개발
- 애플리케이션의 시각적 구성
- 웹 사이트 테스트, 미리보기 및 게시
- 문제 해결
이 항목을 통해 Dreamweaver에서 라이브러리 항목을 만들고, 문서에서 라이브러리 항목을 삽입하고 편집하는 방법을 살펴보시기 바랍니다.
라이브러리는 웹 페이지에 배치할 수 있는 개별 에셋 또는 에셋 사본을 모아 놓은 Dreamweaver의 특수 파일입니다. 라이브러리에 있는 이러한 에셋을 라이브러리 항목이라고 합니다. 라이브러리에 저장할 수 있는 항목으로는 이미지, 표, 사운드 및 Adobe Flash로 만든 파일 등이 있습니다. 라이브러리 항목을 편집할 때마다 이 항목을 사용하는 모든 페이지를 자동으로 업데이트할 수 있습니다.
예를 들어 회사의 대규모 사이트를 구축하면서 모든 페이지에 슬로건을 표시하려는 경우를 가정해 봅니다. 이러한 경우 슬로건이 들어 있는 라이브러리 항목을 만들고 모든 페이지에서 이 라이브러리 항목을 사용할 수 있습니다. 슬로건이 바뀌면 라이브러리 항목을 변경하여 항목이 사용된 모든 페이지를 자동으로 업데이트할 수 있습니다.
Dreamweaver에서는 각 사이트의 로컬 루트 폴더 내에 있는 Library 폴더에 라이브러리 항목을 저장합니다. 각 사이트마다 자체 라이브러리가 있습니다.
문서의 body 섹션에 있는 텍스트, 표, 양식, Java 애플릿, 플러그인, ActiveX 요소, 내비게이션 바, 이미지 등의 모든 요소에서 라이브러리 항목을 만들 수 있습니다.
이미지와 같이 링크된 항목의 경우 라이브러리에는 항목에 대한 참조만 저장됩니다. 라이브러리 항목이 올바르게 작동하려면 원본 파일이 지정한 위치에 유지되어야 합니다.
그러나 라이브러리 항목에 이미지를 저장하는 것이 유용할 수도 있습니다. 예를 들어 라이브러리 항목에 전체 img 태그를 저장할 수 있어 이미지의 alt 텍스트 또는 src 속성까지도 쉽게 변경할 수 있습니다. 그러나, 이미지의 width 및 height 속성을 변경할 때는 이미지 편집기에서 이미지의 실제 크기를 변경하는 경우가 아니면 이 방법을 사용하지 마십시오.
라이브러리 항목에 링크가 포함된 경우 새 사이트에서는 이 링크가 작동하지 않습니다. 또한 라이브러리 항목의 이미지는 새 사이트로 복사되지 않습니다.
라이브러리 항목을 사용하면 Dreamweaver에서 웹 페이지에 항목 자체가 아닌 항목에 대한 링크를 삽입합니다. 즉, Dreamweaver에서는 해당 항목에 대한 HTML 소스 코드의 사본을 문서에 삽입하고 외부의 원본 항목에 대한 참조가 포함된 HTML 주석을 추가합니다. 이러한 외부 참조를 통해 자동 업데이트가 가능합니다.
Dreamweaver 비헤이비어가 연결된 요소를 포함하는 라이브러리 항목을 만들 때 Dreamweaver에서는 이 요소 및 해당 이벤트 핸들러(onClick, onLoad 또는 onMouseOver와 같은 액션을 트리거하는 이벤트 및 해당 이벤트가 발생할 때 호출하는 액션을 지정하는 속성)를 라이브러리 항목 파일로 복사합니다. 연결된 JavaScript 함수는 Dreamweaver에서 라이브러리 항목에 복사되지 않습니다. 대신 라이브러리 항목을 문서에 삽입할 때 Dreamweaver에서 적절한 JavaScript 함수를 문서의 head 섹션에 자동으로 삽입합니다(기존에 이 함수가 없는 경우).
JavaScript를 하드 코딩하는 경우(Dreamweaver 비헤이비어를 사용하지 않고 직접 만드는 경우) 코드 실행 시 JavaScript 호출 비헤이비어를 사용하면 JavaScript 코드를 라이브러리 항목의 일부로 만들 수 있습니다. Dreamweaver 비헤이비어를 사용하지 않고 코드를 실행하면 코드가 라이브러리 항목의 일부로 유지되지 않습니다.
라이브러리 항목의 비헤이비어를 편집하려면 특정 조건에 맞아야 합니다. 라이브러리 항목은 해당 요소의 코드가 head 섹션의 일부이므로 스타일 시트를 포함할 수 없습니다.
선택 항목을 기반으로 라이브러리 항목 만들기
-
-
[도구] > [라이브러리] > [라이브러리에 오브젝트 추가]를 선택합니다.
-
새 라이브러리 항목의 이름을 입력한 다음 Enter 키(Windows) 또는 Return 키(Macintosh)를 누릅니다.
Dreamweaver에서 각 라이브러리 항목은 사이트의 로컬 루트 폴더에 있는 Library 폴더에 파일 확장명이 .lbi인 별도의 파일로 저장됩니다.
빈 라이브러리 항목 만들기
-
문서 창에 선택된 항목이 없어야 합니다.
선택된 항목이 있으면 해당 항목이 새 라이브러리 항목에 놓이게 됩니다.
-
에셋 패널에서 [라이브러리] 범주를 선택합니다.
-
패널 하단에 있는 [새 라이브러리 항목] 버튼을 클릭합니다.
-
항목이 선택된 상태에서 항목 이름을 입력한 다음 Enter(Windows) 또는 Return(Macintosh) 키를 누릅니다.
문서에 라이브러리 항목 삽입
페이지에 라이브러리 항목을 추가하면 라이브러리 항목에 대한 참조와 함께 실제 내용이 문서에 삽입됩니다.
-
삽입 포인터를 문서 창에 놓습니다.
-
에셋 패널에서 [라이브러리] 범주를 선택합니다.
-
다음 중 하나를 수행합니다.
- 에셋 패널의 라이브러리 항목을 문서 창으로 드래그합니다.
참고:라이브러리 항목에 대한 참조를 제외하고 문서에 항목 내용만 삽입하려면 Ctrl 키(Windows) 또는 Option 키(Macintosh)를 누른 채로 항목을 에셋 패널 밖으로 드래그합니다. 이 방법으로 항목을 삽입하면 문서에서 항목을 편집할 수 있지만 라이브러리 항목을 사용하는 페이지를 업데이트할 때 문서가 업데이트되지는 않습니다.
라이브러리 항목을 선택하고 [삽입]을 클릭합니다.
라이브러리 항목 편집 및 문서 업데이트
라이브러리 항목을 편집할 때 해당 항목을 사용하는 모든 문서를 업데이트할 수 있습니다. 바로 업데이트하지 않더라도 문서와 라이브러리 항목의 연결 상태가 유지되므로 나중에 업데이트할 수 있습니다.
항목의 이름을 변경하여 항목과 문서 또는 템플릿 사이의 연결을 끊고 사이트의 라이브러리에서 항목을 삭제한 다음 누락된 라이브러리 항목을 다시 만들 수 있습니다.
라이브러리 항목 편집
-
에셋 패널에서 [라이브러리] 범주를 선택합니다.
-
라이브러리 항목을 선택합니다.
-
[편집] 버튼을 클릭하거나 라이브러리 항목을 더블 클릭합니다.
Dreamweaver에서 라이브러리 항목을 편집할 수 있는 문서 창과 비슷한 새 창이 열립니다. 회색 배경은 문서가 아닌 라이브러리 항목을 편집하고 있음을 나타냅니다.
-
원하는 대로 변경한 다음 저장합니다.
-
로컬 사이트에서 라이브러리 항목이 사용된 문서를 업데이트할지 여부를 지정합니다. 즉시 업데이트하려면 [업데이트]를 선택합니다. [업데이트 안 함]을 선택하면 [도구] > [라이브러리] > [현재 페이지 업데이트] 또는 [페이지 업데이트]를 선택할 때까지 문서가 업데이트되지 않습니다.
현재 문서를 업데이트하여 모든 라이브러리 항목의 현재 버전 사용
-
[도구] > [라이브러리] > [현재 페이지 업데이트]를 선택합니다.
특정 라이브러리 항목을 사용하는 모든 문서 또는 사이트 전체 업데이트
-
[도구] > [라이브러리] > [페이지 업데이트]를 선택합니다.
-
[찾는 위치] 팝업 메뉴에서 업데이트 대상을 지정합니다.
선택한 사이트의 모든 페이지를 업데이트하여 모든 라이브러리 항목의 현재 버전을 사용하려면 [사이트 전체]를 선택한 다음 바로 옆의 팝업 메뉴에서 사이트 이름을 선택합니다.
현재 사이트에서 라이브러리 항목이 사용된 모든 페이지를 업데이트하려면 [사용된 파일]을 선택한 다음 바로 옆의 팝업 메뉴에서 라이브러리 항목 이름을 선택합니다.
-
[업데이트] 옵션에 [라이브러리 항목]이 선택되어 있는지 확인합니다.참고:
템플릿을 동시에 업데이트하려면 [템플릿]도 선택합니다.
-
[시작]을 클릭합니다.
Dreamweaver에서 지정한 대로 파일이 업데이트됩니다. [로그 보기] 옵션을 선택한 경우 Dreamweaver에서 파일 업데이트에 성공했는지 여부 및 기타 정보를 보여 주는 보고서가 생성됩니다.
라이브러리 항목 이름 변경
-
에셋 패널에서 [라이브러리] 범주를 선택합니다.
-
라이브러리 항목을 선택한 다음 다시 클릭합니다. 이때 더블 클릭하면 편집을 위해 항목이 열리므로 더블 클릭하지 마십시오.
-
새 이름을 입력합니다.
-
다른 곳을 클릭하거나 Enter 키(Windows) 또는 Return 키(Macintosh)를 누릅니다.
-
[업데이트] 또는 [업데이트 안 함]을 선택하여 항목이 사용된 문서를 업데이트할지 여부를 지정합니다.
라이브러리에서 라이브러리 항목 삭제
라이브러리 항목을 삭제하면 Dreamweaver의 라이브러리에서 항목이 제거되지만 항목이 사용된 문서의 내용은 변경되지 않습니다.
-
에셋 패널에서 [라이브러리] 범주를 선택합니다.
-
해당 라이브러리 항목을 선택합니다.
-
[삭제] 버튼을 클릭하거나 Delete 키를 누른 다음 항목을 삭제할지 여부를 확인합니다.참고:
라이브러리 항목을 삭제하는 경우 실행 취소 명령을 사용하여 항목을 복구할 수 없습니다. 그러나 항목을 다시 만들 수는 있습니다.
누락되거나 삭제된 라이브러리 항목 다시 만들기
-
문서 중 하나에서 항목 인스턴스를 선택합니다.
-
속성 관리자(윈도우 > 속성)에서 [다시 생성] 버튼을 클릭합니다.
라이브러리 항목 강조 표시 사용자 정의
강조 표시 환경 설정을 지정하여 라이브러리 항목의 강조 색상을 사용자 정의하고 강조 표시를 표시하거나 숨길 수 있습니다.
라이브러리 항목의 강조 색상 변경
-
[편집] > [환경 설정](Windows) 또는 [Dreamweaver] > [환경 설정](Macintosh)을 선택합니다.
-
[환경 설정] 대화 상자의 왼쪽 목록에서 강조 표시 범주를 선택합니다.
-
[라이브러리 항목] 색상 상자를 클릭한 다음 색상 피커를 사용하여 강조 색상을 선택하거나 텍스트 상자에 16진수 값을 입력합니다.
-
강조 색상을 문서 창에 표시하려면 [표시]를 선택합니다.
-
[확인]을 클릭합니다.
문서 창에서 강조 표시 표시하거나 숨기기
-
[보기] > [디자인 뷰 옵션] > [시각 도구] > [보이지 않는 요소]를 선택합니다. 강조 표시를 숨기려면 [보이지 않는 요소]의 선택을 해제합니다.
라이브러리 항목 속성 편집
속성 관리자를 사용하여 라이브러리 항목을 편집을 위해 열거나, 선택한 라이브러리 항목을 해당 소스 파일에서 떼어내거나, 현재 선택한 라이브러리 항목으로 다른 항목을 덮어쓸 수 있습니다.
-
문서에서 라이브러리 항목을 선택합니다.
-
[속성 관리자](윈도우 > 속성)에서 다음 옵션 중 하나를 선택합니다.
소스
라이브러리 항목의 소스 파일 이름 및 위치를 표시합니다. 이 정보는 편집할 수 없습니다.
열기
편집을 위해 라이브러리 항목의 소스 파일을 엽니다. 이는 에셋 패널에서 항목을 선택하고 [편집] 버튼을 클릭하는 것과 같습니다.
원본에서 떼어내기
선택된 라이브러리 항목과 소스 파일 간의 링크를 끊습니다. 문서에서 떼어낸 항목을 편집할 수는 있지만 이러한 항목은 더 이상 라이브러리 항목이 아니며 원본을 변경할 때 업데이트되지 않습니다.
다시 만들기
원본 라이브러리 항목을 현재 선택한 내용으로 덮어씁니다. 원본 라이브러리 항목이 누락되거나 실수로 삭제된 경우 이 옵션을 사용하여 라이브러리 항목을 다시 만듭니다.
라이브러리 항목을 문서에서 편집 가능 상태로 만들기
문서에 라이브러리 항목을 추가한 경우 해당 페이지에서만 항목을 편집하려면 문서의 항목과 라이브러리 간의 링크를 끊어야 합니다. 라이브러리 항목의 인스턴스를 편집 가능 상태로 만들고 나면 해당 인스턴스는 라이브러리 항목을 변경할 때 업데이트되지 않습니다.
-
현재 문서에서 라이브러리 항목을 선택합니다.
-
속성 관리자(윈도우 > 속성)에서 [원본에서 떼어내기]를 클릭합니다.
라이브러리 항목의 비헤이비어 편집
라이브러리 항목의 비헤이비어를 편집하려면 먼저 문서에 항목을 삽입한 다음 항목을 해당 문서에서 편집 가능한 상태로 만들어야 합니다. 변경한 후에는 라이브러리 항목을 다시 만들어 라이브러리의 항목을 문서에서 편집한 항목으로 바꿀 수 있습니다.
-
라이브러리 항목이 포함된 문서를 엽니다.
라이브러리 항목의 이름과 여기에 포함된 태그를 정확히 적어 둡니다. 나중에 이 정보가 필요합니다.
-
라이브러리 항목을 선택하고 속성 관리자(윈도우 > 속성)에서 [원본에서 떼어내기]를 클릭합니다.
-
비헤이비어가 연결된 요소를 선택합니다.
-
[비헤이비어] 패널([윈도우] > [비헤이비어])에서 변경할 액션을 더블 클릭합니다.
-
표시되는 대화 상자에서 필요한 사항을 변경한 다음 [확인]을 클릭합니다.
-
에셋 패널에서 [라이브러리] 범주를 선택합니다.
-
원본 라이브러리 항목의 이름을 대/소문자를 구분하여 정확히 적어 둔 다음 항목을 선택하고 [삭제] 버튼을 클릭합니다.
-
문서 창에서 라이브러리 항목을 구성하는 모든 요소를 선택합니다.
원본 라이브러리 항목에 있는 것과 정확히 동일한 요소를 선택해야 합니다.
-
에셋 패널에서 [새 라이브러리 항목] 버튼을 클릭한 다음 동일한 철자와 대/소문자를 사용하여 삭제한 항목과 같은 이름으로 새 항목을 지정합니다.
-
사이트의 다른 문서에서 라이브러리 항목을 업데이트하려면 [도구] > [라이브러리] > [페이지 업데이트]를 선택합니다.
-
[찾는 위치] 팝업 메뉴에서 [사용된 파일]을 선택합니다.
-
바로 옆의 팝업 메뉴에서 방금 만든 라이브러리 항목의 이름을 선택합니다.
-
[업데이트] 옵션에서 [라이브러리 항목]이 선택되었는지 확인한 다음 [시작]을 클릭합니다.
-
업데이트가 완료되면 [닫기]를 클릭합니다.